Appsemble End 2 End Tests
Run end 2 end tests on an Appsemble environment and provide Appsemble fixtures
Table of Contents
How to install
You can install the package by running the following at the root of your project:
npm install @appsemble/e2e
Usage
To use the fixtures in your tests, you can import expect or test at the top of the file.
These fixtures can be added to any test by specifying them in the test declaration. Matchers don't need to be manually added.
import { expect, test } from '@appsemble/e2e';
test('should navigate to app', async ({ visitApp }) => {
await visitApp('Example app');
await expect(page.getByText('Example app')).toBeVisible();
});
Development
This package depends on other packages in the Appsemble monorepo. To make sure all tests run normally, go to each Appsemble dependency and run the following command:
npm run prepack
Appsemble end-to-end tests
To run end to end tests, run:
npm run e2e
The tests use Playwright.
After each test a video will be saved in the packages/e2e/test-results/{name-test} directory for
further inspection.
On the first retry of a failed job, its trace will be uploaded to the same directory. This trace can
be viewed locally, or it can be uploaded to the
online trace viewer. This shows you step-by-step what happened
during the test as if you ran it using ui mode.
The end to end tests use the following environment variables:
CI— Whether the tests are run in CI.CI_MERGE_REQUEST_IID— The id of the merge request if it's present.APPSEMBLE_REVIEW_DOMAIN— The review appsemble domain to use.APPSEMBLE_STAGING_DOMAIN— The staging appsemble domain to use.
Check the baseURL setting in the playwright.config.ts file to see how the environment variables
are used.
Authentication
Some fixtures call the Appsemble API using the Playwright request object. This expects the worker
to have logged in and set the access token in the request fixture beforehand. This can look like
so:
export const test = base.extend<object>({
async request({}, use) {
const newRequest = await request.newContext({
extraHTTPHeaders: {
Authorization: `Bearer ${accessToken}`,
},
});
await use(newRequest);
await newRequest.dispose();
},
});
Resource lifecycle tracking
Resources created using createTestResource are tracked and automatically deleted at the end of the
test by default.
Set trackBrowserResources to true to also track resources created by browser POST requests:
test.use({ trackBrowserResources: true });
Set autoCleanupResources to false to preserve all tracked resources after the test. This can be
useful when inspecting resources created by a failed test.
test.use({ autoCleanupResources: false });
Note: Only resources created by browser
POSTrequests and resources created using thecreateTestResourceare tracked. Resources created using other methods like webhooks do not get tracked.
Contributing
When writing end-to-end tests, have a look at the best practices to help you write solid tests.