-
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
FontSizePicker: fix a buggy unit test #45529
Conversation
Open in CodeSandbox Web Editor | VS Code | VS Code Insiders |
Size Change: 0 B Total Size: 1.28 MB ℹ️ View Unchanged
|
6792b55
to
cbbe226
Compare
cbbe226
to
280fccc
Compare
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.
Do you why this fail only in React 18
I didn't track down the exact reason, that would be fairly difficult, but it's plausible that the two bugs I found make the UI fail. There are list items with duplicate keys, so maybe they rerender over each other? Also, some components might not see the updated |
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.
Good catch!
On a side note, I'm happy to see one less usage of _.merge()
!
This PR fixes an unreliable e2e test that starts failing after React 18 migration (#45235). There are two bugs:
The first one is a typo introduced in #37446 by @youknowriad. If you look at the diff, notice the extra
,
character in the font sizes array? That creates a sparse array that skips one index, and when merging such an array into existing one withlodash.merge
, the element at the skipped index will have an old value:The result is that the overridden font size list has one item from the old list (namely for "Medium"), that there are items for a "Medium" size that cause a "duplicate React key" warning, and that array indexes in
expect()
calls are off by one.The second bug is that the
lodash.merge
function modifies the settings object by mutating it. AfterupdateSettings
, thegetSettings
selector will still return the same object, identity-wise, just mutated. If a component depends on the settings state:it won't be rerendered because the old value is shallowly equal to the new one. Rerendering with the updated font size list must be accidentally triggered by something else. And it seems that in React 18 it's not.