Custom headers for @vitest/browser

[DenizUgur]

Describe the bug

When using @vitest/browser custom response headers in server.headers are not respected.

Reproduction

Try to use SharedArrayBuffer, without correct headers it's not possible to get a reference to that object.

System Info

System:
    OS: Linux 6.2 Ubuntu 22.04.3 LTS 22.04.3 LTS (Jammy Jellyfish)
    CPU: (32) x64 Intel(R) Core(TM) i9-14900K
    Memory: 54.10 GB / 62.57 GB
    Container: Yes
    Shell: 5.8.1 - /usr/bin/zsh
  Binaries:
    Node: 20.10.0 - ~/.nvm/versions/node/v20.10.0/bin/node
    npm: 10.2.3 - ~/.nvm/versions/node/v20.10.0/bin/npm
  Browsers:
    Chrome: 120.0.6099.129
  npmPackages:
    @vitejs/plugin-react: ^4.2.1 => 4.2.1 
    @vitest/browser: ^1.1.3 => 1.1.3 
    @vitest/coverage-v8: ~1.1.1 => 1.1.1 
    @vitest/ui: ~1.1.1 => 1.1.1 
    @vitest/web-worker: ^1.1.3 => 1.1.3 
    vite: ^5.0.10 => 5.0.10 
    vitest: ~1.1.1 => 1.1.1

Used Package Manager

npm

Validations

• Follow our Code of Conduct
• Read the Contributing Guidelines.
• Read the docs.
• Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
• Check that this is a concrete bug. For Q&A open a GitHub Discussion or join our Discord Chat Server.
• The provided reproduction is a minimal reproducible example of the bug.

[hi-ogawa]

I think your issue is same as #3743

Currently it should be possible to achieve crossOriginIsolated by using custom middleware plugin with enforce: "pre" as suggested in #3743

I haven't thought about using server.headers https://vitejs.dev/config/server-options.html#server-headers but maybe ideally that should work as well. Let me check.

[DenizUgur]

Yup, custom plugin solution works without a problem. It feels a bit hacky when we already have server.headers. It's just semantics though.

[hi-ogawa]

Good point. I wasn't aware of server.headers but I think Vitest browser mode should support that as well.

Currently main html document (which is where coop/coep headers are meant to be) is served by its own static middleware, so it's skipping Vite's normal processing to inject server.headers. Probably Vitest can copy those headers manually here.

vitest/packages/browser/src/node/index.ts

Lines 25 to 32 in a73c1c2

	async configureServer(server) {
	server.middlewares.use(
	base,
	sirv(resolve(distRoot, 'client'), {
	single: false,
	dev: true,
	}),
	)