remove old testkit (#240)

* remove old testkit * remove old testkit * remove old testkit * remove old testkit
wix-incubator · Oct 30, 2023 · 53d5985 · 53d5985
1 parent daf1cd9
commit 53d5985
Show file tree

Hide file tree

Showing 14 changed files with 63 additions and 903 deletions.
diff --git a/docs/3rd-party-licenses.md b/docs/3rd-party-licenses.md
@@ -9,7 +9,6 @@ Repluggable uses these awesome languages, libraries, and tools:
 - [react-redux](https://github.com/reduxjs/react-redux) - [license](https://github.com/reduxjs/react-redux/blob/master/LICENSE.md)
 - [redux-devtools-extension](https://github.com/zalmoxisus/redux-devtools-extension) - [license](https://github.com/zalmoxisus/redux-devtools-extension/blob/master/LICENSE)
 - [jest](https://github.com/facebook/jest) - [license](https://github.com/facebook/jest/blob/master/LICENSE)
-- [enzyme](https://github.com/enzymejs/enzyme) - [license](https://github.com/enzymejs/enzyme/blob/master/LICENSE.md)
 - [react-test-renderer](https://github.com/facebook/react/tree/main/packages/react-test-renderer) - [license](https://github.com/facebook/react/blob/master/LICENSE)
 - [WebPack](https://github.com/webpack/webpack) - [license](https://github.com/webpack/webpack/blob/master/LICENSE)
 - [husky](https://github.com/typicode/husky) - [license](https://github.com/typicode/husky/blob/master/LICENSE)

diff --git a/package.json b/package.json
@@ -37,15 +37,13 @@
     "redux-devtools-extension": "^2.13.8"
   },
   "devDependencies": {
-    "@types/enzyme": "^3.10.7",
     "@types/jest": "^26.0.15",
     "@types/lodash": "^4.14.162",
     "@types/react": "^18.0.0",
     "@types/react-dom": "^18.0.0",
     "@types/react-test-renderer": "^18.0.0",
     "@types/webpack-env": "^1.15.3",
     "case-sensitive-paths-webpack-plugin": "^2.3.0",
-    "enzyme": "^3.11.0",
     "husky": "^4.3.0",
     "jest": "^26.6.0",
     "jest-teamcity-reporter": "^0.9.0",

diff --git a/test/appHost.spec.ts b/test/appHost.spec.ts
@@ -23,7 +23,7 @@ import {
     mockShellStateKey,
     addMockShell,
     emptyLoggerOptions
-} from '../testKit/v2'
+} from '../testKit'
 
 import { AppHostAPI, AppHostServicesEntryPointName, AppHostServicesProvider } from '../src/appHostServices'
 import { createCircularEntryPoints, createDirectCircularEntryPoints } from './appHost.mock'

diff --git a/test/connectWithShell.spec.tsx b/test/connectWithShell.spec.tsx
@@ -13,7 +13,7 @@ import {
     withThrowOnError,
     TOGGLE_MOCK_VALUE,
     collectAllTexts
-} from '../testKit/v2'
+} from '../testKit'
 import { ReactTestRenderer, act, create } from 'react-test-renderer'
 import { AnyAction } from 'redux'
 import { ObservedSelectorsMap, observeWithShell } from '../src'

diff --git a/test/customExtensionSlot.spec.ts b/test/customExtensionSlot.spec.ts
@@ -1,6 +1,6 @@
 import _ from 'lodash'
 import { EntryPoint, SlotKey, Shell, CustomExtensionSlot, CustomExtensionSlotHandler, ExtensionItem } from '../src'
-import { createAppHost, addMockShell } from '../testKit/v2'
+import { createAppHost, addMockShell } from '../testKit'
 
 interface TestItem {
     value: string

diff --git a/test/errorBoundary.spec.tsx b/test/errorBoundary.spec.tsx
@@ -1,6 +1,6 @@
 import _ from 'lodash'
 import React from 'react'
-import { createAppHost, addMockShell, renderInHost, withConsoleErrors } from '../testKit/v2'
+import { createAppHost, addMockShell, renderInHost, withConsoleErrors } from '../testKit'
 import { ErrorBoundary } from '../src'
 import { act } from 'react-test-renderer'
 

diff --git a/test/extensionSlot.spec.ts b/test/extensionSlot.spec.ts
@@ -1,5 +1,5 @@
 import { SlotKey } from '../src'
-import { addMockShell, createAppHost } from '../testKit/v2'
+import { addMockShell, createAppHost } from '../testKit'
 import { PrivateExtensionSlot, Shell, EntryPoint } from '../src/API'
 
 describe('ExtensionSlot', () => {

diff --git a/test/interceptEntryPoints.spec.ts b/test/interceptEntryPoints.spec.ts
@@ -1,7 +1,7 @@
 import _ from 'lodash'
 import { EntryPoint, EntryPointInterceptor } from '../src/API'
 import { interceptEntryPoints, interceptEntryPointsMap } from '../src/interceptEntryPoints'
-import { createAppHost } from '../testKit/v2'
+import { createAppHost } from '../testKit'
 
 type LogSpy = jest.Mock<void, string[]>
 

diff --git a/test/renderSlotComponents.spec.tsx b/test/renderSlotComponents.spec.tsx
@@ -1,7 +1,7 @@
 import _ from 'lodash'
 import React, { FunctionComponent, PropsWithChildren } from 'react'
 import { SlotKey, ReactComponentContributor, Shell } from '../src/API'
-import { createAppHost, addMockShell, renderInHost, connectWithShell, SlotRenderer } from '../testKit/v2'
+import { createAppHost, addMockShell, renderInHost, connectWithShell, SlotRenderer } from '../testKit'
 import { Provider } from 'react-redux'
 import { AnyAction, createStore } from 'redux'
 import { act, create, ReactTestRenderer } from 'react-test-renderer'

diff --git a/test/testKit.spec.tsx b/test/testKit.spec.tsx
@@ -13,7 +13,7 @@ import {
     dependsOnMockPackageEntryPoint,
     MockPublicAPI,
     createAppHostAndWaitForLoading
-} from '../testKit/v2'
+} from '../testKit'
 
 interface APIKeys {
     [name: string]: AnyExtensionSlot

diff --git a/testKit/index.tsx b/testKit/index.tsx
@@ -1,12 +1,14 @@
-import { mount, ReactWrapper } from 'enzyme'
+import { create, act, ReactTestRenderer, ReactTestInstance, TestRendererOptions } from 'react-test-renderer'
 import _ from 'lodash'
 import React, { ReactElement } from 'react'
+import { createRoot } from 'react-dom/client'
 import { EntryPoint, ObservableState, PrivateShell, ShellBoundaryAspect } from '../src/API'
 import { AnySlotKey, AppHost, AppMainView, createAppHost as _createAppHost, EntryPointOrPackage, Shell, SlotKey } from '../src/index'
 import { ShellRenderer } from '../src/renderSlotComponents'
 import { createShellLogger } from '../src/loggers'
 import { emptyLoggerOptions } from './emptyLoggerOptions'
 
+export { emptyLoggerOptions }
 export { AppHost } from '../src/index'
 export { connectWithShell, connectWithShellAndObserve } from '../src/connectWithShell'
 export { SlotRenderer } from '../src/renderSlotComponents'
@@ -56,7 +58,7 @@ export const getPackagesDependencies = (
         loadedEntryPoints.add(currEntryPoint.name)
         packagesList.push(currEntryPoint)
         const dependencies = currEntryPoint.getDependencyAPIs ? currEntryPoint.getDependencyAPIs() : []
-        const dependencyEntryPoints = dependencies.map(API => apiToEntryPoint.get(API.name))
+        const dependencyEntryPoints = dependencies.map((API: AnySlotKey) => apiToEntryPoint.get(API.name))
         entryPointsQueue.push(..._.compact(dependencyEntryPoints))
     }
 
@@ -116,31 +118,53 @@ export async function createAppHostAndWaitForLoading(packages: EntryPointOrPacka
     return Promise.race([timeoutPromise, loadingPromise]).then(() => appHost)
 }
 
-export type RenderHostType = (host: AppHost) => { root: ReactWrapper | null; DOMNode: HTMLElement | null }
-export const renderHost: RenderHostType = (host: AppHost) => {
-    const root = mount(<AppMainView host={host} />) as ReactWrapper
-    return { root, DOMNode: root && (root.getDOMNode() as HTMLElement) }
+export const renderHost = (host: AppHost): ReactTestRenderer => {
+    let renderer: ReactTestRenderer | undefined
+    act(() => {
+        renderer = create(<AppMainView host={host} />)
+    })
+
+    return renderer as unknown as ReactTestRenderer
 }
 
 export interface WrappedComponent {
-    root: ReactWrapper | null
-    parentWrapper: ReactWrapper | null
-    DOMNode: HTMLElement | null
+    testKit: ReturnType<typeof create>
     host: AppHost
+    parentWrapper: ReactTestInstance | undefined
+}
+
+export const renderDOMInHost = (reactElement: ReactElement<any>, host: AppHost = createAppHost([]), customShell?: Shell) => {
+    const shell = customShell || createShell(host)
+
+    const Component = (
+        <ShellRenderer host={host} shell={shell as PrivateShell} component={<div data-shell-in-host="true">{reactElement}</div>} key="" />
+    )
+
+    const container = document.body.querySelector('div')
+    const root = container && createRoot(container)
+    root?.render(Component)
 }
 
-export const renderInHost = (reactElement: ReactElement<any>, host: AppHost = createAppHost([]), customShell?: Shell): WrappedComponent => {
+export const renderInHost = (
+    reactElement: ReactElement<any>,
+    host: AppHost = createAppHost([]),
+    customShell?: Shell,
+    options?: TestRendererOptions
+): WrappedComponent => {
     const shell = customShell || createShell(host)
 
-    const root = mount(
+    const Component = (
         <ShellRenderer host={host} shell={shell as PrivateShell} component={<div data-shell-in-host="true">{reactElement}</div>} key="" />
     )
+    let root: ReactTestRenderer | undefined
+    act(() => {
+        root = create(Component, options)
+    })
 
-    const parentWrapper = root.find('[data-shell-in-host="true"]')
+    const parentWrapper = root?.root.find(x => x.props['data-shell-in-host'])
 
     return {
-        root,
-        DOMNode: parentWrapper.children().first().getDOMNode() as HTMLElement,
+        testKit: root as unknown as ReactTestRenderer,
         parentWrapper,
         host
     }
@@ -158,7 +182,7 @@ export const addMockShell = (host: AppHost, entryPointOverrides: EntryPointOverr
         {
             name: _.uniqueId('__MOCK_SHELL_'),
             ...entryPointOverrides,
-            attach(_shell) {
+            attach(_shell: Shell) {
                 shell = _shell
                 if (entryPointOverrides.attach) {
                     entryPointOverrides.attach(_shell)
@@ -176,10 +200,10 @@ export const addMockShell = (host: AppHost, entryPointOverrides: EntryPointOverr
                 return false
             }
         }
-        const missing = dependencies.filter(key => !canGetAPI(key))
+        const missing = dependencies.filter((key: AnySlotKey) => !canGetAPI(key))
         throw new Error(
             `addMockShell: overridden entry point is not ready (missing dependency APIs?) host could not find: ${missing.map(
-                v => `"${v.name}"`
+                (v: AnySlotKey) => `"${v.name}"`
             )}`
         )
     }
@@ -234,7 +258,7 @@ function createShell(host: AppHost): PrivateShell {
         clearCache: _.noop,
         getHostOptions: () => host.options,
         log: createShellLogger(host, entryPoint),
-        wrapWithShellRenderer: component => component
+        wrapWithShellRenderer: (component: JSX.Element) => component
     }
 }
 
@@ -248,3 +272,9 @@ export function mockObservable<T>(value: T): ObservableState<T> {
         }
     }
 }
+
+export function collectAllTexts(instance: ReactTestInstance | undefined) {
+    return (instance
+        ?.findAll(x => x.children?.some(child => typeof child === 'string'))
+        .flatMap(x => x.children.filter(child => typeof child === 'string')) || []) as string[]
+}