Cannot read properties of null (reading 'firstChild')

nolanlawson / emoji-picker-element

A lightweight emoji picker for the modern web

https://nolanlawson.github.io/emoji-picker-element/

Apache License 2.0

1.26k stars 80 forks source link

Cannot read properties of null (reading 'firstChild') #418

Open VincentMolinie opened 2 months ago

VincentMolinie commented 2 months ago

I got this error that happens randomly in my tests, it happens when I open the emoji picker element. It throws the error but the emoji picker still seems to work. It might require a little defensive programming

I'm using emoji-picker-element 1.21.1.

nolanlawson commented 2 months ago

The error seems to be coming from here:

https://github.com/nolanlawson/emoji-picker-element/blob/3d84cf384e7413d75e9d9642d76f90befad6df14/src/picker/utils/calculateTextWidth.js#L8

Can you test in the latest version (1.21.3)? Which browser are you using? Can you share your test code? Otherwise I don't have much context to figure out where the bug is coming from...

nolanlawson commented 3 weeks ago

Interesting – I can reproduce this, but only in desktop Safari 12.0. In Safari 13 it seems fixed.

Repro steps: just randomly click on the categories and type into the search bar.

It looks like effectively what's happening is that the .emoji-menu element being updated is not the same one that's in the DOM. I'm not sure how this is possible, since the framework manages, that, and should keep the same element throughout the lifecycle of the picker.

nolanlawson commented 3 weeks ago