fix: make qwik-testing-library agnostic from vitest runner

.github/workflows/ci.yml

@@ -54,6 +54,7 @@ jobs:
         run: |
           pnpm install
           pnpm --filter "{packages/qwik-testing-library}" install @builder.io/qwik@${{ matrix.qwik }}
+          pnpm --filter "{packages/qwik-mock}" install @builder.io/qwik@${{ matrix.qwik }}
           pnpm --filter "{apps/qwik-testing-library-e2e-tests}" install @builder.io/qwik@${{ matrix.qwik }}
 
       - name: ▶️ Run ${{ matrix.check }}

README.md

@@ -318,17 +318,27 @@ describe("<Counter />", () => {
 > This feature is under a testing phase and thus experimental.
 > Its API may change in the future, so use it at your own risk.
 
-The Qwik Testing Library provides a `mock$` function
+#### Setup
+
+Optionally, you can install `@noma.to/qwik-mock` to mock callbacks of Qwik components. It provides a `mock$` function
 that can be used to create a mock of a QRL and verify interactions on your Qwik components.
 
+```shell
+npm install --save-dev @noma.to/qwik-mock
+```
+
 It is _not_ a replacement of regular mocking functions (such as `vi.fn` and `vi.mock`) as its intended use is only for
 testing callbacks of Qwik components.
 
+#### Usage
+
 Here's an example on how to use the `mock$` function:
 
 ```tsx title="counter.spec.tsx"
 // import qwik-testing methods
-import {mock$, clearAllMock, render, screen, waitFor} from "@noma.to/qwik-testing-library";
+import {render, screen, waitFor} from "@noma.to/qwik-testing-library";
+// import qwik-mock methods
+import {mock$, clearAllMock} from "@noma.to/qwik-mock";
 // import the userEvent methods to interact with the DOM
 import {userEvent} from "@testing-library/user-event";
 

apps/qwik-testing-library-e2e-tests/package.json

@@ -38,6 +38,7 @@
   "devDependencies": {
     "@builder.io/qwik": "^1.12.1",
     "@noma.to/qwik-testing-library": "workspace:*",
+    "@noma.to/qwik-mock": "workspace:*",
     "@testing-library/jest-dom": "^6.6.3",
     "@testing-library/user-event": "^14.6.1",
     "@types/eslint": "8.56.10",

apps/qwik-testing-library-e2e-tests/src/components/counter.spec.tsx

@@ -1,12 +1,7 @@
-import {
-  clearAllMocks,
-  mock$,
-  render,
-  screen,
-  waitFor,
-} from "@noma.to/qwik-testing-library";
-import { Counter } from "./counter";
+import { render, screen, waitFor } from "@noma.to/qwik-testing-library";
+import { clearAllMocks, mock$ } from "@noma.to/qwik-mock";
 import { userEvent } from "@testing-library/user-event";
+import { Counter } from "./counter";
 
 describe("<Counter />", () => {
   const onChangeMock = mock$(() => {});

package.json

@@ -11,9 +11,9 @@
     "validate": "pnpm -r lint && pnpm -r validate",
     "contributors:add": "all-contributors add",
     "contributors:generate": "all-contributors generate",
-    "build": "pnpm --filter '{packages/qwik-testing-library}' run build",
-    "release:prepare": "pnpm --filter '{packages/qwik-testing-library}' run build && cp README.md packages/qwik-testing-library/README.md && cp LICENSE packages/qwik-testing-library/LICENSE",
-    "release": "pnpm --filter '{packages/qwik-testing-library}' --workspace-concurrency=1 exec -- npx --no-install semantic-release -e semantic-release-monorepo",
+    "build": "pnpm --filter '{packages/**}' run build",
+    "release:prepare": "pnpm --filter '{packages/**}' run build && cp README.md packages/qwik-testing-library/README.md && cp LICENSE packages/qwik-testing-library/LICENSE && cp LICENSE packages/qwik-mock/LICENSE",
+    "release": "pnpm --filter '{packages/**}' --workspace-concurrency=1 exec -- npx --no-install semantic-release -e semantic-release-monorepo",
     "prepare": "husky"
   },
   "keywords": [
@@ -28,6 +28,8 @@
     "functional",
     "end-to-end",
     "e2e",
+    "mock",
+    "mocking",
     "vitest"
   ],
   "license": "MIT",

packages/qwik-mock/.eslintignore

@@ -0,0 +1,31 @@
+**/*.log
+**/.DS_Store
+*.
+.vscode/settings.json
+.history
+.yarn
+bazel-*
+bazel-bin
+bazel-out
+bazel-qwik
+bazel-testlogs
+dist
+dist-dev
+lib
+lib-types
+etc
+external
+node_modules
+temp
+tsc-out
+tsdoc-metadata.json
+target
+output
+rollup.config.js
+build
+.cache
+.vscode
+.rollup.cache
+dist
+tsconfig.tsbuildinfo
+vite.config.ts

packages/qwik-mock/.eslintrc.cjs

@@ -0,0 +1,40 @@
+module.exports = {
+  root: true,
+  env: {
+    browser: true,
+    es2021: true,
+    node: true,
+  },
+  extends: [
+    "eslint:recommended",
+    "plugin:@typescript-eslint/recommended",
+    "plugin:qwik/recommended",
+  ],
+  parser: "@typescript-eslint/parser",
+  parserOptions: {
+    tsconfigRootDir: __dirname,
+    project: ["./tsconfig.json"],
+    ecmaVersion: 2021,
+    sourceType: "module",
+    ecmaFeatures: {
+      jsx: true,
+    },
+  },
+  plugins: ["@typescript-eslint"],
+  rules: {
+    "@typescript-eslint/no-explicit-any": "off",
+    "@typescript-eslint/explicit-module-boundary-types": "off",
+    "@typescript-eslint/no-inferrable-types": "off",
+    "@typescript-eslint/no-non-null-assertion": "off",
+    "@typescript-eslint/no-empty-interface": "off",
+    "@typescript-eslint/no-namespace": "off",
+    "@typescript-eslint/no-empty-function": "off",
+    "@typescript-eslint/no-this-alias": "off",
+    "@typescript-eslint/ban-types": "off",
+    "@typescript-eslint/ban-ts-comment": "off",
+    "prefer-spread": "off",
+    "no-case-declarations": "off",
+    "no-console": "off",
+    "@typescript-eslint/no-unused-vars": ["error"],
+  },
+};

packages/qwik-mock/.gitignore

@@ -0,0 +1,38 @@
+# Build
+/dist
+/lib
+/lib-types
+/server
+
+# Development
+node_modules
+
+# Cache
+.cache
+.mf
+.vscode
+.rollup.cache
+tsconfig.tsbuildinfo
+
+# Logs
+logs
+*.log
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+pnpm-debug.log*
+lerna-debug.log*
+
+# Editor
+!.vscode/extensions.json
+.idea
+.DS_Store
+*.suo
+*.ntvs*
+*.njsproj
+*.sln
+*.sw?
+
+# Yarn
+.yarn/*
+!.yarn/releases

packages/qwik-mock/.prettierignore

@@ -0,0 +1,6 @@
+# Files Prettier should not format
+**/*.log
+**/.DS_Store
+*.
+dist
+node_modules

packages/qwik-mock/README.md

@@ -0,0 +1,8 @@
+# Qwik Mock
+
+Qwik Mock is a small utility to mock Qwik QRLs. It is currently experimental and should be used with caution.
+
+Head over to [qtl-docs-repo] to learn how to use it.
+
+[qtl-docs-repo]: https://github.com/ianlet/qwik-testing-library/blob/main/README.md
+

packages/qwik-mock/package.json

@@ -0,0 +1,53 @@
+{
+  "name": "@noma.to/qwik-mock",
+  "version": "0.0.0-semantically-released",
+  "description": "Small utility to mock Qwik QRLs",
+  "repository": "https://github.com/ianlet/qwik-testing-library",
+  "homepage": "https://github.com/ianlet/qwik-testing-library",
+  "license": "MIT",
+  "main": "./lib/index.qwik.mjs",
+  "qwik": "./lib/index.qwik.mjs",
+  "types": "./lib-types/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./lib-types/index.d.ts",
+      "import": "./lib/index.qwik.mjs",
+      "require": "./lib/index.qwik.cjs"
+    }
+  },
+  "files": [
+    "lib",
+    "lib-types"
+  ],
+  "engines": {
+    "node": "^18.17.0 || ^20.3.0 || >=21.0.0"
+  },
+  "private": false,
+  "type": "module",
+  "scripts": {
+    "build": "pnpm build.lib && pnpm build.types",
+    "build.lib": "vite build --mode lib",
+    "build.types": "tsc --emitDeclarationOnly",
+    "fmt": "prettier --write .",
+    "fmt.check": "prettier --check .",
+    "lint": "eslint \"src/**/*.ts*\"",
+    "validate": "pnpm build"
+  },
+  "devDependencies": {
+    "@types/eslint": "8.56.10",
+    "@types/node": "22.13.8",
+    "@typescript-eslint/eslint-plugin": "8.28.0",
+    "@typescript-eslint/parser": "8.28.0",
+    "eslint": "8.57.1",
+    "eslint-plugin-qwik": "1.12.1",
+    "prettier": "3.5.3",
+    "typescript": "5.8.2",
+    "undici": "*",
+    "vite": "6.2.3",
+    "vite-tsconfig-paths": "^5.1.4",
+    "vitest": "^3.0.9"
+  },
+  "peerDependencies": {
+    "@builder.io/qwik": ">= 1.12.0 < 2"
+  }
+}

packages/qwik-mock/src/index.ts

@@ -0,0 +1 @@
+export * from "./lib/qwik-mock";

packages/qwik-mock/tsconfig.json

@@ -0,0 +1,21 @@
+{
+  "compilerOptions": {
+    "allowJs": true,
+    "target": "ES2017",
+    "module": "ES2020",
+    "lib": ["es2020", "DOM"],
+    "jsx": "react-jsx",
+    "jsxImportSource": "@builder.io/qwik",
+    "strict": true,
+    "declaration": true,
+    "declarationDir": "lib-types",
+    "resolveJsonModule": true,
+    "moduleResolution": "Bundler",
+    "esModuleInterop": true,
+    "skipLibCheck": true,
+    "incremental": true,
+    "isolatedModules": true,
+    "types": ["vite/client"]
+  },
+  "include": ["src"]
+}

packages/qwik-mock/vite.config.ts

@@ -0,0 +1,35 @@
+import { defineConfig } from "vite";
+import pkg from "./package.json";
+import { qwikVite } from "@builder.io/qwik/optimizer";
+import tsconfigPaths from "vite-tsconfig-paths";
+
+const { dependencies = {}, peerDependencies = {} } = pkg as any;
+const makeRegex = (dep) => new RegExp(`^${dep}(/.*)?$`);
+const excludeAll = (obj) => Object.keys(obj).map(makeRegex);
+
+export default defineConfig(() => {
+  return {
+    build: {
+      target: "es2020",
+      lib: {
+        entry: "./src/index.ts",
+        formats: ["es", "cjs"],
+        fileName: (format, entryName) =>
+          `${entryName}.qwik.${format === "es" ? "mjs" : "cjs"}`,
+      },
+      rollupOptions: {
+        output: {
+          preserveModules: true,
+          preserveModulesRoot: "src",
+        },
+        // externalize deps that shouldn't be bundled into the library
+        external: [
+          /^node:.*/,
+          ...excludeAll(dependencies),
+          ...excludeAll(peerDependencies),
+        ],
+      },
+    },
+    plugins: [qwikVite(), tsconfigPaths()],
+  };
+});

packages/qwik-testing-library/src/lib/qwik-testing-library.tsx

@@ -1,7 +1,6 @@
 import { getQueriesForElement, prettyDOM } from "@testing-library/dom";
 import { JSXOutput } from "@builder.io/qwik";
 import type { ComponentRef, Options, Result } from "./types";
-import { clearAllMocks, mock$, mockQrl } from "./mock";
 import { qwikLoader } from "./qwikloader";
 
 // if we're running in a test runner that supports afterEach
@@ -87,4 +86,4 @@ function cleanup() {
 }
 
 export * from "@testing-library/dom";
-export { cleanup, render, mock$, mockQrl, clearAllMocks };
+export { cleanup, render };