update dependencies, fix cleanup, bump to 0.8.5

Author: Alex Lohr

README.md

@@ -81,7 +81,7 @@ const results = render(() => <YourComponent />, options);
 
 Solid.js reactive changes are pretty instantaneous, so there is rarely need to use `waitFor(…)`, `await findByRole(…)` and other asynchronous queries to test the rendered result, except for transitions, suspense, resources and router navigation.
 
-⚠️ In extension of the original API, the render function of this testing library supports convenient `location` and `routeDataFunc` options that will set up a router with memory integration pointing at a certain path if `location` is given and primed with the `routeDataFunc` as data. Since this setup is not instantaneous, you need to first use asynchronous queries (`findBy`) after employing it:
+⚠️ In extension of the original API, the render function of this testing library supports a convenient `location` option that will set up an in-memory router pointing at the specified location. Since this setup is not instantaneous, you need to first use asynchronous queries (`findBy`) after employing it:
 
 ```tsx
 it('uses params', async () => {

package-lock.json

@@ -1,6 +1,6 @@
 {
   "name": "@solidjs/testing-library",
-  "version": "0.8.4",
+  "version": "0.8.5",
   "description": "Simple and complete Solid testing utilities that encourage good testing practices.",
   "type": "module",
   "main": "./dist/index.cjs",
@@ -60,19 +60,19 @@
     "@testing-library/dom": "^9.3.1"
   },
   "devDependencies": {
-    "@solidjs/router": "^0.8.2",
-    "@testing-library/jest-dom": "^5.16.5",
-    "@testing-library/user-event": "^14.4.3",
-    "@vitest/coverage-v8": "^0.32.2",
+    "@solidjs/router": "^0.10.5",
+    "@testing-library/jest-dom": "^6.1.5",
+    "@testing-library/user-event": "^14.5.1",
+    "@vitest/coverage-v8": "^1.1.0",
     "coveralls": "^3.1.1",
-    "jsdom": "^22.1.0",
-    "prettier": "^2.8.8",
-    "pretty-format": "^29.5.0",
-    "solid-js": "^1.7.7",
-    "tsup": "7.1.0",
-    "typescript": "^5.1.6",
-    "vite-plugin-solid": "^2.7.0",
-    "vitest": "^0.32.2"
+    "jsdom": "^23.0.1",
+    "prettier": "^3.1.1",
+    "pretty-format": "^29.7.0",
+    "solid-js": "^1.8.7",
+    "tsup": "8.0.1",
+    "typescript": "^5.3.3",
+    "vite-plugin-solid": "^2.8.0",
+    "vitest": "^1.1.0"
   },
   "peerDependencies": {
     "@solidjs/router": ">=0.6.0",

package.json

@@ -1,4 +1,4 @@
-import "@testing-library/jest-dom/extend-expect";
+import "@testing-library/jest-dom/vitest";
 import {
   createSignal,
   createEffect,
@@ -8,7 +8,6 @@ import {
   Accessor,
   getOwner,
   createRoot,
-  runWithOwner
 } from "solid-js";
 import type { JSX } from "solid-js";
 import { render, renderDirective, renderHook, screen, testEffect } from "..";

src/__tests__/basic.tsx

@@ -0,0 +1,16 @@
+vi.mock('solid-js', () => ({ hydrate: () => {}, render: () => {} }));
+import { render } from '..';
+
+const errors: Event[] = [];
+const handler = (ev: Event) => errors.push(ev);
+globalThis.addEventListener('error', handler);
+
+test('trigger auto-cleanup', () => {
+  render(() => <div>Hi</div>);
+});
+
+test('check if auto-cleanup threw an error', () => {
+  expect(errors).toEqual([]);
+  globalThis.removeEventListener('error', handler);
+});
+

src/__tests__/broken-cleanup.tsx

@@ -1,5 +1,5 @@
-import "@testing-library/jest-dom/extend-expect";
-import { onCleanup } from "solid-js";
+import "@testing-library/jest-dom/vitest";
+import { onCleanup, render as soildRender } from "solid-js";
 import { cleanup, render } from "..";
 
 test("cleans up the document", () => {
@@ -24,3 +24,4 @@ test("cleanup does not error when an element is not a child", () => {
   render(() => <div />, { container: document.createElement("div") });
   cleanup();
 });
+

src/__tests__/cleanup.tsx

@@ -1,4 +1,4 @@
-import "@testing-library/jest-dom/extend-expect";
+import "@testing-library/jest-dom/vitest";
 import { screen, render } from "..";
 
 beforeEach(() => {

src/__tests__/debug.tsx

@@ -1,4 +1,4 @@
-import "@testing-library/jest-dom/extend-expect";
+import "@testing-library/jest-dom/vitest";
 import { createResource, Show } from "solid-js";
 import { screen, render, waitForElementToBeRemoved } from "..";
 

src/__tests__/end-to-end.tsx

@@ -1,17 +1,15 @@
 import { createSignal, catchError } from "solid-js";
 import { render } from "..";
-import { Routes, Route, useParams, useRouteData } from "@solidjs/router";
+import { Route, useParams } from "@solidjs/router";
 
 describe("location option", () => {
   const App = () => (
-    <Routes>
+    <>
       <Route path="/ids/:id" component={() => <p>Id: {useParams()?.id}</p>} />
       <Route path="/" component={() => <p>Start</p>} />
-    </Routes>
+    </>
   );
 
-  const App2 = () => <p>{useRouteData() || "loading"}</p>;
-
   it("can render the main route", async () => {
     const { findByText } = render(() => <App />, { location: "/" });
     expect(await findByText("Start")).not.toBeFalsy();
@@ -22,26 +20,6 @@ describe("location option", () => {
     expect(await findByText("Id: 1234")).not.toBeFalsy();
   });
 
-  it("provides route data without a location", async () => {
-    const { findByText } = render(() => <App2 />, { routeDataFunc: () => "works" });
-    expect(await findByText("works")).not.toBeFalsy();
-  });
-
-  it("provides route data with a location", async () => {
-    const { findByText } = render(
-      () => (
-        <Routes>
-          <Route path="/test" component={() => <App2 />} />
-        </Routes>
-      ),
-      {
-        routeDataFunc: () => "good",
-        location: "/test"
-      }
-    );
-    expect(await findByText("good")).not.toBeFalsy();
-  });
-
   it("does not use a router without the location option", async () => {
     const NoRouter = () => {
       const [state, setState] = createSignal("loading");

src/__tests__/routes.tsx

@@ -26,11 +26,8 @@ import type {
 
 /* istanbul ignore next */
 if (!process.env.STL_SKIP_AUTO_CLEANUP) {
-  if (typeof afterEach === "function") {
-    afterEach(async () => {
-      await cleanup();
-    });
-  }
+  //@ts-ignore
+  if (typeof afterEach === "function") { afterEach(cleanup); }
 }
 
 const mountedContainers = new Set<Ref>();
@@ -85,31 +82,17 @@ function render(ui: Ui, options: Options = {}): Result {
       : ui;
 
   const routedUi: Ui =
-    typeof location === "string" || typeof options.routeDataFunc === "function"
+    typeof location === "string"
       ? lazy(async () => {
           try {
-            const { memoryIntegration, useNavigate, Router } = await import("@solidjs/router");
+            const { createMemoryHistory, MemoryRouter } = await import("@solidjs/router");
+            const history = createMemoryHistory();
+            location && history.set({ value: location, scroll: false, replace: true });
             return {
               default: () =>
-                createComponent(Router, {
-                  get children() {
-                    return [
-                      typeof location === "string"
-                        ? createComponent(
-                            () => (
-                              useNavigate()(location as string, { replace: true, scroll: false }),
-                              null
-                            ),
-                            {}
-                          )
-                        : null,
-                      createComponent(wrappedUi, {})
-                    ];
-                  },
-                  data: options.routeDataFunc,
-                  get source() {
-                    return memoryIntegration();
-                  }
+                createComponent(MemoryRouter, {
+                  history,
+                  get children() { return createComponent(wrappedUi, {}); }
                 })
             };
           } catch (e: unknown) {
@@ -279,7 +262,11 @@ export function testEffect<T extends any = void>(
 
 function cleanupAtContainer(ref: Ref) {
   const { container, dispose } = ref;
-  dispose();
+  if (typeof dispose === 'function') {
+    dispose();
+  } else {
+    console.warn('solid-testing-library: dispose is not a function - maybe your tests include multiple solid versions!');
+  }
 
   if (container?.parentNode === document.body) {
     document.body.removeChild(container);