Skip to content

Commit

Permalink
move tests into ui submodule
Browse files Browse the repository at this point in the history
  • Loading branch information
stephenkilbourn committed Feb 17, 2024
1 parent 62151da commit 258e7fc
Show file tree
Hide file tree
Showing 20 changed files with 313 additions and 500 deletions.
19 changes: 3 additions & 16 deletions e2e/README.md
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
# Playwright E2E Testing

This testing suite is for End to End testing the VEDA website via the UI using Playwright. It works by serving a local version of the site using yarn serve and performing UI checks against that locally hosted site. The suite is designed to generate a `playwrightTestData.json` that contains the list of all Catalog and Story names. This is done by parsing the `name` field in the `*.mdx` files of the `/datasets` and `/stories` directories.
The veda-config can be tested end-to-end to by leveraging a suite of Playwright tests located in the veda-ui git submodule. It works by serving a local version of the site using yarn serve and performing UI checks against that locally hosted site. The suite is designed to generate a `playwrightTestData.json` that contains the list of all Catalog and Story names. This is done by parsing the `name` field in the `*.mdx` files of the `/datasets` and `/stories` directories of the config repo.

## Running the test suite

Expand All @@ -11,25 +11,12 @@ The test suite can be run via the `yarn test:e2e` script. There is a `prtest:e2e
The end to end tests are organized in the `/e2e` directory. The tests have been written following a [Page Object Model](https://martinfowler.com/bliki/PageObject.html) pattern.
Supporting files within the repo are in the following structure:

```text
/e2e
│─── README.md
│─── playwright.config.ts - imports our global setup, defines preferred browsers, & number of retries
│─── generateTestData.js - parses mdx files and creates a json based on their metadata
└─── /pages
│ └─── basePage.ts - imports all seeded data and PageObjects into our `test` object.
│ │
│ └─── [PAGENAME]Page.ts - The page objects. UI elements interacted with on a page are defined once to keep tests DRY and minimize test changes if layout changes.
└─── tests - our actual tests
```

## Updating Tests

If the layout of a page changes, then the tests may no longer be able to interact with locators. These locators are defined in the Page Objects defined in `/e2e/pages`. The Playwright framework provides multiple ways to choose elements to interact with. The recomended ones are defined in the [Playwright documentation](https://playwright.dev/docs/locators#quick-guide).
If the layout of a page changes, then the tests may no longer be able to interact with locators. These locators are defined in the Page Objects defined in `/e2e/pages`. The Playwright framework provides multiple ways to choose elements to interact with. The recommended ones are defined in the [Playwright documentation](https://playwright.dev/docs/locators#quick-guide).

Any new pages will need to have new page objects created and then imported into the `basePage.ts` file following th format of existing pages. This allows all tests to reference the page.

## Output

Playwright will generate an html report with test results. This report will show all tests that were run, and will allow a user to view the results of any failed tests.
Playwright will generate an html report with test results. This report will show all tests that were run, and will allow a user to view the results of any failed tests. This report can be viewed with the script `yarn report` from the config repo.
10 changes: 7 additions & 3 deletions e2e/generateTestData.js
Original file line number Diff line number Diff line change
Expand Up @@ -6,11 +6,14 @@ const fg = require('fast-glob');
const catalogPaths = fg.globSync('**/datasets/*.mdx');
const storyPaths = fg.globSync('**/stories/*.mdx');
const catalogNames = [];
const datasetIds = [];
const storyNames = [];

for (const catalog of catalogPaths) {
const catalogData = matter.read(catalog).data;
catalogNames.push(catalogData['name']);
datasetIds.push(catalogData['id']);

}

for (const story of storyPaths) {
Expand All @@ -19,11 +22,12 @@ for (const story of storyPaths) {
}

const testDataJson = {
"catalogs": catalogNames,
"stories": storyNames
catalogs: catalogNames,
datasetIds: datasetIds,
stories: storyNames
}

fs.writeFile(path.join(__dirname, 'playwrightTestData.json'), JSON.stringify(testDataJson), err => {
fs.writeFile(path.join(__dirname, '../.veda/ui/e2e/playwrightTestData.json'), JSON.stringify(testDataJson), err => {
if (err) {
console.error(err);
} else {
Expand Down
11 changes: 0 additions & 11 deletions e2e/pages/aboutPage.ts

This file was deleted.

55 changes: 0 additions & 55 deletions e2e/pages/analysisPage.ts

This file was deleted.

13 changes: 0 additions & 13 deletions e2e/pages/analysisResultsPage.ts

This file was deleted.

52 changes: 0 additions & 52 deletions e2e/pages/basePage.ts

This file was deleted.

14 changes: 0 additions & 14 deletions e2e/pages/catalogPage.ts

This file was deleted.

18 changes: 0 additions & 18 deletions e2e/pages/datasetPage.ts

This file was deleted.

13 changes: 0 additions & 13 deletions e2e/pages/footerComponent.ts

This file was deleted.

23 changes: 0 additions & 23 deletions e2e/pages/headerComponent.ts

This file was deleted.

14 changes: 0 additions & 14 deletions e2e/pages/homePage.ts

This file was deleted.

14 changes: 0 additions & 14 deletions e2e/pages/storyPage.ts

This file was deleted.

44 changes: 0 additions & 44 deletions e2e/tests/analysis.spec.ts

This file was deleted.

27 changes: 0 additions & 27 deletions e2e/tests/catalog.spec.ts

This file was deleted.

Loading

0 comments on commit 258e7fc

Please sign in to comment.