Add ability to pass config with jest config (#282)

Author: mmarkelov

src/PlaywrightEnvironment.ts

@@ -18,14 +18,14 @@ import {
   IMPORT_KIND_PLAYWRIGHT,
   PERSISTENT,
   LAUNCH,
+  CONFIG_ENVIRONMENT_NAME,
 } from './constants'
 import {
   deepMerge,
   getBrowserOptions,
   getBrowserType,
   getDeviceType,
   getPlaywrightInstance,
-  readConfig,
 } from './utils'
 import { saveCoverageOnPage, saveCoverageToFile } from './coverage'
 
@@ -77,7 +77,6 @@ const getBrowserPerProcess = async (
 }
 
 export const getPlaywrightEnv = (basicEnv = 'node'): unknown => {
-  // eslint-disable-next-line @typescript-eslint/no-var-requires
   const RootEnv = require(basicEnv === 'node'
     ? 'jest-environment-node'
     : 'jest-environment-jsdom')
@@ -92,8 +91,9 @@ export const getPlaywrightEnv = (basicEnv = 'node'): unknown => {
     }
 
     async setup(): Promise<void> {
-      const { rootDir, wsEndpoint, browserName } = this._config
-      this._jestPlaywrightConfig = await readConfig(rootDir)
+      const { wsEndpoint, browserName, testEnvironmentOptions } = this._config
+      this._jestPlaywrightConfig =
+        testEnvironmentOptions[CONFIG_ENVIRONMENT_NAME]
       const {
         connectOptions,
         collectCoverage,
@@ -102,7 +102,7 @@ export const getPlaywrightEnv = (basicEnv = 'node'): unknown => {
         launchType,
         debugOptions,
       } = this._jestPlaywrightConfig
-      if (wsEndpoint && !connectOptions?.wsEndpoint) {
+      if (wsEndpoint) {
         this._jestPlaywrightConfig.connectOptions = {
           ...connectOptions,
           wsEndpoint,

src/PlaywrightRunner.ts

@@ -25,24 +25,33 @@ import {
   getPlaywrightInstance,
   getBrowserOptions,
 } from './utils'
-import { DEFAULT_TEST_PLAYWRIGHT_TIMEOUT, SERVER } from './constants'
+import {
+  DEFAULT_TEST_PLAYWRIGHT_TIMEOUT,
+  CONFIG_ENVIRONMENT_NAME,
+  SERVER,
+} from './constants'
 import { BrowserServer } from 'playwright-core'
 import { setupCoverage, mergeCoverage } from './coverage'
 
 const getBrowserTest = (
   test: JestPlaywrightTest,
+  config: JestPlaywrightConfig,
   browser: BrowserType,
   wsEndpoint: WsEndpointType,
   device: DeviceType,
 ): JestPlaywrightTest => {
-  const { displayName } = test.context.config
+  const { displayName, testEnvironmentOptions } = test.context.config
   const playwrightDisplayName = getDisplayName(browser, device)
   return {
     ...test,
     context: {
       ...test.context,
       config: {
         ...test.context.config,
+        testEnvironmentOptions: {
+          ...testEnvironmentOptions,
+          [CONFIG_ENVIRONMENT_NAME]: config,
+        },
         browserName: browser,
         wsEndpoint,
         device,
@@ -110,6 +119,7 @@ class PlaywrightRunner extends JestRunner {
             pwTests.push(
               getBrowserTest(
                 test as JestPlaywrightTest,
+                config,
                 browser,
                 wsEndpoint,
                 device,
@@ -120,6 +130,7 @@ class PlaywrightRunner extends JestRunner {
           pwTests.push(
             getBrowserTest(
               test as JestPlaywrightTest,
+              config,
               browser,
               wsEndpoint,
               null,
@@ -140,7 +151,11 @@ class PlaywrightRunner extends JestRunner {
     onFailure: OnTestFailure,
     options: TestRunnerOptions,
   ): Promise<void> {
-    const config = await readConfig(tests[0].context.config.rootDir)
+    const { rootDir, testEnvironmentOptions } = tests[0].context.config
+    const config = await readConfig(
+      rootDir,
+      testEnvironmentOptions[CONFIG_ENVIRONMENT_NAME],
+    )
     const browserTests = await this.getTests(tests, config)
     if (config.collectCoverage) {
       await setupCoverage()

src/constants.ts

@@ -2,6 +2,8 @@ import type { JestPlaywrightConfig, ConnectOptions } from '../types/global'
 
 export const IMPORT_KIND_PLAYWRIGHT = 'playwright'
 
+export const CONFIG_ENVIRONMENT_NAME = 'jest-playwright'
+
 export const CHROMIUM = 'chromium'
 export const FIREFOX = 'firefox'
 export const WEBKIT = 'webkit'

src/global.ts

@@ -26,9 +26,10 @@ const logMessage = ({
 export async function setup(
   jestConfig: JestConfig.GlobalConfig,
 ): Promise<void> {
+  // TODO It won't work if config doesn't exist in root directory or in jest.config.js file
   const config = await readConfig(jestConfig.rootDir)
 
-  // If we are in watch mode, - only setupServer() once.
+  // If we are in watch mode - only setupServer() once.
   if (jestConfig.watch || jestConfig.watchAll) {
     if (didAlreadyRunInWatchMode) return
     didAlreadyRunInWatchMode = true

src/utils.test.ts

@@ -2,7 +2,7 @@ import fs from 'fs'
 import path from 'path'
 import * as Utils from './utils'
 import { DEFAULT_CONFIG, CHROMIUM, FIREFOX } from './constants'
-import type { BrowserType } from '../types/global'
+import type { BrowserType, JestPlaywrightConfig } from '../types/global'
 
 const {
   readConfig,
@@ -35,7 +35,7 @@ describe('readConfig', () => {
       launchOptions: {
         headless: true,
       },
-      browser: 'chromium',
+      browsers: ['chromium'],
       contextOptions: {
         viewport: {
           width: 800,
@@ -52,6 +52,29 @@ describe('readConfig', () => {
     const config = await readConfig()
     expect(config).toMatchObject(configObject)
   })
+  it('should overwrite config if the second param is passed', async () => {
+    const configObject = {
+      launchOptions: {
+        headless: true,
+      },
+      browsers: ['chromium'],
+    }
+    jest.mock(
+      path.join(__dirname, '..', 'jest-playwright.config.js'),
+      () => ({
+        launchOptions: {
+          headless: true,
+        },
+        browsers: ['webkit'],
+      }),
+      { virtual: true },
+    )
+    const config = await readConfig(
+      process.cwd(),
+      configObject as JestPlaywrightConfig,
+    )
+    expect(config).toMatchObject(configObject)
+  })
   it('should overwrite with a custom configuration and spread the "launchOptions" and "contextOptions" setting', async () => {
     const configObject = {
       launchOptions: {

src/utils.ts

@@ -197,7 +197,11 @@ export const getSkipFlag = (
 
 export const readConfig = async (
   rootDir: string = process.cwd(),
+  jestEnvConfig?: JestPlaywrightConfig,
 ): Promise<JestPlaywrightConfig> => {
+  if (jestEnvConfig) {
+    return deepMerge<JestPlaywrightConfig>(DEFAULT_CONFIG, jestEnvConfig)
+  }
   const hasCustomConfigPath = !!process.env.JEST_PLAYWRIGHT_CONFIG
   let fileExtension = 'js'
   if (process.env.npm_package_type === 'module') {