Skip to content

bug: includeGlobalScripts doesn't work as expected #6218

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

Open
3 tasks done
mm-georges opened this issue Apr 1, 2025 · 1 comment
Open
3 tasks done

bug: includeGlobalScripts doesn't work as expected #6218

mm-georges opened this issue Apr 1, 2025 · 1 comment

Comments

@mm-georges
Copy link

Prerequisites

Stencil Version

4.28.3

Current Behavior

Hello,

I'm trying to archive the old behaviour back, which adds the .hydrated class to the HTML element.

I added a global script to my stencil.config.ts which has following code:

export default () => {
    window.addEventListener('appload', () => {
        document.documentElement.classList.add('hydrated');
    });
};

for the dist output targets it works as expected but for output targets which uses dist-custom-elements it's not working as expected even after adding includeGlobalScripts: true to the stencil.config.ts.

I tested it by importing my stencil standalone components into my application.

Expected Behavior

I expect, after adding one Stencil Angular Standalone component to my Angular App, the global script runs initially.

System Info

Steps to Reproduce

  1. Create a Global Script
  2. Define it in the stencil.config.ts
  3. Add includeGlobalScripts to the "dist-custom-elements"
  4. Generate Angular Standalone Output Targets
  5. Import these components into your Angular App

Code Reproduction URL

..

Additional Information

No response

@christian-bromann
Copy link
Member

I'm trying to archive the old behaviour back, which adds the .hydrated class to the HTML element.

We have removed this because we didn't see any purpose for this anymore as there is no indication that users still use Stencil as static site generator. Can you elaborate on your use case?

for the dist output targets it works as expected but for output targets which uses dist-custom-elements

It looks like global scripts are only injected when using dist as output target. You can workaround this by injecting your global script before setting the script to the dist-custom-element asset. In general I would not recommend using Stencils global script primitive.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants