Feat: memory location search hook

packages/wouter/src/memory-location.js

@@ -7,10 +7,18 @@ import { useSyncExternalStore } from "./react-deps.js";
 
 export const memoryLocation = ({
   path = "/",
+  searchPath = "",
   static: staticLocation,
   record,
 } = {}) => {
-  let currentPath = path;
+  let initialPath = path;
+  if (searchPath) {
+    // join with & if path contains search query, and ? otherwise
+    initialPath += path.split("?")[1] ? "&" : "?";
+    initialPath += searchPath;
+  }
+
+  let [currentPath, currentSearch = ""] = initialPath.split("?");
   const history = [currentPath];
   const emitter = mitt();
 
@@ -23,7 +31,7 @@ export const memoryLocation = ({
       }
     }
 
-    currentPath = path;
+    [currentPath, currentSearch = ""] = path.split("?");
     emitter.emit("navigate", path);
   };
 
@@ -39,15 +47,19 @@ export const memoryLocation = ({
     navigate,
   ];
 
+  const useMemoryQuery = () =>
+    useSyncExternalStore(subscribe, () => currentSearch);
+
   function reset() {
     // clean history array with mutation to preserve link
     history.splice(0, history.length);
 
-    navigateImplementation(path);
+    navigateImplementation(initialPath);
   }
 
   return {
     hook: useMemoryLocation,
+    searchHook: useMemoryQuery,
     navigate,
     history: record ? history : undefined,
     reset: record ? reset : undefined,

packages/wouter/test/memory-location.test.ts

@@ -23,6 +23,29 @@ it("should support initial path", () => {
   unmount();
 });
 
+it("should support initial path with query", () => {
+  const { searchHook } = memoryLocation({ path: "/test-case?foo=bar" });
+
+  const { result, unmount } = renderHook(() => searchHook());
+  const value = result.current;
+
+  expect(value).toBe("foo=bar");
+  unmount();
+});
+
+it("should support search path as parameter", () => {
+  const { searchHook } = memoryLocation({
+    path: "/test-case?foo=bar",
+    searchPath: "key=value",
+  });
+
+  const { result, unmount } = renderHook(() => searchHook());
+  const value = result.current;
+
+  expect(value).toBe("foo=bar&key=value");
+  unmount();
+});
+
 it('should return location hook that has initial path "/" by default', () => {
   const { hook } = memoryLocation();
 
@@ -33,6 +56,16 @@ it('should return location hook that has initial path "/" by default', () => {
   unmount();
 });
 
+it('should return search hook that has initial query "" by default', () => {
+  const { searchHook } = memoryLocation();
+
+  const { result, unmount } = renderHook(() => searchHook());
+  const value = result.current;
+
+  expect(value).toBe("");
+  unmount();
+});
+
 it("should return standalone `navigate` method", () => {
   const { hook, navigate } = memoryLocation();
 

packages/wouter/test/use-search.test.tsx

@@ -1,6 +1,7 @@
 import { renderHook, act } from "@testing-library/react";
 import { useSearch, Router } from "wouter";
 import { navigate } from "wouter/use-browser-location";
+import { memoryLocation } from "wouter/memory-location";
 import { it, expect, beforeEach } from "vitest";
 
 beforeEach(() => history.replaceState(null, "", "/"));
@@ -24,6 +25,33 @@ it("can be customized in the Router", () => {
   expect(result.current).toEqual("none");
 });
 
+it("can be customized with memoryLocation", () => {
+  const { searchHook } = memoryLocation({ path: "/foo?key=value" });
+
+  const { result } = renderHook(() => useSearch(), {
+    wrapper: (props) => {
+      return <Router searchHook={searchHook}>{props.children}</Router>;
+    },
+  });
+
+  expect(result.current).toEqual("key=value");
+});
+
+it("can be customized with memoryLocation using search path parameter", () => {
+  const { searchHook } = memoryLocation({
+    path: "/foo?key=value",
+    searchPath: "foo=bar",
+  });
+
+  const { result } = renderHook(() => useSearch(), {
+    wrapper: (props) => {
+      return <Router searchHook={searchHook}>{props.children}</Router>;
+    },
+  });
+
+  expect(result.current).toEqual("key=value&foo=bar");
+});
+
 it("unescapes search string", () => {
   const { result: searchResult } = renderHook(() => useSearch());
 

packages/wouter/types/memory-location.d.ts

@@ -1,20 +1,31 @@
-import { BaseLocationHook, Path } from "./location-hook.js";
+import {
+  BaseLocationHook,
+  BaseSearchHook,
+  Path,
+  SearchString,
+} from "./location-hook.js";
 
 type Navigate<S = any> = (
   to: Path,
   options?: { replace?: boolean; state?: S }
 ) => void;
 
-type HookReturnValue = { hook: BaseLocationHook; navigate: Navigate };
+type HookReturnValue = {
+  hook: BaseLocationHook;
+  searchHook: BaseSearchHook;
+  navigate: Navigate;
+};
 type StubHistory = { history: Path[]; reset: () => void };
 
 export function memoryLocation(options?: {
   path?: Path;
+  searchPath?: SearchString;
   static?: boolean;
   record?: false;
 }): HookReturnValue;
 export function memoryLocation(options?: {
   path?: Path;
+  searchPath?: SearchString;
   static?: boolean;
   record: true;
 }): HookReturnValue & StubHistory;