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

Core-js forEach import polyfill not working, Babel with the same config works fine #9544

Open
gitrequests opened this issue Sep 10, 2024 · 0 comments · Fixed by #9573
Open
Assignees
Labels
Milestone

Comments

@gitrequests
Copy link

Describe the bug

SWC does not import forEach polyfill from core-js. Babel with the same config works fine (Import is present in the code: require("core-js/modules/web.dom-collections.for-each.js");).
Steps to reproduce:

  1. Init npm and install dependencies npm init && npm i -D @swc/cli @swc/core
  2. Create index.js entry file with following content
document.querySelectorAll('div').forEach(el => {
    console.log(el);
})
  1. Create SWC config .swcrc:
{
    "$schema": "https://swc.rs/schema.json",
    "jsc": {
        "parser": {
            "syntax": "ecmascript",
        },
    },
    "env": {
        "targets": {
            "chrome": "40"
        },
        "mode": "usage",
        "coreJs": "3.22"
    }
}
  1. Run: npx swc index.js
  2. Check that forEach polyfill is not in imports

I prepared a comparison of SWC and BABEL playgrounds with the same config (env.mode = "usage"). You can see that BABEL includes a forEach polyfill for this code.

SWC playground: https://play.swc.rs/?version=1.7.24&code=H4sIAAAAAAAAA0vJTy7NTc0r0SssTS2qDE7NSU0uyS9yzMnRUE%2FJLFPX1EvLL3JNTM7QSCvNSy7JzM%2FTSM3RVKjmUgCC5Py84vycVL2c%2FHSQqDVXraY1AL32f8ZQAAAA&config=H4sIAAAAAAAAA1WOzQ6DIBCE7z4F2XPT9C899BGa9CEorhQjYlhoNMZ3ryBYvbHfDDMzFoxBTQIebJyf89FxS2jXeyY0tI73MwEUmpOwqnNwyGpNQap4QxjRtCjQGEOYlcS0alU1bLOF0Z1For0xWHkrG9wnFykdtCl9FNNmN3QY99Ed%2FqZctgaDolf%2B6axfGLbfTRC3El1YA%2BJjjUZ2O0Eeb8pY4olLzFAYi8%2Fovx4v50zfXlaqR0o9YVIx%2FQBKsvGpawEAAA%3D%3D

Babel playground: https://babeljs.io/repl#?browsers=chrome%2040&build=&builtIns=usage&corejs=3.21&spec=false&loose=false&code_lz=CYewxgrgtgpgdgFwHQEcIwE4E8DKMA2MYCIGAgvvgBQDkwAlgG40CUSAZqQKICGYAFlQIACALwA-YQG8AUMPnCwIOAGcQhJPhABzIfhYBuGQF8WQA&debug=false&forceAllTransforms=false&modules=false&shippedProposals=false&evaluate=false&fileSize=false&timeTravel=false&sourceType=script&lineWrap=true&presets=env&prettier=false&targets=&version=7.24.10&externalPlugins=&assumptions=%7B%7D


As you can see, babel adds the necessary import - require("core-js/modules/web.dom-collections.for-each.js");
When testing in chrome 40 (as in env.targets from .swcrc), the browser processes the babel code without errors, but the SWC code produces an error: Uncaught TypeError: undefined is not a function

Input code

document.querySelectorAll('div').forEach(el => {
    console.log(el);
})

Config

{
    "$schema": "https://swc.rs/schema.json",
    "jsc": {
        "parser": {
            "syntax": "ecmascript",
        },
    },
    "env": {
        "targets": {
            "chrome": "40"
        },
        "mode": "usage",
        "coreJs": "3.22"
    }
}

Playground link (or link to the minimal reproduction)

https://play.swc.rs/?version=1.7.24&code=H4sIAAAAAAAAA0vJTy7NTc0r0SssTS2qDE7NSU0uyS9yzMnRUE%2FJLFPX1EvLL3JNTM7QSCvNSy7JzM%2FTSM3RVKjmUgCC5Py84vycVL2c%2FHSQqDVXraY1AL32f8ZQAAAA&config=H4sIAAAAAAAAA1WOzQ6DIBCE7z4F2XPT9C899BGa9CEorhQjYlhoNMZ3ryBYvbHfDDMzFoxBTQIebJyf89FxS2jXeyY0tI73MwEUmpOwqnNwyGpNQap4QxjRtCjQGEOYlcS0alU1bLOF0Z1For0xWHkrG9wnFykdtCl9FNNmN3QY99Ed%2FqZctgaDolf%2B6axfGLbfTRC3El1YA%2BJjjUZ2O0Eeb8pY4olLzFAYi8%2Fovx4v50zfXlaqR0o9YVIx%2FQBKsvGpawEAAA%3D%3D

SWC Info output

Operating System:
Platform: linux
Arch: x64
Machine Type: x86_64
Version: #41-Ubuntu SMP PREEMPT_DYNAMIC Fri Aug 2 20:41:06 UTC 2024
CPU: (16 cores)
Models: Intel(R) Core(TM) i9-10980HK CPU @ 2.40GHz

Binaries:
Node: 20.17.0
npm:
Yarn: 0.32+git
pnpm: N/A

Relevant Packages:
@swc/core: 1.7.24
@swc/helpers: N/A
@swc/types: 0.1.12

Expected behavior

The forEach polyfill import must be present in the code
import "core-js/modules/web.dom-collections.for-each.js"

Actual behavior

Import forEach polyfill is currently not in the code

Version

1.7.24

Additional context

No response

@kdy1 kdy1 added this to the Planned milestone Sep 10, 2024
@kdy1 kdy1 self-assigned this Sep 10, 2024
@kdy1 kdy1 closed this as completed in #9573 Oct 8, 2024
@kdy1 kdy1 closed this as completed in 9a11d34 Oct 8, 2024
@kdy1 kdy1 reopened this Oct 8, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Development

Successfully merging a pull request may close this issue.

2 participants