Component Testing (+ React 18) Mount via JSX

ct-open-by-jsx.tsx

import ReactDOM from 'react-dom/client'

import { mount } from '@cypress/react'

import { ReactNode } from 'react'

export const open = (jsx: ReactNode) => {
	let myRoot: ReactDOM.Root
	mount(<div />, {
		ReactDom: {
			// @ts-ignore ignore return type
			render: (_: any, rootEl: Element | null) => {
				const root = ReactDOM.createRoot(rootEl!)
				myRoot = root
				root.render(jsx)
			},
			unmountComponentAtNode: () => {
				// NOTE: Clear client-store & localStorage here to prevent side-effect to next testing
				myRoot.unmount()
				return true
			},
		},
	})
}

On test file

import { open } from './ct-open-by-url'
describe('Home', () => {
	it('Simple', () => {
		open(<Component />)
	})
})

pkg:

react: 18.1.0
@cypress/react: 5.12.4