Types of testing

• static checks - via TypeScript, linters, jsdoc, etc
• unit tests - ensure smallest parts of application work as intended
• integration tests - widgets, forms, etc work correctly
• e2e tests - check app as if a user, from auth till checkout

Types of testing

it is a blurry line between types of tests,
often you will not be able to distinguish integration vs e2e test

Mocking

• Unit tests
  • everything except for this particular function or class is mocked
  • in practice, it is too tedious to mock everything
• Integration tests
  • input data is mocked
• E2E
  • ideally, nothing is mocked
  • in practice it is more convenient to mock some things (e.g. Feature Toggles, language, timezone, third-party providers)

E2E tests

A helper robot that behaves like a user to click around the app and verify that it functions correctly.

Cypress.io

describe('My First Test', () => {
  it('clicking "type" navigates to a new url', () => {
    cy.visit('https://example.cypress.io');

    cy.contains('type').click();

    // Should be on a new URL which includes '/commands/actions'
    cy.url().should('include', '/commands/actions');
  });
});

• Arrange - prepare UI you want to test
• Act - interact with your UI
• Assert - check that UI correctly behaves after actions

AAA

• Load login page <- Arrange
• Type 'umbrella' to "password" input <- Act
• Check that user sees a "Weak password" message <- Assert

AAA

describe('Authorization', () => {

    it('should encourage more protected passwords', () => {
        cy.visit('/login'); // <- Arrange

        cy.get('[name="password"]').type('umbrella'); // <- Act

        cy.contains('Weak password'); // <- Assert
    });
});

Not too many?

Rule of diminishing returns

• the first test gives confidence your app does not crash
• first couple of test scenarios will make sure happy flows work
• all the edge cases are hard to come up with and cover in advance

Code coverage

is just a starting point and a helper tool, not a goal

Not too many?

=============================== Coverage summary ===============================
Statements   : 96.23% ( 919/955 )
Branches     : 87.75% ( 308/351 )
Functions    : 93.71% ( 268/286 )
Lines        : 96.16% ( 877/912 )
================================================================================

Not too many?

A highly unlikely error, writing test for it isn't hard, but just not necessary