React API
Methods
mount
// React 18
import { mount } from 'cypress/react18'
// React 16, 17
import { mount } from 'cypress/react'
| Description | Used for mounting React components in isolation. It is responsible for rendering the component within Cypress's sandboxed iframe and handling any framework-specific cleanup. |
| Signature | mount(jsx: React.ReactNode, options?: MountOptions, rerenderKey?: string): Cypress.Chainable<MountReturn> |
| Returns | Cypress.Chainable<MountReturn> |
Parameters
| Description | The component to mount in test |
| Type | React.ReactNode |
| Description | The options for mounting the component |
| Type | MountOptions (optional) |
| Default | undefined |
| Description | .. |
| Type | string (optional) |
| Default | undefined |
unmount
| Description | Used for unmounting previously mounted React components. |
| Signature | unmount(options?: UnmountArgs): Cypress.Chainable<undefined>; |
| Returns | Cypress.Chainable<undefined> |
Parameters
| Description | The options to pass into unmount |
| Type | UnmountArgs (optional) |
| Default | undefined |
Interfaces
MountOptions
Union of StyleOptions & MountReactComponentOptions
MountReactComponentOptions
| Description | |
| Type | string (optional) |
| Default | undefined |
| Description | |
| Type | MountReactComponentOptions.ReactDom (optional) |
| Default | undefined |
| Description | Log the mounting command into Cypress Command Log, true by default |
| Type | boolean (optional) |
| Default | true |
| Description | Render component in React strict mode It activates additional checks and warnings for child components. |
| Type | boolean (optional) |
| Default | false |
MountReturn
| Description | The component that was rendered |
| Type | React.ReactNode |
| Description | Rerenders the specified component with new props. This allows testing of components that store state (`setState`) or have asynchronous updates (`useEffect`, `useLayoutEffect`). |
| Type | (component: React.ReactNode) => Cypress.Chainable<MountReturn> |
| Description | Removes the mounted component. |
| Type | (payload: UnmountArgs) => void; |
StyleOptions
| Description | Creates <style>...</style> element and inserts given CSS. |
| Type | string (optional) | string[] (optional) |
| Default | undefined |
| Description | Creates <style>...</style> element and inserts given CSS. |
| Type | string (optional) | string[] (optional) |
| Default | undefined |
| Description | Creates <link href="..." /> element for each stylesheet |
| Type | string (optional) | string[] (optional) |
| Default | undefined |
UnmountArgs
| Description | |
| Type | boolean |
| Description | |
| Type | string (optional) |
| Default | undefined |