getTreeNode(...) is undefined

[ArmandBernard]

🐛 Bug Report

Hello. I am trying to replicate the Select component in the official TypeScript example so I can then modify it for my application, but I get an error when clicking the dropdown button.

🤔 Expected Behavior

The popover should appear on button click.

😯 Current Behavior

I click the dropdown button and my page crashes with this error:

Uncaught TypeError: $9bf71ea28793e738$export$d06fae2ee68b101e.getTreeNode(...) is undefined
    useRestoreFocus FocusScope.tsx:516
    React 14
    onFocus useSelect.ts:161
    onFocus useFocus.ts:64
    e08e3b67e392101e chain.ts:20
    React 14
    focus useFocusVisible.ts:128
    $7215afc6de606d6b$export$de79e2c695e052f3 focusWithoutScrolling.ts:33
    onPointerDown usePress.ts:342
    React 23
    <anonymous> main.tsx:6
[FocusScope.tsx:516:19](http://localhost:5173/WebCV/node_modules/@react-aria/focus/dist/packages/@react-aria/focus/src/FocusScope.tsx)
    useRestoreFocus FocusScope.tsx:516
    React 9
    performSyncWorkOnRoot self-hosted:1406
    React 5
    dispatchSetState self-hosted:1518
    onFocus useSelect.ts:161
    onFocus useFocus.ts:64
    e08e3b67e392101e chain.ts:20
    React 14
    bind_applyFunctionN self-hosted:1683
    dispatchDiscreteEvent self-hosted:1640
    focus useFocusVisible.ts:128
    $7215afc6de606d6b$export$de79e2c695e052f3 focusWithoutScrolling.ts:33
    onPointerDown usePress.ts:342
    React 15
    bind_applyFunctionN self-hosted:1683
    dispatchDiscreteEvent self-hosted:1640
    React 4
    forEach self-hosted:4909
    React 4
    <anonymous> main.tsx:6

💁 Possible Solution

No idea sadly. I couldn't find anything about this error online.

🔦 Context

First, I copied ListBox.tsx, Select.tsx and Popover.tsx into my working TypeScript + React + Tailwind project and remove the icons.

However, when I try to use it in my application I get an error on click.

💻 Code Sample

I couldn't reproduce this issue in a sandbox. Here's close representation of my code without working tailwind.

https://codesandbox.io/s/sweet-hooks-b3fpwx

If this gets any attention, I can link to my public repo and a broken branch for testing.

🌍 Your Environment

Software	Version(s)
vite	4.1.0
react	18.2.0
react-aria	3.22.0
react-stately	3.20.0
react-spectrum	N/A
Browser	Firefox 109.0.1
Operating System	Windows 11

🧢 Your Company/Team

I'm not an Adobe employee. I'm a Software Engineer using React Aria for my own projects.

🕷 Tracking Issue (optional)

N/A

[snowystinger]

Quick question. Are you using React StrictMode in your app? Or SSR?

[tgelu]

I happen to have the same issue when using react 18.2.0.
I can confirm that it does happen only in strict mode.

[snowystinger]

We've addressed StrictMode in #4564
Can you tell us what version of our packages you're using or try upgrading and see if the problem goes away?

Otherwise a codesandbox reproducing it would be very helpful in debugging this.

[tgelu]

I am far from latest versions. Will upgrade and get back to this thread. thanks!

[reidbarber]

Closing due to this likely be handled by Strict Mode work in #4564, feel free to re-open if this is still an issue.