Skip to content

Worker with ES Modules throws JavaScript TypeError: Using ImportScripts inside a Module Worker is disallowed. (Firefox, Safari, Chrome --disable-native-automation) #8251

@htho

Description

@htho

What is your Scenario?

I want to test a page that uses WebWorkers with real ES modules.

What is the Current behavior?

The page throws with:
TypeError: WorkerGlobalScope.importScripts: Using ImportScripts inside a Module Worker is disallowed.

What is the Expected behavior?

The page should not throw.

What is the public URL of the test page? (attach your complete example)

https://github.com/htho/testcafe-repro-module-worker -- see this repository

What is your TestCafe test code?

import { fixture, test, Selector } from "testcafe";

fixture("Worker")
	.page(`http://127.0.0.1:3000/index.html`)


test("works", async(t) => {
    await t.expect(Selector("#out").textContent).eql("");
    await t.click(Selector("#btn"))
    await t.expect(Selector("#out").textContent).eql("42");
});

Your complete configuration file

No response

Your complete test report

> npm run test

> test
> testcafe firefox test.tc.ts

 Running tests in:
 - Firefox 128.0 / Windows 10

 Worker
 × works

   1) A JavaScript error occurred on "http://127.0.0.1:3000/".
      Repeat test actions in the browser and check the console for errors.
      Enable the “skipJsErrors” option to ignore JavaScript errors during test execution. Learn more:
      "https://testcafe.io/documentation/404038/recipes/debugging/skip-javascript-errors"
      If the website only throws this error when you test it with TestCafe, please create a new issue at:
      "https://github.com/DevExpress/testcafe/issues/new?template=bug-report.md".

      JavaScript error details:
      TypeError: WorkerGlobalScope.importScripts: Using `ImportScripts` inside a Module Worker is disallowed.
          No stack trace available

      Browser: Firefox 128.0 / Windows 10

          4 |    .page(`http://127.0.0.1:3000/index.html`)
          5 |
          6 |
          7 |test("works", async(t) => {
          8 |    await t.expect(Selector("#out").textContent).eql("");
       >  9 |    await t.click(Selector("#btn"))
         10 |    await t.expect(Selector("#out").textContent).eql("42");
         11 |});

         at <anonymous> (C:\dev\github.com\htho\testcafe-repro-module-worker\test.tc.ts:9:13)
         at fulfilled (C:\dev\github.com\htho\testcafe-repro-module-worker\test.tc.ts:5:58)



 1/1 failed (1s)
PS C:\dev\github.com\htho\testcafe-repro-module-worker> 

Screenshots

No response

Steps to Reproduce

  1. git clone https://github.com/htho/testcafe-repro-module-worker.git
  2. cd testcafe-repro-module-worker
  3. npm i
  4. npm run serve
  5. npm run test (in another terminal)

TestCafe version

3.6.2

Node.js version

v20.15.1

Command-line arguments

testcafe firefox test.tc.ts

Browser name(s) and version(s)

Firefox 128.0.3

Platform(s) and version(s)

Windows 10

Other

Needles to say that the page/worker does not use importScripts().
But it seems that TestCafe/Hammerhead adds importScripts() to the workers source.
This is also why it works with Chrome with native automation.
Chrome has been suppotring ES Modules in workers for a while now. Firefox just catched up.
There will soon be more people having this problem as soon as they create apps without an importScripts() fallback.

Metadata

Metadata

Assignees

Labels

TYPE: bugThe described behavior is considered as wrong (bug).

Type

No fields configured for Task.

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions