tests: dynamically import all modules when using mocks (#14468)

core/test/gather/driver/navigation-test.js

@@ -11,21 +11,12 @@ import {
   flushAllTimersAndMicrotasks,
   timers,
 } from '../../test-utils.js';
-// import {gotoURL, getNavigationWarnings} from '../../../gather/driver/navigation.js';
 
 const {createMockOnceFn} = mockCommands;
 
 // Some imports needs to be done dynamically, so that their dependencies will be mocked.
-// See: https://jestjs.io/docs/ecmascript-modules#differences-between-esm-and-commonjs
-//      https://github.com/facebook/jest/issues/10025
-/** @type {import('../../../gather/driver/navigation.js')['gotoURL']} */
-let gotoURL;
-/** @type {import('../../../gather/driver/navigation.js')['getNavigationWarnings']} */
-let getNavigationWarnings;
-
-before(async () => {
-  ({gotoURL, getNavigationWarnings} = (await import('../../../gather/driver/navigation.js')));
-});
+// https://github.com/GoogleChrome/lighthouse/blob/main/docs/hacking-tips.md#mocking-modules-with-testdouble
+const {gotoURL, getNavigationWarnings} = await import('../../../gather/driver/navigation.js');
 
 timers.useFakeTimers();
 

core/test/gather/driver/prepare-test.js

@@ -8,18 +8,6 @@ import * as td from 'testdouble';
 
 import {createMockSession, createMockDriver} from '../mock-driver.js';
 import {flushAllTimersAndMicrotasks, fnAny, timers} from '../../test-utils.js';
-// import prepare from '../../../gather/driver/prepare.js';
-import * as constants from '../../../config/constants.js';
-
-// Some imports needs to be done dynamically, so that their dependencies will be mocked.
-// See: https://jestjs.io/docs/ecmascript-modules#differences-between-esm-and-commonjs
-//      https://github.com/facebook/jest/issues/10025
-/** @type {import('../../../gather/driver/prepare.js')} */
-let prepare;
-
-before(async () => {
-  prepare = (await import('../../../gather/driver/prepare.js'));
-});
 
 const storageMock = {
   clearDataForOrigin: fnAny(),
@@ -28,6 +16,11 @@ const storageMock = {
 };
 await td.replaceEsm('../../../gather/driver/storage.js', storageMock);
 
+// Some imports needs to be done dynamically, so that their dependencies will be mocked.
+// https://github.com/GoogleChrome/lighthouse/blob/main/docs/hacking-tips.md#mocking-modules-with-testdouble
+const prepare = await import('../../../gather/driver/prepare.js');
+const constants = await import('../../../config/constants.js');
+
 const url = 'https://example.com';
 let sessionMock = createMockSession();
 

core/test/gather/gatherers/dobetterweb/response-compression-test.js

@@ -5,21 +5,14 @@
  */
 
 import {createMockContext, mockDriverSubmodules} from '../../../gather/mock-driver.js';
-// import ResponseCompression from '../../../../gather/gatherers/dobetterweb/response-compression.js';
+
+const mocks = await mockDriverSubmodules();
 
 // Some imports needs to be done dynamically, so that their dependencies will be mocked.
-// See: https://jestjs.io/docs/ecmascript-modules#differences-between-esm-and-commonjs
-//      https://github.com/facebook/jest/issues/10025
+// https://github.com/GoogleChrome/lighthouse/blob/main/docs/hacking-tips.md#mocking-modules-with-testdouble
 /** @typedef {import('../../../../gather/gatherers/dobetterweb/response-compression.js')} ResponseCompression */
-/** @type {typeof import('../../../../gather/gatherers/dobetterweb/response-compression.js')} */
-let ResponseCompression;
-
-before(async () => {
-  ResponseCompression =
-    (await import('../../../../gather/gatherers/dobetterweb/response-compression.js')).default;
-});
-
-const mocks = await mockDriverSubmodules();
+const ResponseCompression =
+  (await import('../../../../gather/gatherers/dobetterweb/response-compression.js')).default;
 
 const networkRecords = [
   {

core/test/gather/gatherers/link-elements-test.js

@@ -7,22 +7,16 @@
 import jestMock from 'jest-mock';
 import * as td from 'testdouble';
 
-// Some imports needs to be done dynamically, so that their dependencies will be mocked.
-// See: https://jestjs.io/docs/ecmascript-modules#differences-between-esm-and-commonjs
-//      https://github.com/facebook/jest/issues/10025
-/** @typedef {import('../../../gather/gatherers/link-elements.js').default} LinkElements */
-/** @type {typeof import('../../../gather/gatherers/link-elements.js').default} */
-let LinkElements;
-
-before(async () => {
-  LinkElements = (await import('../../../gather/gatherers/link-elements.js')).default;
-});
-
 const mockMainResource = jestMock.fn();
 await td.replaceEsm('../../../computed/main-resource.js', {
   MainResource: {request: mockMainResource},
 });
 
+// Some imports needs to be done dynamically, so that their dependencies will be mocked.
+// https://github.com/GoogleChrome/lighthouse/blob/main/docs/hacking-tips.md#mocking-modules-with-testdouble
+/** @typedef {import('../../../gather/gatherers/link-elements.js').default} LinkElements */
+const LinkElements = (await import('../../../gather/gatherers/link-elements.js')).default;
+
 beforeEach(() => {
   mockMainResource.mockReset();
 });

core/test/gather/gatherers/script-elements-test.js

@@ -5,21 +5,14 @@
  */
 
 import {createMockContext, mockDriverSubmodules} from '../mock-driver.js';
-// import ScriptElements from '../../../gather/gatherers/script-elements.js';
-import {NetworkRequest} from '../../../lib/network-request.js';
+
+const mocks = await mockDriverSubmodules();
 
 // Some imports needs to be done dynamically, so that their dependencies will be mocked.
-// See: https://jestjs.io/docs/ecmascript-modules#differences-between-esm-and-commonjs
-//      https://github.com/facebook/jest/issues/10025
+// https://github.com/GoogleChrome/lighthouse/blob/main/docs/hacking-tips.md#mocking-modules-with-testdouble
 /** @typedef {import('../../../gather/gatherers/script-elements.js').default} ScriptElements */
-/** @type {typeof import('../../../gather/gatherers/script-elements.js').default} */
-let ScriptElements;
-
-before(async () => {
-  ScriptElements = (await import('../../../gather/gatherers/script-elements.js')).default;
-});
-
-const mocks = await mockDriverSubmodules();
+const ScriptElements = (await import('../../../gather/gatherers/script-elements.js')).default;
+const {NetworkRequest} = await import('../../../lib/network-request.js');
 
 /**
  * @param {Partial<LH.Artifacts.NetworkRequest>=} partial

core/test/gather/gatherers/service-worker-test.js

@@ -10,18 +10,6 @@ import * as td from 'testdouble';
 
 import {fnAny} from '../../test-utils.js';
 
-// import ServiceWorkerGather from '../../../gather/gatherers/service-worker.js';
-
-// Some imports needs to be done dynamically, so that their dependencies will be mocked.
-// See: https://jestjs.io/docs/ecmascript-modules#differences-between-esm-and-commonjs
-//      https://github.com/facebook/jest/issues/10025
-/** @type {typeof import('../../../gather/gatherers/service-worker.js').default} */
-let ServiceWorkerGather;
-
-before(async () => {
-  ServiceWorkerGather = (await import('../../../gather/gatherers/service-worker.js')).default;
-});
-
 const getServiceWorkerVersions = fnAny();
 const getServiceWorkerRegistrations = fnAny();
 
@@ -30,6 +18,10 @@ await td.replaceEsm('../../../gather/driver/service-workers.js', {
   getServiceWorkerRegistrations,
 });
 
+// Some imports needs to be done dynamically, so that their dependencies will be mocked.
+// https://github.com/GoogleChrome/lighthouse/blob/main/docs/hacking-tips.md#mocking-modules-with-testdouble
+const ServiceWorkerGather = (await import('../../../gather/gatherers/service-worker.js')).default;
+
 describe('service worker gatherer', () => {
   it('obtains the active service worker registration', async () => {
     const url = 'https://example.com/';

core/test/gather/navigation-runner-test.js

@@ -12,30 +12,27 @@ import {
   mockDriverSubmodules,
   mockRunnerModule,
 } from './mock-driver.js';
-import {initializeConfig} from '../../config/config.js';
-import {defaultNavigationConfig} from '../../config/constants.js';
-import {LighthouseError} from '../../lib/lh-error.js';
-import DevtoolsLogGatherer from '../../gather/gatherers/devtools-log.js';
-import TraceGatherer from '../../gather/gatherers/trace.js';
 import {fnAny} from '../test-utils.js';
 import {networkRecordsToDevtoolsLog} from '../network-records-to-devtools-log.js';
 import {Runner as runnerActual} from '../../runner.js';
 
-// Some imports needs to be done dynamically, so that their dependencies will be mocked.
-// See: https://jestjs.io/docs/ecmascript-modules#differences-between-esm-and-commonjs
-//      https://github.com/facebook/jest/issues/10025
-/** @type {import('../../gather/navigation-runner.js')} */
-let runner;
-
 const mocks = await mockDriverSubmodules();
 const mockRunner = await mockRunnerModule();
 beforeEach(async () => {
   mockRunner.reset();
   mockRunner.getGathererList.mockImplementation(runnerActual.getGathererList);
   mockRunner.getAuditList.mockImplementation(runnerActual.getAuditList);
-  runner = (await import('../../gather/navigation-runner.js'));
 });
 
+// Some imports needs to be done dynamically, so that their dependencies will be mocked.
+// https://github.com/GoogleChrome/lighthouse/blob/main/docs/hacking-tips.md#mocking-modules-with-testdouble
+const runner = await import('../../gather/navigation-runner.js');
+const {LighthouseError} = await import('../../lib/lh-error.js');
+const DevtoolsLogGatherer = (await import('../../gather/gatherers/devtools-log.js')).default;
+const TraceGatherer = (await import('../../gather/gatherers/trace.js')).default;
+const {initializeConfig} = await import('../../config/config.js');
+const {defaultNavigationConfig} = await import('../../config/constants.js');
+
 /** @typedef {{meta: LH.Gatherer.GathererMeta<'Accessibility'>, getArtifact: Mock<any, any>, startInstrumentation: Mock<any, any>, stopInstrumentation: Mock<any, any>, startSensitiveInstrumentation: Mock<any, any>, stopSensitiveInstrumentation:  Mock<any, any>}} MockGatherer */
 
 describe('NavigationRunner', () => {

core/test/gather/snapshot-runner-test.js

@@ -4,7 +4,6 @@
  * Unless required by applicable law or agreed to in writing, software distributed under the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for the specific language governing permissions and limitations under the License.
  */
 
-// import {snapshotGather} from '../../../gather/snapshot-runner.js';
 import * as td from 'testdouble';
 
 import {
@@ -15,16 +14,6 @@ import {
   mockRunnerModule,
 } from './mock-driver.js';
 
-// Some imports needs to be done dynamically, so that their dependencies will be mocked.
-// See: https://jestjs.io/docs/ecmascript-modules#differences-between-esm-and-commonjs
-//      https://github.com/facebook/jest/issues/10025
-/** @type {import('../../gather/snapshot-runner.js')['snapshotGather']} */
-let snapshotGather;
-
-before(async () => {
-  snapshotGather = (await import('../../gather/snapshot-runner.js')).snapshotGather;
-});
-
 const mockRunner = await mockRunnerModule();
 
 // Establish the mocks before we import the file under test.
@@ -34,6 +23,10 @@ let mockDriver;
 await td.replaceEsm('../../gather/driver.js',
   mockDriverModule(() => mockDriver.asDriver()));
 
+// Some imports needs to be done dynamically, so that their dependencies will be mocked.
+// https://github.com/GoogleChrome/lighthouse/blob/main/docs/hacking-tips.md#mocking-modules-with-testdouble
+const {snapshotGather} = await import('../../gather/snapshot-runner.js');
+
 describe('Snapshot Runner', () => {
   /** @type {ReturnType<typeof createMockPage>} */
   let mockPage;

core/test/gather/timespan-runner-test.js

@@ -6,7 +6,6 @@
 
 import * as td from 'testdouble';
 
-// import {startTimespanGather} from '../../../gather/timespan-runner.js';
 import {
   createMockDriver,
   createMockPage,
@@ -16,17 +15,6 @@ import {
   mockRunnerModule,
 } from './mock-driver.js';
 
-// Some imports needs to be done dynamically, so that their dependencies will be mocked.
-// See: https://jestjs.io/docs/ecmascript-modules#differences-between-esm-and-commonjs
-//      https://github.com/facebook/jest/issues/10025
-/** @type {import('../../gather/timespan-runner.js')['startTimespanGather']} */
-let startTimespanGather;
-
-before(async () => {
-  startTimespanGather =
-    (await import('../../gather/timespan-runner.js')).startTimespanGather;
-});
-
 const mockSubmodules = await mockDriverSubmodules();
 const mockRunner = await mockRunnerModule();
 
@@ -36,6 +24,10 @@ let mockDriver;
 await td.replaceEsm('../../gather/driver.js',
   mockDriverModule(() => mockDriver.asDriver()));
 
+// Some imports needs to be done dynamically, so that their dependencies will be mocked.
+// https://github.com/GoogleChrome/lighthouse/blob/main/docs/hacking-tips.md#mocking-modules-with-testdouble
+const {startTimespanGather} = await import('../../gather/timespan-runner.js');
+
 describe('Timespan Runner', () => {
   /** @type {ReturnType<typeof createMockPage>} */
   let mockPage;

core/test/legacy/gather/gather-runner-test.js

@@ -8,13 +8,7 @@ import assert from 'assert/strict';
 
 import jestMock from 'jest-mock';
 
-import {Gatherer} from '../../../gather/gatherers/gatherer.js';
-// import GathererRunner_ from '../../legacy/gather/gather-runner.js';
-// import {Config} from '../../legacy/config/config.js';
-import {LighthouseError} from '../../../lib/lh-error.js';
 import {networkRecordsToDevtoolsLog} from '../../network-records-to-devtools-log.js';
-// import {Driver} from '../../legacy/gather/driver.js';
-import {Connection} from '../../../legacy/gather/connections/connection.js';
 import {createMockSendCommandFn, createMockOnceFn} from '../../gather/mock-commands.js';
 import {
   makeMocksForGatherRunner,
@@ -50,23 +44,20 @@ function createTypeHackedGatherRunner() {
 }
 
 // Some imports needs to be done dynamically, so that their dependencies will be mocked.
-// See: https://jestjs.io/docs/ecmascript-modules#differences-between-esm-and-commonjs
-//      https://github.com/facebook/jest/issues/10025
+// https://github.com/GoogleChrome/lighthouse/blob/main/docs/hacking-tips.md#mocking-modules-with-testdouble
 /** @typedef {import('../../../legacy/gather/driver.js').Driver} Driver */
-/** @type {typeof import('../../../legacy/gather/driver.js').Driver} */
-let Driver;
-/** @type {typeof import('../../../legacy/gather/gather-runner.js').GatherRunner} */
-let GatherRunner_;
 /** @typedef {import('../../../legacy/config/config.js').Config} Config */
-/** @type {typeof import('../../../legacy/config/config.js').Config} */
-let Config;
+/** @typedef {import('../../../legacy/gather/connections/connection.js').Connection} Connection */
+const {Driver} = await import('../../../legacy/gather/driver.js');
+const {GatherRunner: GatherRunner_} = await import('../../../legacy/gather/gather-runner.js');
+const {Config} = await import('../../../legacy/config/config.js');
+const {Gatherer} = await import('../../../gather/gatherers/gatherer.js');
+const {LighthouseError} = await import('../../../lib/lh-error.js');
+const {Connection} = await import('../../../legacy/gather/connections/connection.js');
 
 /** @type {ReturnType<createTypeHackedGatherRunner>} */
 let GatherRunner;
 before(async () => {
-  Driver = (await import('../../../legacy/gather/driver.js')).Driver;
-  GatherRunner_ = (await import('../../../legacy/gather/gather-runner.js')).GatherRunner;
-  Config = (await import('../../../legacy/config/config.js')).Config;
   assertNoSameOriginServiceWorkerClientsMock =
     jestMock.spyOn(GatherRunner_, 'assertNoSameOriginServiceWorkerClients');
   GatherRunner = createTypeHackedGatherRunner();