Lesson Outline

Final Touches

Before we wrap up this module, let's do one last pass to improve the styling a bit before sending this iteration off to the client. From browsing around the application there are a few things that stand out as needing obvious attention.

Again, we're missing some back navigations for the following pages:

• client-survey
• client-survey-detail

We will add in some E2E tests to deal with those, and then there are various places that could do with some style improvements, such as:

• View responses button on client-detail page
• The link itself on the client-detail page
• The client-survey page needs some styling

Project management

Remember to create a new issue for these tasks and create a new task branch.

Let's start with the E2E test for the back navigations - we will add this one to the client-detail.cy.ts file:

  it('can navigate back to the client detail page from the view response detail page', () => {
    getViewSurveyResponsesButton().click();
    getSurveyResponseList().first().click();

    getViewSurveyResponseDetailBackButton().click();
    getViewSurveyResponsesBackButton().click();

    getNameDisplay().should('contain.text', testClient.name.first);
  });

Let's check that it fails: