cy.mount should remove the last mounted component if called multiple times in same test

[ZachJW34]

Current behavior

Scenario:

it('calls mount twice', () => {
  cy.mount(MyApp)
  cy.mount(MyApp)
})

Framework dependent behavior:

• Angular: Throws error upon second mount
• Vue: Mounts multiple components
• Svelte: Mounts multiple components
• React: Removes and remounts
• Vue2: Mounts multiple components

Desired behavior

The last component mounted should be removed from the DOM/cleaned up.

Test code to reproduce

import HelloWorld from "./components/HelloWorld.vue";

it("default", () => {
  cy.mount(HelloWorld, { props: { msg: "Component 1" } });
  cy.mount(HelloWorld, { props: { msg: "Component 2" } });
  cy.mount(HelloWorld, { props: { msg: "Component 3" } });
});

Cypress Version

10.10.0

Node version

v16.17.1

Operating System

macOS 12.4

Debug Logs

No response

Other

No response

[baus]

Hey team! Please add your planning poker estimate with Zenhub @amehta265 @astone123 @lmiller1990 @marktnoonan @mike-plummer @rockindahizzy @warrensplayer @ZachJW34

[cypress-bot]

The code for this is done in cypress-io/cypress#24470, but has yet to be released.
We'll update this issue and reference the changelog when it's released.

[cypress-bot]

Released in 11.0.0.

This comment thread has been locked. If you are still experiencing this issue after upgrading to
Cypress v11.0.0, please open a new issue.