Remove Element

Watch this recipe in the video Remove The Found Element (opens new window).

<div id="make">
  Honda Civic
  <span class="picked">(3 out of 4)</span>
</div>

Honda Civic (3 out of 4)

.picked {
  font-size: smaller;
  font-weight: lighter;
}

To remove the span.picked from the page, we can use the jQuery remove (opens new window) method. Cypress querying commands yield jQuery objects, thus we can use cy.invoke (opens new window) to call the remove method immediately.

cy.get('.picked').invoke('remove')
// confirm the element was removed
// by checking the parent's element text
// Note: cannot use "have.text" assertion
// since the HTML element has newlines and other
// whitespace characters
cy.get('#make')
  .invoke('text')
  .invoke('trim')
  .should('equal', 'Honda Civic')