vitest-browser-qwik 0.2.2 → 0.3.2

package/README.md

@@ -43,7 +43,7 @@ export default defineConfig({
 
 ```tsx
 import { defineConfig } from 'vitest/config'
-import { qwikVite } from '@builder.io/qwik/optimizer'
+import { qwikVite } from '@qwik.dev/core/optimizer'
 
 // optional, run the tests in SSR mode
 import { testSSR } from 'vitest-browser-qwik/ssr-plugin'
@@ -97,7 +97,7 @@ test('renders counter with SSR', async () => {
 ### Hook Testing Example
 
 ```tsx
-import { useSignal } from "@builder.io/qwik";
+import { useSignal } from "@qwik.dev/core";
 import { expect, test } from "vitest";
 import { renderHook } from "vitest-browser-qwik";
 import { useCounter } from "./fixtures/useCounter";

package/dist/index.d.ts

@@ -1,5 +1,5 @@
-import { a as cleanup, c as renderServerHTML, i as SSRRenderOptions, o as render, r as RenderResult, s as renderHook } from "./pure-1MgDxC6b.js";
-import { JSXOutput } from "@builder.io/qwik";
+import { a as cleanup, c as renderServerHTML, i as SSRRenderOptions, o as render, r as RenderResult, s as renderHook } from "./pure-dqI6lsdL.js";
+import { JSXOutput } from "@qwik.dev/core";
 
 //#region src/index.d.ts
 declare function renderSSR(jsxNode: JSXOutput): Promise<RenderResult>;

package/dist/index.js

@@ -1,4 +1,4 @@
-import { i as renderServerHTML, n as render, r as renderHook, t as cleanup } from "./pure-BRpTMupH.js";
+import { i as renderServerHTML, n as render, r as renderHook, t as cleanup } from "./pure-BlLa_nxU.js";
 import { beforeEach } from "vitest";
 import { page } from "vitest/browser";
 

package/dist/{pure-BRpTMupH.js → pure-BlLa_nxU.js}

@@ -1,7 +1,7 @@
 import { utils } from "vitest/browser";
-import { component$, render } from "@builder.io/qwik";
-import { getQwikLoaderScript } from "@builder.io/qwik/server";
-import { jsx } from "@builder.io/qwik/jsx-runtime";
+import { component$, render } from "@qwik.dev/core";
+import { getQwikLoaderScript } from "@qwik.dev/core/server";
+import { jsx } from "@qwik.dev/core/jsx-runtime";
 
 //#region src/pure.tsx
 const { debug, getElementLocatorSelectors } = utils;
@@ -40,17 +40,17 @@ function setupContainer(baseElement, container) {
 		baseElement
 	};
 }
-function render$1(ui, { container, baseElement } = {}) {
+async function render$1(ui, { container, baseElement } = {}) {
 	csrQwikLoader();
 	const setup = setupContainer(baseElement, container);
-	render(setup.container, ui);
+	await render(setup.container, ui);
 	return createRenderResult(setup.container, setup.baseElement);
 }
 function setHTMLWithScripts(container, html) {
 	container.innerHTML = html;
 	container.querySelectorAll("script").forEach((oldScript) => {
 		const newScript = document.createElement("script");
-		for (const attr of oldScript.attributes) newScript.setAttribute(attr.name, attr.value);
+		for (const attr of Array.from(oldScript.attributes)) newScript.setAttribute(attr.name, attr.value);
 		newScript.text = oldScript.textContent ?? "";
 		oldScript.parentNode?.replaceChild(newScript, oldScript);
 	});
@@ -66,7 +66,7 @@ async function renderHook(hook) {
 	const renderPromise = new Promise((resolve) => {
 		resolveRender = resolve;
 	});
-	const screen = render$1(/* @__PURE__ */ jsx(component$(() => {
+	const screen = await render$1(/* @__PURE__ */ jsx(component$(() => {
 		resultContainer.value = hook();
 		resolveRender();
 		return /* @__PURE__ */ jsx("div", { "data-testid": "hook-result" });

package/dist/{pure-1MgDxC6b.d.ts → pure-dqI6lsdL.d.ts}

@@ -1,5 +1,5 @@
 import { Locator, LocatorSelectors, PrettyDOMOptions } from "vitest/browser";
-import { JSXOutput } from "@builder.io/qwik";
+import { JSXOutput } from "@qwik.dev/core";
 
 //#region src/pure.d.ts
 interface RenderResult extends LocatorSelectors {
@@ -20,7 +20,7 @@ interface SSRRenderOptions {
 declare function render$1(ui: JSXOutput, {
   container,
   baseElement
-}?: RenderOptions): RenderResult;
+}?: RenderOptions): Promise<RenderResult>;
 declare function renderServerHTML(html: string, {
   container,
   baseElement

package/dist/pure.d.ts

@@ -1,2 +1,2 @@
-import { a as cleanup, c as renderServerHTML, i as SSRRenderOptions, n as RenderOptions, o as render, r as RenderResult, s as renderHook, t as RenderHookResult } from "./pure-1MgDxC6b.js";
+import { a as cleanup, c as renderServerHTML, i as SSRRenderOptions, n as RenderOptions, o as render, r as RenderResult, s as renderHook, t as RenderHookResult } from "./pure-dqI6lsdL.js";
 export { RenderHookResult, RenderOptions, RenderResult, SSRRenderOptions, cleanup, render, renderHook, renderServerHTML };

package/dist/pure.js

@@ -1,3 +1,3 @@
-import { i as renderServerHTML, n as render, r as renderHook, t as cleanup } from "./pure-BRpTMupH.js";
+import { i as renderServerHTML, n as render, r as renderHook, t as cleanup } from "./pure-BlLa_nxU.js";
 
 export { cleanup, render, renderHook, renderServerHTML };

package/dist/ssr-plugin.js

@@ -1,5 +1,4 @@
 import { dirname, relative, resolve } from "node:path";
-import { symbolMapper } from "@builder.io/qwik/optimizer";
 import MagicString from "magic-string";
 import { parseSync } from "oxc-parser";
 import { ResolverFactory } from "oxc-resolver";
@@ -212,40 +211,80 @@ function hasCommandsImport(node) {
 	if (!isImportDeclaration(node) || node.source?.value !== "vitest/browser" || !node.specifiers) return false;
 	return node.specifiers.some((spec) => spec.type === "ImportSpecifier" && spec.imported.type === "Identifier" && spec.imported.name === "commands");
 }
+const getClientModule = async (viteServer, moduleId) => {
+	const clientEnv = viteServer.environments.client;
+	await clientEnv.fetchModule(moduleId);
+	const resolved = await clientEnv.moduleGraph.resolveUrl(moduleId);
+	const resolvedId = resolved?.[1];
+	if (!resolvedId) throw new Error(`Could not resolve module "${moduleId}" in client environment`);
+	const module = clientEnv.moduleGraph.getModuleById(resolvedId);
+	console.log("Resolved client module", moduleId, resolved, module);
+	if (!module) throw new Error(`Module "${moduleId}" not found in client module graph.`);
+	return module;
+};
 async function renderComponentToSSR(ctx, Component, props = {}) {
 	const viteServer = ctx.project.vite;
-	const { jsx } = await viteServer.ssrLoadModule("@builder.io/qwik");
+	const { jsx } = await viteServer.ssrLoadModule("@qwik.dev/core");
 	const jsxElement = jsx(Component, props);
-	const { renderToStream } = await viteServer.ssrLoadModule("@builder.io/qwik/server");
-	let html = "";
+	const { renderToStream } = await viteServer.ssrLoadModule("@qwik.dev/core/server");
+	const mapping = {};
+	if (!ctx.testPath) throw new Error("ctx.testPath is required for SSR rendering");
+	const module = await getClientModule(viteServer, ctx.testPath);
+	for (const importedModule of module?.importedModules || []) {
+		const meta = importedModule.info?.meta;
+		if (meta?.segment) {
+			const symbol = meta.segment.hash;
+			if (symbol && importedModule.id) mapping[symbol] = `/@fs${importedModule.id}`;
+		}
+	}
+	const handlersId = (await getClientModule(viteServer, "@qwik.dev/core/handlers.mjs")).id;
+	if (!handlersId) throw new Error("Handlers module ID could not be resolved");
+	const handlersExports = await viteServer.ssrLoadModule("@qwik.dev/core/handlers.mjs");
+	for (const key of Object.keys(handlersExports)) if (key.startsWith("_")) mapping[key] = handlersId;
+	const qwikManifest = {
+		manifestHash: "dev",
+		mapping
+	};
+	console.log(mapping);
+	let html = "<script>var _import=(s)=>{console.log('importing', s);return import(s)}<\/script>";
 	await renderToStream(jsxElement, {
+		manifest: qwikManifest,
 		containerTagName: "div",
 		base: "/",
-		qwikLoader: { include: "always" },
-		symbolMapper: globalThis.qwikSymbolMapper,
 		stream: { write(chunk) {
-			html += chunk;
+			html += chunk.replace(/=import\(/g, "=_import(");
 		} }
 	});
+	console.log("FINAL HTML", html);
 	return { html };
 }
 
 //#endregion
 //#region src/ssr-plugin.ts
 const isJSorTS = createRegExp(exactly(".").and(anyOf("j", "t")).and("s").and(maybe("x")).at.lineEnd());
+function isBrowserOnlySource(source) {
+	if (!source) return false;
+	return source === "vitest" || source.startsWith("vitest/") || source === "vitest-browser-qwik" || source.startsWith("vitest-browser-qwik/") || source.includes("@vitest/");
+}
+function referencesStrippedId(node, strippedIds) {
+	if (!node || typeof node !== "object") return false;
+	if (node.type === "Identifier") return strippedIds.has(node.name);
+	if (node.type === "MemberExpression") return referencesStrippedId(node.object, strippedIds);
+	if (isCallExpression(node)) return referencesStrippedId(node.callee, strippedIds);
+	return false;
+}
+function isVariableDeclaration(node) {
+	return node.type === "VariableDeclaration";
+}
+let userDefines = {};
 const renderSSRCommand = async (ctx, componentPath, componentName, props = {}) => {
 	const absoluteComponentPath = resolve(process.cwd(), componentPath);
-	const viteServer = ctx.project.vite;
-	if (!viteServer.config.define) return;
-	for (const [key, value] of Object.entries(viteServer.config.env)) viteServer.config.define[`__vite_ssr_import_meta__.env.${key}`] = JSON.stringify(value);
-	const Component = (await viteServer.ssrLoadModule(absoluteComponentPath))[componentName];
+	const Component = (await ctx.project.vite.ssrLoadModule(absoluteComponentPath))[componentName];
 	if (!Component) throw new Error(`Component "${componentName}" not found in ${absoluteComponentPath}`);
 	return await renderComponentToSSR(ctx, Component, props);
 };
 const renderSSRLocalCommand = async (ctx, testFilePath, componentName, allLocalComponents, props = {}) => {
 	const viteServer = ctx.project.vite;
-	if (!viteServer.config.define) return;
-	for (const [key, value] of Object.entries(viteServer.config.env)) viteServer.config.define[`__vite_ssr_import_meta__.env.${key}`] = JSON.stringify(value);
 	const { readFileSync, writeFileSync, unlinkSync } = await import("node:fs");
 	const { dirname: dirname$1, join } = await import("node:path");
 	const tempFileName = `ssr-test-${Date.now()}-${Math.random().toString(36).slice(2, 11)}.tsx`;
@@ -254,16 +293,28 @@ const renderSSRLocalCommand = async (ctx, testFilePath, componentName, allLocalC
 		const originalContent = readFileSync(testFilePath, "utf8");
 		const ast = parseSync(testFilePath, originalContent);
 		const s = new MagicString(originalContent);
+		const strippedIds = /* @__PURE__ */ new Set();
 		function cleanTestFile(node) {
-			if (isImportDeclaration(node)) {
-				const source = node.source?.value;
-				if (source === "vitest" || source?.includes("@vitest/")) s.remove(node.start, node.end);
+			if (isImportDeclaration(node) && isBrowserOnlySource(node.source?.value)) {
+				for (const spec of node.specifiers || []) if (spec.local?.name) strippedIds.add(spec.local.name);
+				s.remove(node.start, node.end);
+				return;
 			}
 			if (isExpressionStatement(node) && node.expression?.type === "CallExpression") {
 				const callExpr = node.expression;
 				if (callExpr.callee.type === "Identifier") {
 					const calleeName = callExpr.callee.name;
-					if (calleeName === "test" || calleeName === "describe" || calleeName === "it") s.remove(node.start, node.end);
+					if (calleeName === "test" || calleeName === "describe" || calleeName === "it") {
+						s.remove(node.start, node.end);
+						return;
+					}
+				}
+			}
+			if (isVariableDeclaration(node)) {
+				if (node.declarations.every((d) => referencesStrippedId(d.init, strippedIds))) {
+					for (const d of node.declarations) if (d.id.type === "Identifier") strippedIds.add(d.id.name);
+					s.remove(node.start, node.end);
+					return;
 				}
 			}
 			traverseChildren(node, cleanTestFile);
@@ -291,6 +342,12 @@ function testSSR() {
 	return {
 		name: "vitest:ssr-transform",
 		enforce: "pre",
+		config(config) {
+			if (config.define) userDefines = {
+				...userDefines,
+				...config.define
+			};
+		},
 		transform: {
 			filter: {
 				id: isJSorTS,
@@ -377,7 +434,9 @@ function testSSR() {
 			}
 		},
 		configResolved(config) {
-			globalThis.qwikSymbolMapper = symbolMapper;
+			if (!config.define) config.define = {};
+			for (const [key, value] of Object.entries(userDefines)) if (config.define) config.define[key] = value;
+			for (const [key, value] of Object.entries(config.env)) if (config.define) config.define[`__vite_ssr_import_meta__.env.${key}`] = JSON.stringify(value);
 			if (config.test?.browser?.enabled) config.test.browser.commands = {
 				...config.test.browser.commands,
 				renderSSR: renderSSRCommand,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "vitest-browser-qwik",
-  "version": "0.2.2",
+  "version": "0.3.2",
   "description": "Render Qwik components using Vitest Browser Mode",
   "type": "module",
   "license": "MIT",
@@ -40,26 +40,26 @@
   },
   "dependencies": {
     "@oxc-project/types": "^0.95.0",
-    "magic-string": "^0.30.21",
+    "magic-string": "^0.30.17",
     "oxc-parser": "^0.95.0",
-    "oxc-resolver": "^11.16.2"
+    "oxc-resolver": "^11.11.1"
   },
   "peerDependencies": {
-    "@builder.io/qwik": ">=1.14.1",
+    "@qwik.dev/core": "*",
     "vite": ">=6.3.5",
-    "vitest": "^4.0.0"
+    "vitest": "^4.0.18"
   },
   "devDependencies": {
     "@biomejs/biome": "2.0.0",
-    "@builder.io/qwik": "^1.18.0",
-    "@playwright/test": "1.52.0",
-    "@types/node": "^22.19.3",
+    "@playwright/test": "see flake.nix",
+    "@qwik.dev/core": "*",
+    "@types/node": "^22.15.17",
     "@vitest/browser-playwright": "^4.0.18",
-    "bumpp": "^10.3.2",
-    "ignore": "^7.0.5",
     "magic-regexp": "^0.10.0",
-    "tsdown": "^0.15.12",
-    "typescript": "^5.9.3",
+    "bumpp": "^10.1.0",
+    "ignore": "^7.0.5",
+    "tsdown": "^0.15.9",
+    "typescript": "^5.8.3",
     "vitest": "^4.0.18"
   },
   "scripts": {