Post/Code

HomeAboutUsesNow

Cypress Cheat Sheet.

Here is some quick and easy Cypress to get you going:

  • The following will grab the an input, enter the text "my text goes here" into the input and then check whether the input's value prop is set to the same text:
cy.get("input")
.type("my text goes here")
.should("have.value", "my text goes here");
  • The following will get the input with the attribute "placeholder" and check for the text "Search":
cy.get("input")
.invoke("attr", "placholder")
.should("contain", "Search");
  • The following will get the first anchor tag on the page, click on it and then check that the url it navigates to containts "/yoururl":

    cy.get("a")
    .first()
    .click()
    .url()
    .should("include", "/yoururl");
    
  • The following grabs the h1 tag and checks for the text "My heading" within it: cy.get("h1").contains("My heading");

  • The following grabs the div with the classname "your-special-classname" and checks for the text "Your spectial text..." within it: cy.get("div.your-special-classname").contains("Your spectial text...");
  • The following will find the 2nd select element and "select" the option with the text "Option 3":

    cy.get("select")
    .eq(1)
    .select("Option 3");
    

To be continued...