Qubika Home Task

E2E test suite for the Qubika Home Task playwright as framework

Service under testing

We are testing the page https://club-administration.qa.qubika.com/

First Time Setup

Requirements

Install NVM. Then use NVM to get the supported Node version:

nvm use

Install Dependencies

npm i

Running Tests

To run the tests you could run locally or with docker. I have set the headless mode as false for testing purposes if you run locally.

Running Locally

Config file

You will find a file playwright.config.ts to run tests.

import { defineConfig, devices } from '@playwright/test';

/**
 * See https://playwright.dev/docs/test-configuration.
 */
export default defineConfig({
    /* Fail the build on CI if you accidentally left test.only in the source code. */
    forbidOnly: !!process.env.CI,
    /* Run tests in files in parallel */
    fullyParallel: true,
    /* Configure projects for major browsers */
    projects: [
        {
            name: 'chromium',
            use: {
                bypassCSP: true,
                launchOptions: {
                    // Put your chromium-specific args here
                    args: ['--disable-web-security'],
                },
            },
        },
    ],
    /* Reporter to use. See https://playwright.dev/docs/test-reporters */
    reporter: 'html',
    /* Retry on CI only */
    retries: process.env.CI ? 2 : 0,
    /* Shared settings for all the projects below. See https://playwright.dev/docs/api/class-testoptions. */
    testDir: './tests',
    use: {
        /* Base URL to use in actions like `await page.goto('/')`. */
        baseURL: 'https://club-administration.qa.qubika.com/',

        /* Collect trace when retrying the failed test. See https://playwright.dev/docs/trace-viewer */
        trace: 'on-first-retry',
    },
    /* Opt out of parallel tests on CI. */
    workers: process.env.CI ? 1 : undefined,
});

Playwright Install:

Before running the tests the first time you should run the following command to install browsers and dependencies of playwright

npx playwright install
npx playwright install-deps

Playwright Run:

npx playwright test

Playwright Run / Interactive Mode:

npx playwright test --ui

Runnig with Docker

Build Docker Image

You can build a docker image to run the tests having only docker running locally

docker build . -t qubikahometask

Run Docker Image

You can build a docker image to run the tests having only docker running locally

docker run qubikahometask

Repository Structure

Tests folder

There is a tests folder which contains the different test cases. In this particular case there is a category.spec.ts file. This file contains the test cases covering the requirement

Page Objects folder

To avoid code duplication I am using POM pattern. This pattern allow us to reuse common locators and functions. In this particular case I added a login-page.ts category-page.ts file. Thess files contain common locators and functions to cover the required escenarios.

Docs folder

This folder contains the files automatically generated by the post commit command to add some documentation.

Hooks

I have added precommit, postcommit and prepush hooks to control the code before pushing. These hooks are checking linter(eslint and tsconfig checks) and docs generation.