@react-aria/focus - Failed to execute 'createTreeWalker' on 'Document': parameter 1 is not of type 'Node'.

[javifm86]

🐛 Bug Report

Maybe this can be considered as a regression bug already reported here https://github.com/adobe/react-spectrum/issues/3877, I found it in my private project thanks to that issue and this discussion https://github.com/adobe/react-spectrum/discussions/1937.

When I am executing e2e tests using cypress, sometimes I find the error Failed to execute 'createTreeWalker' on 'Document': parameter 1 is not of type 'Node'.

I am using @react-aria/focus since v.3.5.0, and it seems my tests are broken since v.3.11.0. I have checked that between 3.10.0 and 3.11.0 there are changes in focus/src/FocusScope.tsx.

🤔 Expected Behavior

No error thrown.

😯 Current Behavior

My e2e tests show the error Failed to execute 'createTreeWalker' on 'Document': parameter 1 is not of type 'Node'. when I try to click any button once my spinner has been hidden.

💁 Possible Solution

Check if the change between 3.10.0 and 3.11.0 version are correct. I will fix my version at 3.10.0 and that is enough for me, but I wanted to report just in case it helps to detect a bug.

🔦 Context

I'm using react-aria to disable focus in my app meanwhile a spinner is shown and test with cypress.

💻 Code Sample

Sorry, this a private repo, I can't elaborate a reproduction because of confidentiality.

🌍 Your Environment

e2e tests with cypress v.11 and upgrading to v.12 same happens. Testing with Electron browser and Chrome in MacOS. Node 16.

[LFDanLu]

Could you give us a minimal reproduction for this issue? Where is FocusScope being used in your setup?

[javifm86]

Could you give us a minimal reproduction for this issue? Where is FocusScope being used in your setup?

I will try to extract to a minimal example for the next week. Thanks.

[simPod]

I'm experiencing the same issue via nextui

You can see it here https://nextui.org/docs/components/date-range-picker#usage

https://github.com/adobe/react-spectrum/assets/327717/5e1d2d3f-77e4-4ee5-92d3-3584f9853b1f

It happens when you click into highlighted element

[snowystinger]

Thanks for the link to the nextui example. Does it happen outside of their documentation site? I ask because I looked at the trace and that doesn't look like any createTreeWalker call we make. We don't have any accept function with that body in our code. That said, I couldn't find it in theirs either, but I might be looking in the wrong place.

[simPod]

It also happens on my internal project where I'm using nextui.

Also, it happens only in their date range picker but not date picker.

[snowystinger]

When it fails for you, does it fail with the same stack trace and is it the same createTreeWalker function that I showed above?

[simPod]

For me it's this one

I guess https://github.com/adobe/react-spectrum/blob/8ed86d85f885b8a113fb51b000747839853ec6da/packages/%40react-aria/focus/src/FocusScope.tsx#L722