million: bug: Wouter compat

Describe the bug Wouter errors when integrated into a Million/React environment

To Reproduce

import { createRoot, useState } from 'million/react';
import { Link, Route } from 'wouter';

function App() {
  const [count, setCount] = useState(0);
  return (
    <div>
      <button onClick={() => setCount(count + 1)}>{count}</button>

      <Link href="/users/1">
        <a className="link">Profile</a>
      </Link>

      <Route path="/about">About Us</Route>
      <Route path="/users/:name">{(params) => <div>Hello, {params.name}!</div>}</Route>
    </div>
  );
}

createRoot(document.body).render(<App />);

Gives something like this:

wouter.js?v=b667f2ca:1129 Uncaught TypeError: Cannot read properties of null (reading 'i')
    at useRef (wouter.js?v=b667f2ca:1129:14)
    at useNavigate (wouter.js?v=b667f2ca:1636:18)
    at Link (wouter.js?v=b667f2ca:1659:18)
    at compat.ts:15:17
    at hook2 (hooks.ts:37:17)
    at Object.createComponent [as handleFunction] (compat.ts:39:4)
    at Object.h (h.ts:45:14)
    at App (script.tsx:15:19)
    at compat.ts:15:17
    at hook2 (hooks.ts:37:17)

Expected behavior

Should behave as Wouter intends it to

About this issue

  • Original URL
  • State: closed
  • Created 2 years ago
  • Reactions: 4
  • Comments: 21 (19 by maintainers)

Most upvoted comments

i found this pr, I should dig deeper into the problem and now i probably understand the reason

Reopening this issue since #258 doesn’t completely fix the bugs - but fixes some of them.

Happy to say we’re one step closer to fixing this issue: https://github.com/aidenybai/million/commit/1bcedb5549b5a5c9194920ef42529ce4a7de4a57