E-commerce with Cypress

// Each line uses a different kind of selector on purpose — the comments name them.
describe('Nova Shop', () => {
  beforeEach(() => {
    cy.visit('/shop');
    cy.get('#username').type('demo_user');                      // id
    cy.get('input[name="password"]').type('Demo@123');          // tag + attribute
    cy.contains('button', 'Sign in').click();                   // tag + text
    cy.location('pathname').should('eq', '/shop/products');
  });

  it('buys headphones with a coupon', () => {
    cy.get('[placeholder="Search products…"]').type('headphones');   // placeholder
    cy.getByTestId('product-card').should('have.length', 1);         // data-testid (custom command)
    cy.contains('[data-testid="product-card"]', 'Aurora Wireless Headphones')
      .find('button').click();                                       // scoped: the button inside one card
    cy.getByTestId('cart-badge').should('have.text', '1');

    cy.get('a[aria-label^="Cart with"]').click();               // attribute starts-with
    cy.get('[aria-label="Coupon code"]').type('SAVE10');        // aria-label
    cy.contains('button', 'Apply').click();
    cy.getByTestId('discount').should('contain', '$13.00');

    cy.contains('a', 'Checkout').click();
    cy.get('#first-name').type('Ada');
    cy.get('[name="last-name"]').type('Lovelace');
    cy.get('input[type="email"]').type('ada@example.com');      // input type
    cy.get('#phone').type('5551234567');
    cy.contains('label', 'Street address').parent().find('input').type('1 Analytical Way');   // via its label
    cy.get('#city').type('Austin');
    cy.get('select#state').select('Texas');
    cy.get('[name="zip"]').type('73301');
    cy.get('#card-name').type('Ada Lovelace');
    cy.get('[placeholder="4242 4242 4242 4242"]').type('4242424242424242');
    cy.get('[placeholder="MM/YY"]').type('1230');
    cy.get('#card-cvv').type('123');
    cy.contains('label', 'I agree to the terms').find('input[type="checkbox"]').check();
    cy.contains('button', 'Place order').click();

    // Commands retry until the ~2s "processing" finishes.
    cy.contains('h1', 'Thank you for your order!').should('be.visible');
    cy.getByTestId('order-id').invoke('text').should('match', /^NS-\d+$/);
  });

  it('sorts by price, low to high', () => {
    cy.get('select[aria-label="Sort by"]').select('price-asc');
    cy.getByTestId('product-price').then(($prices) => {
      const prices = [...$prices].map((el) => Number(el.innerText.replace('$', '')));
      expect(prices).to.deep.equal([...prices].sort((a, b) => a - b));
    });
  });
});