fix: log JSDOM errors more cleanly

Author: SimenB

CHANGELOG.md

@@ -18,6 +18,7 @@
 - `[expect]` Move typings of `.not`, `.rejects` and `.resolves` modifiers outside of `Matchers` interface ([#12346](https://github.com/facebook/jest/pull/12346))
 - `[expect]` Expose `AsymmetricMatchers` and `RawMatcherFn` interfaces ([#12363](https://github.com/facebook/jest/pull/12363))
 - `[jest-environment-jsdom]` Make `jsdom` accessible to extending environments again ([#12232](https://github.com/facebook/jest/pull/12232))
+- `[jest-environment-jsdom]` Log JSDOM errors more cleanly ([#12386](https://github.com/facebook/jest/pull/12386))
 - `[jest-config]` Correctly detect CI environment and update snapshots accordingly ([#12378](https://github.com/facebook/jest/pull/12378))
 - `[jest-jasmine2, jest-types]` [**BREAKING**] Move all `jasmine` specific types from `@jest/types` to its own package ([#12125](https://github.com/facebook/jest/pull/12125))
 

packages/jest-environment-jsdom/src/index.ts

@@ -31,6 +31,13 @@ export default class JSDOMEnvironment implements JestEnvironment<number> {
   moduleMocker: ModuleMocker | null;
 
   constructor(config: Config.ProjectConfig, options?: EnvironmentContext) {
+    const anyConsole = options?.console ?? console;
+    const virtualConsole = new VirtualConsole();
+    virtualConsole.sendTo(anyConsole, {omitJSDOMErrors: true});
+    virtualConsole.on('jsdomError', error => {
+      anyConsole.error(error);
+    });
+
     this.dom = new JSDOM(
       typeof config.testEnvironmentOptions.html === 'string'
         ? config.testEnvironmentOptions.html
@@ -45,9 +52,7 @@ export default class JSDOMEnvironment implements JestEnvironment<number> {
             : undefined,
         runScripts: 'dangerously',
         url: config.testURL,
-        virtualConsole: new VirtualConsole().sendTo(
-          options?.console || console,
-        ),
+        virtualConsole,
         ...config.testEnvironmentOptions,
       },
     );