chore: do not always return 200 on component testing network requests (#23408)

Fixes https://github.com/microsoft/playwright/issues/23364

See here about their AppTypes:
https://vitejs.dev/config/shared-options.html#apptype

packages/playwright-ct-core/src/vitePlugin.ts

@@ -109,6 +109,8 @@ export function createPlugin(
 
       viteConfig.root = rootDir;
       viteConfig.preview = { port, ...viteConfig.preview };
+      // Vite preview server will otherwise always return the index.html with 200.
+      viteConfig.appType = viteConfig.appType || 'custom';
 
       // React heuristic. If we see a component in a file with .js extension,
       // consider it a potential JSX-in-JS scenario and enable JSX loader for all

tests/components/ct-react17/tests/render.spec.tsx

@@ -59,3 +59,16 @@ testWithServer(
     await expect.soft(component).toHaveText('intercepted');
   }
 );
+
+test('should return 404 if server does not handle the request', async ({ page }) => {
+  test.info().annotations.push({ type: 'issue', description: 'https://github.com/microsoft/playwright/issues/23364' });
+  const helloPromise = page.waitForResponse('/hello');
+  const statusCode = await page.evaluate(async () => {
+    const response = await fetch('/hello');
+    return response.status;
+  });
+  expect(statusCode).toBe(404);
+  const response = await helloPromise;
+  expect(response.status()).toBe(404);
+  expect(response.statusText()).toBe('Not Found');
+});