Skip to content
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

Stable ES features are not always polyfilled when needed #8875

Closed
skoging opened this issue Apr 22, 2020 · 4 comments · May be fixed by #8877, #9021, admmasters/create-react-app#34 or joseroubert08/create-react-app#55

Comments

@skoging
Copy link
Contributor

skoging commented Apr 22, 2020

Describe the bug

Even with import 'react-app-polyfill/stable', some stable ES features are not polyfilled, such as String#matchAll.

Even importing String#matchAll directly from core-js does not work: import 'core-js/stable/string/match-all'

https://caniuse.com/#feat=mdn-javascript_builtins_string_matchall

Steps to reproduce

(Write your steps here:)

yarn create react-app polyfill-bug
cd polyfill-bug
yarn add react-app-polyfill
// index.js
import 'react-app-polyfill/ie11'
import 'react-app-polyfill/stable'
import 'core-js/stable/string/match-all'

const matches = 'some test string'.matchAll(/s(.)/g);
// IE11 or Safari:
// Error: Object doesn't support property or method 'matchAll'

console.log(Array.from(matches))
// [["te", "e"], ["t ", " "], ["tr", "r"]]

Expected behavior

Polyfill for stable ES features should be part of the bundle when importing react-app-polyfill/stable.

In the case it isn't, explicitly importing the polyfill for the feature should work.

@skoging
Copy link
Contributor Author

skoging commented Apr 22, 2020

I believe the issue is a mismatch between the core-js dependency version: ^3.5.0 and the babel preset-env option corejs: 3.

core-js recommends specifying the minor version in the preset-env options: corejs: '3.6' to make sure stable features added in minor versions are correctly handled.

This description matches the behavior seen in this issue, and a local edit of the babel preset in node_modules/babel-preset-react-app/create.js confirmed that this change fixes the problem.

The easy solution is to change the preset-env option to specify the minor version, both 3.5 an 3.6 worked with String#matchAll when I tested it. Seeing as these settings are in different packages (react-app-polyfill and babel-preset-react-app) that don't depend on each other, I'm not sure what the best approach to keeping these versions in sync is.

@Mrman
Copy link

Mrman commented Apr 24, 2020

This would close #8779 too :)

@stale
Copy link

stale bot commented May 24, 2020

This issue has been automatically marked as stale because it has not had any recent activity. It will be closed in 5 days if no further activity occurs.

@stale stale bot added the stale label May 24, 2020
@stale
Copy link

stale bot commented May 30, 2020

This issue has been automatically closed because it has not had any recent activity. If you have a question or comment, please open a new issue.

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