bug: Static Initialization Blocks Not Executing with Higher ECMAScript Versions in StencilJS

[a7medm7med]

Prerequisites

• [X] I have read the Contributing Guidelines.
• [X] I agree to follow the Code of Conduct.
• [X] I have searched for existing issues that already report this problem, without success.

Stencil Version

4.12.2

Current Behavior

Static initialization blocks fail to execute when the target option in the tsconfig file is set to a higher ECMAScript version than ES2017.

Expected Behavior

Static initialization blocks should execute successfully, regardless of the ECMAScript version specified in the tsconfig file.

System Info

System: node 18.19.0
    Platform: windows (10.0.22631)
   CPU Model: 11th Gen Intel(R) Core(TM) i5-11400H @ 2.70GHz (12 cpus)
    Compiler: D:\Work\Projects\web-components\node_modules\.pnpm\@[email protected]\node_modules\@stencil\core\compiler\stencil.js
       Build: 1707755243
     Stencil: 4.12.2
  TypeScript: 5.3.3
      Rollup: 2.56.3
      Parse5: 7.1.2
      jQuery: 4.0.0-pre
      Terser: 5.27.0

Steps to Reproduce

• Create a StencilJS project.
• Configure the tsconfig file to use an ECMAScript version higher than ES2017 in the target option.
• Implement a class with static initialization blocks.
• Compile and run the StencilJS project.

Code Reproduction URL

https://github.com/a7medm7med/stencil-static-bug

Additional Information

This issue significantly hinders developers from adopting modern ECMAScript features while working with StencilJS, thus impeding the progression of JavaScript development practices. Any insights, workarounds, or resolutions to address this issue would be greatly appreciated.

[christian-bromann]

@a7medm7med thanks for raising the issue. I can confirm that setting ES2022 as target fails while ES2021 compiles fine. The JavaScript feature in question here are static initialization blocks implemented in src/controllers/localize.ts.

I've ingested this into our backlog for the team to take a look at.

[alicewriteswrongs]

It looks like this is a Rollup-related issue, since support for static initialization blocks was added in 2.59.0 but we're on 2.56.3

[a7medm7med]

Consider upgrading the Rollup version to at least 2.68.0 for improved performance and compatibility.

[rwaskiewicz]

Hey @a7medm7med 👋

We will be upgrading our version of rollup later this year. Due to some cross-dependency limitations/breaking changes in rollup plugins that Stencil exposes, we're targeting this for the Stencil v5 release later this year.

[a7medm7med]

@rwaskiewicz

Thanks for the update on the rollup upgrade and the Stencil v5 release. I appreciate your efforts in keeping us informed. Out of curiosity, do you know if StencilJS will be considering the adoption of Rollup version 3 in the upcoming releases as well? Looking forward to hearing more about the developments. Thanks again to you and the team for your hard work! 🚀👍

[rwaskiewicz]

Thanks!

do you know if StencilJS will be considering the adoption of Rollup version 3 in the upcoming releases as well

Yes, we're planning on moving to the latest version of rollup (v4.x as of this writing)