Add ability to deepMerge arrays (#683)

* Add ability to deepMerge arrays

* Remove test suite restriction

* Correct prettier style

* Correct prettier format

* Correct tests by spreading DEFAULT_CONFIG

Author: chambo-e

src/PlaywrightEnvironment.ts

@@ -139,10 +139,10 @@ export const getPlaywrightEnv = (basicEnv = 'node'): unknown => {
         ...DEFAULT_CONFIG,
         launchType: LAUNCH,
       }
-      let resultBrowserConfig: JestPlaywrightConfig = deepMerge(
-        defaultBrowserConfig,
-        config,
-      )
+      let resultBrowserConfig: JestPlaywrightConfig = {
+        ...defaultBrowserConfig,
+        ...config,
+      }
       if (isDebug) {
         if (debugOptions) {
           resultBrowserConfig = deepMerge(resultBrowserConfig, debugOptions)

src/utils.test.ts

@@ -17,6 +17,7 @@ const {
   getBrowserOptions,
   getDeviceBrowserType,
   generateKey,
+  deepMerge,
 } = Utils
 
 beforeEach(() => {
@@ -408,3 +409,72 @@ describe('getPlaywrightInstance', () => {
     )
   })
 })
+
+describe('deepMerge', () => {
+  it('should return deeply merged object', () => {
+    const source = {
+      viewport: { width: 1440, height: 900 },
+      isMobile: false,
+      storageState: {
+        origins: [
+          {
+            origin: 'https://google.com',
+            localStorage: [
+              {
+                name: 'name',
+                value: 'google',
+              },
+            ],
+          },
+        ],
+      },
+    }
+
+    const target = {
+      viewport: { width: 1920, height: 900 },
+      isMobile: false,
+      hasTouch: true,
+      storageState: {
+        origins: [
+          {
+            origin: 'https://bing.com',
+            localStorage: [
+              {
+                name: 'name',
+                value: 'bing',
+              },
+            ],
+          },
+        ],
+      },
+    }
+
+    expect(deepMerge(source, target)).toEqual({
+      viewport: { width: 1920, height: 900 },
+      isMobile: false,
+      hasTouch: true,
+      storageState: {
+        origins: [
+          {
+            origin: 'https://bing.com',
+            localStorage: [
+              {
+                name: 'name',
+                value: 'bing',
+              },
+            ],
+          },
+          {
+            origin: 'https://google.com',
+            localStorage: [
+              {
+                name: 'name',
+                value: 'google',
+              },
+            ],
+          },
+        ],
+      },
+    })
+  })
+})

src/utils.ts

@@ -54,7 +54,9 @@ export const deepMerge = <T extends Record<string, any>>(
   const keys: (keyof T)[] = Object.keys(source)
   if (isObject(target) && isObject(source)) {
     keys.forEach((key) => {
-      if (isObject(source[key])) {
+      if (Array.isArray(source[key]) && Array.isArray(target[key])) {
+        output = { ...output, [key]: [...source[key], ...target[key]] }
+      } else if (isObject(source[key])) {
         if (!(key in target)) {
           output = { ...output, [key]: source[key] }
         } else {
@@ -197,7 +199,7 @@ export const readConfig = async (
   jestEnvConfig?: JestPlaywrightConfig,
 ): Promise<JestPlaywrightConfig> => {
   if (jestEnvConfig) {
-    return deepMerge<JestPlaywrightConfig>(DEFAULT_CONFIG, jestEnvConfig)
+    return { ...DEFAULT_CONFIG, ...jestEnvConfig }
   }
   const { JEST_PLAYWRIGHT_CONFIG, npm_package_type } = process.env
   const fileExtension = npm_package_type === 'module' ? 'cjs' : 'js'
@@ -220,9 +222,9 @@ export const readConfig = async (
   const localConfig = await require(absConfigPath)
   if (typeof localConfig === 'function') {
     const config = await localConfig()
-    return deepMerge<JestPlaywrightConfig>(DEFAULT_CONFIG, config)
+    return { ...DEFAULT_CONFIG, ...config }
   }
-  return deepMerge<JestPlaywrightConfig>(DEFAULT_CONFIG, localConfig)
+  return { ...DEFAULT_CONFIG, ...localConfig }
 }
 
 export const formatError = (error: string): string =>