fix: replace inactive harmony import specifiers with undefined to avoid global reference (#20151)

[samarthsinh2660]

Summary*

Fixes Issue #20151: An unused function in ESM code incorrectly referencing a global variable.

When Webpack's usedExports optimization marks a harmony import specifier as inactive (meaning it's not used), the code containing the reference is still preserved in the bundle (to be later removed by a minimizer). However, the import specifier itself was not being transformed, leaving an untransformed identifier that leaked as a global reference.

This fix ensures that inactive harmony import specifiers are replaced with undefined instead of being left untransformed, preventing global variable clashes and incorrect references.

What kind of change does this PR introduce?

fix

Did you add tests for your changes?

Yes, added a regression test in test/configCases/issues/issue-20151/ that verifies unused harmony imports are properly transformed.

Does this PR introduce a breaking change?

No

If relevant, what needs to be documented once your changes are merged or what have you already documented?

None

[changeset-bot]

⚠️ No Changeset found

Latest commit: 75e3c82

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

This PR includes no changesets

When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types

Click here to learn what changesets are, and how to add one.

Click here if you're a maintainer who wants to add a changeset to this PR

[codspeed-hq]

CodSpeed Performance Report

Merging #20276 will not alter performance

_{Comparing samarthsinh2660:fix/20151-esm-unused-func-global-ref (75e3c82) with main (d2a124d)}

Summary

✅ 72 untouched

[evenstensberg]

Nice work here. Good that you also added tests. Could you set up a repro repo with the bug in one branch and this fix in another? Thanks!

[samarthsinh2660]

Nice work here. Good that you also added tests. Could you set up a repro repo with the bug in one branch and this fix in another? Thanks!

I have created a reproduction repository here: https://github.com/samarthsinh2660/issue-20151-repro

It has two branches:

bug: Reproduces the issue using the current webpack version. In dist/main.js, you can see the unused function still contains a reference to the untransformed i18n identifier.
fix: Demonstrates the fix by linking to this PR's changes. In dist/main.js, the identifier is correctly replaced with /* inactive harmony import i18n __ */ undefined.
Detailed instructions for verification are included in the repository's README.

[hai-x]

Hmm, I’d prefer to add variable decl to represent the import binding, rather than replacing those with undefined. I think this keeps the bundle more readable.

Also feel free to improve the test case to ensure it have solved the issue. Thank you.

[samarthsinh2660]

Hmm, I’d prefer to add variable decl to represent the import binding, rather than replacing those with undefined. I think this keeps the bundle more readable.

Also feel free to improve the test case to ensure it have solved the issue. Thank you.

Thanks for the feedback! I have updated the PR to use variable declarations for inactive imports instead of inline replacement. This keeps the code readable as suggested.

I also improved the test case to verify that the var declaration is correctly added and the original identifier is preserved in the code.

The reproduction repository (issue-20151-repro) has also been updated on the fix branch.

[hai-x]

@samarthsinh2660 Hi, I’ve created a PR to fix this—would you mind if I took it over? Thanks again for your help.

#20286

[samarthsinh2660]

@samarthsinh2660 Hi, I’ve created a PR to fix this—would you mind if I took it over? Thanks again for your help.

#20286

Hi @hai-x , absolutely! I’m happy for you to take it over. Glad I could help with the initial reproduction and the logic.

If you have a moment, I would also be very grateful if you could point out any mistakes I made or better patterns I should have used. I'm eager to learn and improve my contributions to Webpack!

Thanks again!