test: add tests to check 404 handling in client-side rendering

test/basic.test.ts

@@ -249,6 +249,16 @@ describe('pages', () => {
     await serverPage.close()
   })
 
+  it('should render 404 page even in spa mode', async () => {
+    const { page } = await renderPage('/route-rules/spa')
+
+    await page.getByText('should throw a 404 error').click()
+    expect(await page.getByRole('heading').textContent()).toMatchInlineSnapshot(`"Page Not Found: /forbidden"`)
+    expect(await page.getByTestId('path').textContent()).toMatchInlineSnapshot(`" Path: /forbidden"`)
+
+    await page.close()
+  })
+
   it('returns 500 when there is an infinite redirect', async () => {
     const { status } = await fetch('/redirect-infinite', { redirect: 'manual' })
     expect(status).toEqual(500)

test/fixtures/basic/pages/route-rules/spa.vue

@@ -1,5 +1,10 @@
 <template>
+  <div>
     <div>
       should not be rendered on ssr
     </div>
+    <NuxtLink to="/forbidden">
+      should throw a 404 error
+    </NuxtLink>
+  </div>
 </template>