test: use strict mode for ng_elements integration test

Apparently the Rollup bundle for these tests defaults to `es` format, meaning it expects to be loaded at runtime as native ESM. This was not happening because it was loaded as a regular `<script src="...">` tag (note the lack of `type="module"`).

This is problematic because Rollup assumed it would be running in a scoped environment, meaning [this function](adb8d1078d/packages/core/primitives/event-dispatch/src/event.ts (L45)), which happens to be named `addEventListener` but does *not* implement the `EventTarget.prototype.addEventListener` contract, was being bundled as a simple:

```javascript
function addEventListener(element, ...) {
  // ...
}
```

Since this was loaded with no `type="module"` or `'use strict';`, the script executed in "sloppy mode", meaning all `var` statements and function definitions are implicitly global. Since `window` *is* the `globalThis` object, this random `addEventListener` function clobbers the actual `window.addEventListener` and breaks any calls to it because they're not implementing the same contract.

Fix is to just use `<script src="..." type="module">`. Alternatively we could bundle in an IIFE, which Rollup does support, but in theory we could depend on external ES modules which aren't bundled, so the `type="module"` seems a little safer and more future-proof.
This commit is contained in:
Doug Parker 2026-04-10 15:55:55 -07:00 committed by Kirill Cherkashin
parent 0f6e850a65
commit cf47eb41ff
2 changed files with 2 additions and 2 deletions

View file

@ -11,6 +11,6 @@
<hello-world-el></hello-world-el>
<hello-world-onpush-el></hello-world-onpush-el>
<hello-world-shadow-el></hello-world-shadow-el>
<script src="dist/bundle.js"></script>
<script src="dist/bundle.js" type="module"></script>
</body>
</html>

View file

@ -12,6 +12,6 @@
<p>TestCardContent</p>
<span slot="card-footer">TestCardFooter</span>
</test-card>
<script src="dist/bundle.js"></script>
<script src="dist/bundle.js" type="module"></script>
</body>
</html>