Skip to content

Fix our custom element serializer in IE11#8967

Merged
youknowriad merged 1 commit intomasterfrom
fix/serializer-ie11
Aug 14, 2018
Merged

Fix our custom element serializer in IE11#8967
youknowriad merged 1 commit intomasterfrom
fix/serializer-ie11

Conversation

@youknowriad
Copy link
Copy Markdown
Contributor

In IE11, React don't use the constants for its element types because of the lack of support for Symbols. Which means in our element serializer we need to check against those numbers React uses as types.

This fixes an issue where RichText content was not saved in IE11

Testing instructions

  • Create a paragraph in IE11 and type something in it
  • Save and refresh the page
  • The content should still be there.

@youknowriad youknowriad added [Type] Bug An existing feature does not function as intended Browser Issues Issues or PRs that are related to browser specific problems labels Aug 14, 2018
@youknowriad youknowriad self-assigned this Aug 14, 2018
@youknowriad youknowriad requested review from aduth and gziolo August 14, 2018 11:23
@tofumatt tofumatt self-requested a review August 14, 2018 12:09
Copy link
Copy Markdown
Member

@tofumatt tofumatt left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This is a pretty gnarly bug and I tested the fix in IE 11 on Windows 10–it fixed it, so I say 🚢

Were there any issues filed for this? I don't see them mentioned in the summary.

@youknowriad
Copy link
Copy Markdown
Contributor Author

@tofumatt It's not filled I think, I just noticed it when fixing other IE11 bugs :)

@youknowriad youknowriad merged commit 3767009 into master Aug 14, 2018
@aduth aduth deleted the fix/serializer-ie11 branch August 14, 2018 12:58
@aduth
Copy link
Copy Markdown
Member

aduth commented Aug 14, 2018

Agree that this was pretty critical to fix, but this needs to be refactored in a subsequent pull request since we're already assuming the fallback values in the assignment of the const. It should either be corrected there, or removed from there (ideally the former).

I can plan to set aside some time to take a look.

@gziolo
Copy link
Copy Markdown
Member

gziolo commented Aug 14, 2018

@youknowriad thanks for fixing, and let's refactor :)

@aduth
Copy link
Copy Markdown
Member

aduth commented Aug 14, 2018

I do suspect the main issue here is that our Babel runtime transform is converting the Symbol check in HAS_SYMBOL assignment to the version used by core-js, so effectively HAS_SYMBOL will always be true, and Symbol.for will use the polyfilled version. This is unlike in React, where Symbol is not polyfilled and thus will use the fallback value. The mismatch in behavior is likely what caused the switch not to properly catch the type of the element.

I've having trouble finding a way to detect true native environment support for Symbol without triggering the replacement by the runtime transform.

Another option would be to avoid (re-)defining the React constants, and instead generate a dummy pair of Provider / Consumer components and access the $$typeof property of them to use in the switch. I avoided this purely for the memory overhead of creating an unused component, but it seems more stable given the issues faced with trying to define the Symbol value.

@aduth
Copy link
Copy Markdown
Member

aduth commented Aug 15, 2018

For historical context, this was a regression of #8189

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

Browser Issues Issues or PRs that are related to browser specific problems [Type] Bug An existing feature does not function as intended

Projects

None yet

Development

Successfully merging this pull request may close these issues.

4 participants