@tramvai/test-pw NPM

Tramvai test Playwright

Set of helpers for using playwright in the integration tests

Playwright should be installed separately

Installation

npm install --save-dev @tramvai/test-pw

Usage

Configuration

Create file playwright.config.ts with defaults from @tramvai/test-pw package:

import { createPlaywrightConfig } from '@tramvai/test-pw';

export default createPlaywrightConfig();

You can always extend default config, here is createPlaywrightConfig type definition:

// passed configuration object will be merged with defaults
type createPlaywrightConfig = (config: PlaywrightTestConfig) => PlaywrightTestConfig;

Testing

:::tip

Use case for this section and startAppFixture - monorepo with many tramvai modules and example applications, where you need to test independent features.

All usage of startAppFixture in different workers will run development build, which might not be optimal for tests execution time, if you want to test the same app in different cases.

For real applications, prefer to run application once as web server or manually and pass baseUrl after.

:::

@tramvai/test-pw provide a useful fixture for application start (local server in development mode) and testing - startAppFixture. This fixture use startCli method from @tramvai/test-integration package.

First, you need to add and configure this fixture for application tests:

import path from 'path';
import { test as base } from '@playwright/test';
import type { StartAppTypes } from '@tramvai/test-pw';
import { startAppFixture } from '@tramvai/test-pw';

type TestFixture = {};

type WorkerFixture = {
  app: StartAppTypes.TestApp;
  appTarget: StartAppTypes.AppTarget;
  startOptions: StartAppTypes.StartOptions;
};

export const test = base.extend<TestFixture, WorkerFixture>({
  appTarget: [
    // provide application name and directory
    {
      target: 'appName',
      cwd: path.resolve(__dirname, '..'),
    },
    { scope: 'worker', auto: true, option: true },
  ],
  // any `startCli` parameters
  startOptions: [{
    env: {
      SOME_MOCKED_API: 'xxx'
    },
  }, { scope: 'worker', auto: true, option: true }],

  app: startAppFixture,
});

Then, use the app object in integration tests:

import { expect } from '@playwright/test';
import { test } from './test-fixture';

test.describe('examples/app', async () => {
  test('Navigation is visible', async ({ app, page }) => {
    await page.goto(app.serverUrl);

    expect(page.getByRole('navigation')).toBeVisible();
  });
});

You can find more info about app object in our Testing Guide

Production build testing

If you need to test production build, @tramvai/test-pw provide a few fixtures for it:

appServerFixture to run compiled application server
buildAppFixture to run production build of the application (will be called implicitly for appServerFixture)

First, configure fixtures:

import path from 'path';
import { test as base } from '@playwright/test';
import type { BuildAppTypes } from '@tramvai/test-pw';
import { appServerFixture } from '@tramvai/test-pw';

type TestFixture = {};

type WorkerFixture = {
  app: BuildAppTypes.TestApp;
  appTarget: BuildAppTypes.AppTarget;
  buildOptions: BuildAppTypes.StartOptions;
};

export const test = base.extend<TestFixture, WorkerFixture>({
  appTarget: [
    // provide application name and directory
    {
      target: 'appName',
      cwd: path.resolve(__dirname, '..'),
    },
    { scope: 'worker', auto: true, option: true },
  ],
  // any `buildCli` parameters
  buildOptions: [{
    env: {
      SOME_MOCKED_API: 'xxx'
    },
  }, { scope: 'worker', auto: true, option: true }],

  appServer: appServerFixture,
});

Then, use the appServer object in integration tests:

import { expect } from '@playwright/test';
import { test } from './test-fixture';

test.describe('examples/app', async () => {
  test('Navigation is visible', async ({ appServer, page }) => {
    await page.goto(`http://localhost:${appServer.port}/`);

    expect(page.getByRole('navigation')).toBeVisible();
  });
});

@tinkoff/utils @tramvai/test-integration @tramvai/tokens-router console-with-style get-port supports-color env-ci execa tslib wait-on

@everything-registry/sub-chunk-930 @tramvai/test-integration-jest

10 days ago

5 days ago

8 days ago

10 days ago

10 days ago

5 days ago

8 days ago

19 days ago

16 days ago

19 days ago

16 days ago

19 days ago

26 days ago

30 days ago

26 days ago

30 days ago

30 days ago

1 month ago

1 month ago

1 month ago

1 month ago

1 month ago

1 month ago

1 month ago

1 month ago

2 months ago

2 months ago

1 month ago

1 month ago

1 month ago

2 months ago

1 month ago

1 month ago

2 months ago

2 months ago

2 months ago

2 months ago

2 months ago

2 months ago

2 months ago

2 months ago

2 months ago

2 months ago

2 months ago

2 months ago

3 months ago

3 months ago

3 months ago

3 months ago

2 months ago

2 months ago

2 months ago

3 months ago

3 months ago

3 months ago

3 months ago

3 months ago

3 months ago

3 months ago

3 months ago

3 months ago

3 months ago

3 months ago

3 months ago

4 months ago

4 months ago

4 months ago

4 months ago

4 months ago

4 months ago

4 months ago

3 months ago

6 months ago

4 months ago

4 months ago

6 months ago

4 months ago

4 months ago

3 months ago

3 months ago

3 months ago

3 months ago

3 months ago

5 months ago

5 months ago

5 months ago

5 months ago

5 months ago

5 months ago

5 months ago

5 months ago

5 months ago

5 months ago

5 months ago

4 months ago

5 months ago

3 months ago

4 months ago

4 months ago

4 months ago

4 months ago

4 months ago

4 months ago

3 months ago

4 months ago

4 months ago

3 months ago

4 months ago

4 months ago

3 months ago

3 months ago

3 months ago

3 months ago

6 months ago

4 months ago

5 months ago

5 months ago

5 months ago

5 months ago

4 months ago

4 months ago

6 months ago

6 months ago

6 months ago

6 months ago

6 months ago

6 months ago

6 months ago

6 months ago

6 months ago

7 months ago

7 months ago

7 months ago

7 months ago

7 months ago

7 months ago

7 months ago

7 months ago

7 months ago

7 months ago

7 months ago

7 months ago

7 months ago

7 months ago

7 months ago

7 months ago

7 months ago

7 months ago

7 months ago

7 months ago

7 months ago

7 months ago

7 months ago

7 months ago

7 months ago

7 months ago

7 months ago

7 months ago

7 months ago

7 months ago

8 months ago

8 months ago

8 months ago

8 months ago

8 months ago

8 months ago

8 months ago

8 months ago

9 months ago

9 months ago

9 months ago

9 months ago

10 months ago

10 months ago

10 months ago

10 months ago

10 months ago

10 months ago

10 months ago

10 months ago

10 months ago

10 months ago

10 months ago

10 months ago

10 months ago

10 months ago

10 months ago

11 months ago

11 months ago

11 months ago

11 months ago

11 months ago

11 months ago

11 months ago

11 months ago

12 months ago

12 months ago

12 months ago

12 months ago

12 months ago

12 months ago

12 months ago

12 months ago

12 months ago

12 months ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

12 months ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

12 months ago

12 months ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

12 months ago

12 months ago

1 year ago

1 year ago

1 year ago

1 year ago

12 months ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

12 months ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

1 year ago

1 year ago

1 year ago

2 years ago

1 year ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago