Support for Browser Mode

[eric1234]

Does this library support browser mode? When attempted it, I got errors related to certain CJS formatted modules not being converted to ESM (was able to work around this) as well it trying to use certain node libraries that are not available in the browser (maybe could polyfill it for testing?).

I can open an issue with the details of my problem if it's supposed to work or if it's within scope to add that support. OTOH, if that sort of configuration is out of the scope for this library I can look towards other libraries.

It seems odd that a framework which is designed to work in a browser (Svelte) would have a test library that can't run in that same runtime. I get the fake DOM libraries like jsdom and happydom have decent parity. But it's still a far cry from the real thing.

[eric1234]

Lol, nevermind. My previous attempts to work around it involved whitelisting the CJS modules it was having trouble importing with the optimizeDeps. When I instead just did optimizeDeps for the entire @testing-library/svelte it seemed to work out of the box:

optimizeDeps: {
  include: [
    '@testing-library/svelte'
  ],
},

[mcous]

@eric1234 I have not yet played around with browser mode while it's in its experimental phase, but I'm definitely curious to hear about your experience with it! This library doesn't do anything specific to JSDOM / happy-dom, it simply (via svelte and @testing-library/dom) expects a global window and document to be available.

Do things work at all without optimizeDeps? Given this module (and its dependencies) are ESM-native, I'm not sure why that would be needed. Again, though, I don't know much about browser mode and how Vitest configures Vite's bundling for this use-case

[eric1234]

Ah, tracked it down. It had to do with my step-by-step process of getting the tests up and running. My basic process was:

1. Setup vitest
2. Get regular JS tests working
3. Enable browser mode so it runs in the browser
4. Setup @testing-library/svelte to get Svelte tests working
5. 💣

If I swap step 3 and 4 then step 5 becomes 🥳 .

Basically if you run browser mode before adding actual Svelte tests to run there is something cached somewhere in node_modules so that even when you add the Svelte tests it explodes. But if the first time you run in browser mode you already have a Svelte test then you are golden. If you get the order wrong you can basically rm -rf node_modules.

At this point, I'm good on this issue so nothing needs to be done. But if you want to dig into it more I could probably send you some reproduction scripts.