search

CDC-HIS / openmrs-esm-ethiohri

A custom microfrontend for Ethiopia's integration into OHRI
Other
2 stars 12 forks source link

Setup E2E tests with Playwright #51

Closed jayasanka-sack closed 1 year ago

jayasanka-sack commented 1 year ago

Summary

This PR aims to ensure that end-to-end tests be run automatically as part of pull requests or individual commits. This will provide a more streamlined and efficient testing process, allowing tests to be run automatically as part of the development workflow.

▶️ Watch Demo!

Running tests

Once everything is set up,

# Run all e2e tests on chromium in headed mode:
yarn test-e2e --headed

To run a specific test by title:

yarn test-e2e --headed -g "title of the test"

Check this documentation for more running options.

Writing New Tests

In general, it is recommended to read through the official Playwright docs before writing new test cases. The project uses the official Playwright test runner and, generally, follows a very simple project structure:

e2e
|__ commands
|   ^ Contains "commands" (simple reusable functions) that can be used in test cases/specs.
|__ core
|   ^ Contains code related to the test runner itself, e.g. setting up the custom fixtures.
|     You probably need to touch this infrequently.
|__ fixtures
|   ^ Contains fixtures (https://playwright.dev/docs/test-fixtures) which are used
|     to run reusable setup/teardown tasks
|__ pages
|   ^ Contains page object model classes for interacting with the front end.
|     See https://playwright.dev/docs/test-pom for details.
|__ specs
|   ^ Contains the actual test cases/specs. New tests should be placed in this folder.
|__ support
    ^ Contains support files that requires to run e2e tests, e.g. docker compose files.

When you want to write a new test case, start by creating a new spec in ./specs. Depending on what you want to achieve, you might want to create new fixtures and/or page object models. To see examples, have a look at the existing code to see how these different concepts play together.

Github Action integration

The e2e.yml workflow is made up of two jobs: one for running on pull requests (PRs) and one for running on commits.

  1. When running on PRs, the workflow will start the dev server, use dev3.openmrs.org as the backend, and run tests only on chromium. This is done in order to quickly provide feedback to the developer. The tests are designed to generate their own data and clean up after themselves once they are finished. This ensures that the tests will have minimum effect from changes made to dev3 by other developers. In the future, we plan to use a docker container to run the tests in an isolated environment once we figure out a way to spin up the container within a small amount of time.
  2. When running on commits, the workflow will spin up a docker container and run the dev server against it in order to provide a known and isolated environment. (The compose file should be updated once the ethiohri image is ready)

Open reports from GitHub Actions

To download the report from the GitHub action/Bamboo plan, follow these steps:

  1. Go to the artifact section of the action/plan and locate the report file.
  2. Download the report file and unzip it using a tool of your choice.
  3. Open the index.html file in a web browser to view the report.

The report will show you a full summary of your tests, including information on which tests passed, failed, were skipped, or were flaky. You can filter the report by browser and explore the details of individual tests, including any errors or failures, video recordings, and the steps involved in each test. Simply click on a test to view its details.

Sample runs:

  1. On PR
  2. On commit

Debugging Tests

Refer to this documentation on how to debug a test.

jayasanka-sack commented 1 year ago

@larslemos @samuelmale could you please review this?

samuelmale commented 1 year ago

@jayasanka-sack seems the dev3 server is rejecting traffic from our test server. Assuming this is an issue why not consider using https://ethiohri-dev.globalhealthapp.net/ ?

jayasanka-sack commented 1 year ago

Thanks for reviewing the PR @ebambo and @samuelmale. The Github action was failing due to wrong sources path provided in the workflow file. Fixed with 834ab3a.

P.S. AFAIK this repo is using https://ethiohri-dev.globalhealthapp.net/ as the backend by default.