diff --git a/packages-internal/test-utils/src/createMount.tsx b/packages-internal/test-utils/src/createMount.tsx deleted file mode 100644 index f690f03a7bb327..00000000000000 --- a/packages-internal/test-utils/src/createMount.tsx +++ /dev/null @@ -1,136 +0,0 @@ -/* eslint-env mocha */ -import * as React from 'react'; -import * as ReactDOM from 'react-dom'; -import * as ReactDOMTestUtils from 'react-dom/test-utils'; -import { Test, Suite } from 'mocha'; -import { mount as enzymeMount, MountRendererProps } from 'enzyme'; - -interface ModeProps { - /** - * this is essentially children. However, we can't use children because then - * using `wrapper.setProps({ children })` would work differently if this component - * would be the root. - */ - __element: React.ReactElement; - __strict: boolean; -} - -/** - * Can't just mount {node} - * because that swallows wrapper.setProps - * - * why class component: - * https://github.com/airbnb/enzyme/issues/2043 - */ -// eslint-disable-next-line react/prefer-stateless-function -class Mode extends React.Component { - render() { - // Excess props will come from e.g. enzyme setProps - // eslint-disable-next-line @typescript-eslint/naming-convention - const { __element, __strict, ...other } = this.props; - const Component = __strict ? React.StrictMode : React.Fragment; - - return {React.cloneElement(__element, other)}; - } -} - -interface CreateMountOptions extends MountRendererProps { - mount?: typeof enzymeMount; - strict?: boolean; -} -// Generate an enhanced mount function. -export default function createMount(options: CreateMountOptions = {}) { - const { mount = enzymeMount, strict: globalStrict = true, ...globalEnzymeOptions } = options; - - let container: HTMLElement | null = null; - - function computeTestName(test: Test | undefined) { - let current: Test | Suite | undefined = test; - const titles: string[] = []; - while (current != null) { - titles.push(current.title); - current = current.parent; - } - - return titles.filter(Boolean).reverse().join(' -> '); - } - - // save stack to re-use in test-hooks - const { stack: createMountStack } = new Error(); - - /** - * Flag whether `createMount` was called in a suite i.e. describe() block. - * For legacy reasons `createMount` might accidentally be called in a before(Each) hook. - */ - let wasCalledInSuite = false; - before(() => { - wasCalledInSuite = true; - }); - - beforeEach(() => { - if (!wasCalledInSuite) { - const error = new Error( - 'Unable to run `before` hook for `createMount`. This usually indicates that `createMount` was called in a `before` hook instead of in a `describe()` block.', - ); - error.stack = createMountStack; - throw error; - } - }); - - beforeEach(function beforeEachMountTest() { - container = document.createElement('div'); - container.setAttribute('data-test', computeTestName(this.currentTest)); - document.body.insertBefore(container, document.body.firstChild); - }); - - afterEach(() => { - ReactDOMTestUtils.act(() => { - // eslint-disable-next-line react/no-deprecated - ReactDOM.unmountComponentAtNode(container!); - }); - container!.parentElement!.removeChild(container!); - container = null; - }); - - const mountWithContext = function mountWithContext( - node: React.ReactElement, - localOptions: Omit = {}, - ) { - const { strict = globalStrict, ...localEnzymeOptions } = localOptions; - - if (container === null) { - throw new Error( - `Tried to mount without setup. Mounting inside before() is not allowed. Try mounting in beforeEach or better: in each test`, - ); - } - ReactDOMTestUtils.act(() => { - // eslint-disable-next-line react/no-deprecated - ReactDOM.unmountComponentAtNode(container!); - }); - - // some tests require that no other components are in the tree - // for example when doing .instance(), .state() etc. - const wrapper = mount( - strict == null ? node : , - { - attachTo: container, - ...globalEnzymeOptions, - ...localEnzymeOptions, - }, - ); - const originalUnmount = wrapper.unmount; - - wrapper.unmount = () => { - // flush effect cleanup functions - ReactDOMTestUtils.act(() => { - originalUnmount.call(wrapper); - }); - - return wrapper; - }; - - return wrapper; - }; - - return mountWithContext; -} diff --git a/packages-internal/test-utils/src/findOutermostIntrinsic.test.js b/packages-internal/test-utils/src/findOutermostIntrinsic.test.js deleted file mode 100644 index f5d9b21e4c6cb6..00000000000000 --- a/packages-internal/test-utils/src/findOutermostIntrinsic.test.js +++ /dev/null @@ -1,68 +0,0 @@ -import * as React from 'react'; -import { expect } from 'chai'; -import createMount from './createMount'; -import findOutermostIntrinsic from './findOutermostIntrinsic'; - -describe('findOutermostIntrinsic', () => { - const mount = createMount({ strict: null }); - const expectIntrinsic = (node, expected) => { - const wrapper = mount(node); - const outermostIntrinsic = findOutermostIntrinsic(wrapper); - - if (expected === null) { - expect(outermostIntrinsic.exists()).to.equal(false); - } else { - expect(outermostIntrinsic.type()).to.equal(expected); - expect(outermostIntrinsic.type()).to.equal( - outermostIntrinsic.getDOMNode().nodeName.toLowerCase(), - ); - } - }; - const Headless = ({ children }) => children; - - it('returns immediate DOM nodes', () => { - expectIntrinsic(
Hello, World!
, 'div'); - }); - - it('only returns the outermost', () => { - expectIntrinsic( - -
Hello, World!
-
, - 'span', - ); - }); - - it('ignores components', () => { - expectIntrinsic( - -
Hello, World!
-
, - 'div', - ); - expectIntrinsic( - - -
Hello, World!
-
-
, - 'div', - ); - expectIntrinsic( - - -
- - Hello, World! - -
-
-
, - 'div', - ); - }); - - it('can handle that no DOM node is rendered', () => { - expectIntrinsic({false && }, null); - }); -}); diff --git a/packages-internal/test-utils/src/findOutermostIntrinsic.ts b/packages-internal/test-utils/src/findOutermostIntrinsic.ts deleted file mode 100644 index ed1c1372d9bd39..00000000000000 --- a/packages-internal/test-utils/src/findOutermostIntrinsic.ts +++ /dev/null @@ -1,19 +0,0 @@ -import { ReactWrapper } from 'enzyme'; - -/** - * checks if a given react wrapper wraps an intrinsic element i.e. a DOM node - * @param {import('enzyme').ReactWrapper} reactWrapper - * @returns {boolean} true if the given reactWrapper wraps an intrinsic element - */ -export function wrapsIntrinsicElement(reactWrapper: ReactWrapper): boolean { - return typeof reactWrapper.type() === 'string'; -} - -/** - * like ReactWrapper#getDOMNode() but returns a ReactWrapper - * @param {import('enzyme').ReactWrapper} reactWrapper - * @returns {import('enzyme').ReactWrapper} the wrapper for the outermost DOM node - */ -export default function findOutermostIntrinsic(reactWrapper: ReactWrapper): ReactWrapper { - return reactWrapper.findWhere((n) => n.exists() && wrapsIntrinsicElement(n)).first(); -} diff --git a/packages-internal/test-utils/src/index.ts b/packages-internal/test-utils/src/index.ts index 6f0e1527448056..e80fc539833170 100644 --- a/packages-internal/test-utils/src/index.ts +++ b/packages-internal/test-utils/src/index.ts @@ -5,8 +5,6 @@ export { default as describeConformance } from './describeConformance'; export * from './describeConformance'; export { default as createDescribe } from './createDescribe'; export * from './createRenderer'; -export { default as createMount } from './createMount'; -export { default as findOutermostIntrinsic, wrapsIntrinsicElement } from './findOutermostIntrinsic'; export { default as focusVisible, simulatePointerDevice, diff --git a/packages/mui-base/src/Badge/Badge.test.tsx b/packages/mui-base/src/Badge/Badge.test.tsx index 57a1e60771a831..2d81bc5290296d 100644 --- a/packages/mui-base/src/Badge/Badge.test.tsx +++ b/packages/mui-base/src/Badge/Badge.test.tsx @@ -1,11 +1,10 @@ import * as React from 'react'; -import { createRenderer, createMount } from '@mui/internal-test-utils'; +import { createRenderer } from '@mui/internal-test-utils'; import { Badge, badgeClasses as classes } from '@mui/base/Badge'; import { describeConformanceUnstyled } from '../../test/describeConformanceUnstyled'; describe('', () => { const { render } = createRenderer(); - const mount = createMount(); describeConformanceUnstyled( @@ -15,7 +14,6 @@ describe('', () => { classes, inheritComponent: 'span', render, - mount, refInstanceof: window.HTMLSpanElement, testComponentPropWith: 'div', slots: { diff --git a/packages/mui-base/src/Button/Button.test.tsx b/packages/mui-base/src/Button/Button.test.tsx index 5c47b422cf2c4b..95a89a1d7d7d08 100644 --- a/packages/mui-base/src/Button/Button.test.tsx +++ b/packages/mui-base/src/Button/Button.test.tsx @@ -1,18 +1,16 @@ import * as React from 'react'; -import { act, createMount, createRenderer, fireEvent } from '@mui/internal-test-utils'; +import { act, createRenderer, fireEvent } from '@mui/internal-test-utils'; import { expect } from 'chai'; import { spy } from 'sinon'; import { Button, buttonClasses } from '@mui/base/Button'; import { describeConformanceUnstyled } from '../../test/describeConformanceUnstyled'; describe('