diff --git a/README.md b/README.md index d0137859..5e8f99f1 100644 --- a/README.md +++ b/README.md @@ -24,9 +24,29 @@ Clone the repository, install dependencies and run the development server locall Preview the application locally on http://localhost:3000/ +#### End-to-end testing + +Before the first run, ensure the browsers Playwright needs are installed: + + node_modules/.bin/playwright install + +Then add the plan identifiers you want to test to your `.env` file: + + TEST_PLAN_IDENTIFIERS=abcd,efgh,ijlk + +Now you should be able to run the test suite. You might want to start the +either the development or production server first. If you don't, the +test suite will start one for you (the dev server will be started if the +`TEST_DEVSERVER` env variable is set). You should be able to run the test +suite like this: + + node_modules/.bin/playwright test + #### Building the custom version of plotly.js -Clone the plotly.js GitHub repository and run the following commands: +If you need to add new plot types, or update to the upstream version of plotly.js, +clone the [plotly.js GitHub repository](https://github.com/plotly/plotly.js) and +run the following commands: npm install npx change-package-name @kausal/plotly-custom @@ -38,7 +58,7 @@ Clone the plotly.js GitHub repository and run the following commands: ## Building and deploying in production -To run the app in production: +To run the app in production mode: yarn install yarn build diff --git a/playwright.config.ts b/playwright.config.ts new file mode 100644 index 00000000..e7f6c9cd --- /dev/null +++ b/playwright.config.ts @@ -0,0 +1,73 @@ +import { defineConfig, devices } from '@playwright/test'; +import dotenv from 'dotenv'; + +dotenv.config(); + +/** + * See https://playwright.dev/docs/test-configuration. + */ +export default defineConfig({ + testDir: './e2e-tests', + /* Run tests in files in parallel */ + fullyParallel: true, + /* Fail the build on CI if you accidentally left test.only in the source code. */ + forbidOnly: !!process.env.CI, + /* Retry on CI only */ + retries: process.env.CI ? 2 : 0, + /* Opt out of parallel tests on CI. */ + workers: process.env.CI ? 1 : undefined, + /* Reporter to use. See https://playwright.dev/docs/test-reporters */ + reporter: 'html', + /* Shared settings for all the projects below. See https://playwright.dev/docs/api/class-testoptions. */ + use: { + /* Base URL to use in actions like `await page.goto('/')`. */ + // baseURL: 'http://127.0.0.1:3000', + + /* Collect trace when retrying the failed test. See https://playwright.dev/docs/trace-viewer */ + trace: 'on-first-retry', + actionTimeout: 2000, + screenshot: 'on', + }, + + /* Configure projects for major browsers */ + projects: [ + { + name: 'chromium', + use: { ...devices['Desktop Chrome'] }, + }, + { + name: 'firefox', + use: { ...devices['Desktop Firefox'] }, + }, + { + name: 'webkit', + use: { ...devices['Desktop Safari'] }, + }, + /* Test against mobile viewports. */ + // { + // name: 'Mobile Chrome', + // use: { ...devices['Pixel 5'] }, + // }, + // { + // name: 'Mobile Safari', + // use: { ...devices['iPhone 12'] }, + // }, + + /* Test against branded browsers. */ + // { + // name: 'Microsoft Edge', + // use: { ...devices['Desktop Edge'], channel: 'msedge' }, + // }, + // { + // name: 'Google Chrome', + // use: { ...devices['Desktop Chrome'], channel: 'chrome' }, + // }, + ], + + /* Run your local dev server before starting the tests */ + webServer: { + command: process.env.TEST_DEVSERVER ? 'yarn dev' : 'yarn start', + url: 'http://localhost:3000', + reuseExistingServer: !process.env.CI, + }, +});