Modern Front-End Development for Rails

Testing the Schedule Filter

Let’s write more examples in Cypress that at least partially cover the rest of the features we’ve written in Stimulus and React. Here’s a longer series of tests that deals with the calendar filter at the top of the schedule page. The behavior we’re checking here is to confirm that clicking on a calendar item makes only concerts with that date visible and that clicking back to a state of no clicks makes everything visible again. Here’s the code:

chapter_16/02/cypress/integration/schedule/schedule_spec.js

describe("calendar filters", () => {
  beforeEach(() => {
    cy.visit("/")
    cy.get("#calendar-day-2021-04-11").first().as("dayOne")
    cy.get("#calendar-day-2021-04-12").first().as("dayTwo")
 cy. ...