-
Notifications
You must be signed in to change notification settings - Fork 4.3k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Fix the site editor breaking in firefox #33896
Conversation
Size Change: -10.8 kB (-1%) Total Size: 1.07 MB
ℹ️ View Unchanged
|
Yes, we don't have an error boundary in the site editor. Update: Created and issue #33899 and will follow up with PR shortly. |
@@ -87,6 +87,10 @@ export default function useMultiSelection() { | |||
* select the entire block contents. | |||
*/ | |||
useEffect( () => { |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Maybe we should use useRefEffect
here instead of useEffect
?
Both useSelectAll
and useArrowNav
are using useRefEffect
hook.
gutenberg/packages/block-editor/src/components/writing-flow/index.js
Lines 35 to 37 in 9e2fc57
useSelectAll(), | |
useArrowNav(), | |
useRefEffect( |
P.S. I haven't got a chance to use this hook in action yet, but this seems like a good use case.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I updated to use useRefEffect and indeed, it seems to work.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Tested it, and I don't see an error in Firefox.
P.S. Created PR for the error boundary - #33921.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
This fixes the Template and Site editor crashes for me, as well.
Though note another error is triggered (and more after that if you apply the same kind of fix).
Uncaught TypeError: can't access property "getAlignments", layoutType is undefined
useAvailableAlignments use-available-alignments.js:30
I think it makes sense to merge this now, though, to prevent the crash while we try to figure out a better solution.
@creativecoder I haven't been able to get the second error you shared, it might be theme specific. Consider opening an issue with more details. |
Thanks @youknowriad , I'm no longer able to replicate it testing on current |
closes #33873
I'm not entirely certain that this is a good solution but in Firefox the ref is null initially meaning that it's probably not being attached on mount.
Guarding against the ref solves the issue but doesn't explain why the ref is empty in the first place.
Note: It seems we don't have an error boundary in the site editor or if we do, it's not working well.
Testing instructions