Svelte render not working when performing browser mode tests

[chrisolsen]

The other day I started testing out the browser mode tests. Currently, any "util" function specs pass, but all the existing component specs and the one "test" browser spec fail with the same error message.

 FAIL |0|  libs/web-components/src/components/accordion/Accordion.spec.ts [ libs/web-components/src/components/accordion/Accordion.spec.ts ]
Error: Failed to parse source for import analysis because the content contains invalid JS syntax. If you are using JSX, make sure to name the file with the .jsx or .tsx extension.
  Plugin: vite:import-analysis
  File: /var/home/chris/Code/Work/ui-components/headless/libs/web-components/src/components/accordion/Accordion.svelte:67:10
  65 |      return [];
  66 |    }
  67 |  </script>
     |           ^
  68 |  
  69 |  <!-- HTML -->
 ❯ TransformPluginContext._formatError node_modules/vite/dist/node/chunks/dep-CB_7IfJ-.js:49255:41
 ❯ TransformPluginContext.error node_modules/vite/dist/node/chunks/dep-CB_7IfJ-.js:49250:16
 ❯ TransformPluginContext.transform node_modules/vite/dist/node/chunks/dep-CB_7IfJ-.js:63993:14
 ❯ PluginContainer.transform node_modules/vite/dist/node/chunks/dep-CB_7IfJ-.js:49096:18
 ❯ loadAndTransform node_modules/vite/dist/node/chunks/dep-CB_7IfJ-.js:51929:27

The components being tested are svelte components, but the transform that is being applied "seems" to be React even though the renderer is svelte as seen in the following code.

import { render } from "vitest-browser-svelte";
import { expect, test } from "vitest";

import Accordion from "./Accordion.svelte";

test("Accordion headless test", async () => {
  const screen = render(Accordion, {});
  const button = screen.getByRole("button");
  await expect.element(button).toBeInTheDocument();
});

Any ideas?

[chrisolsen]

I reverted my changes within the branch and re-ran the provided setup script and tests began to pass.