GH-84 - Some initial e2e tests

[bosschaert]

Description

Use Playwright to create an initial set of E2E tests.

This PR contributes the setup for Playwright which is in the e2e_test subdirectory.
Tests can be run from the root using npm run test:e2e or using the various npm run test:... scripts in the e2e_test directory.
Normally the tests are run on Chrome, Firefox and Webkit.

This PR contributes 3 tests:

• A simple test that just obtains the home page and checks that some text on it appears
• A test that updates a document and then loads it in a different browser window to check that the updates were persisted
• A test that creates a new document and then deletes it

This is only the start of the E2E test suite. Hopefully many more test cases will follow.

Related Issue

Contributes to #84

Motivation and Context

E2E tests are important to ensure product quality.

How Has This Been Tested?

It is a test 😉

Types of changes

• Bug fix (non-breaking change which fixes an issue)
• New feature (non-breaking change which adds functionality)
• Breaking change (fix or feature that would cause existing functionality to change)

Checklist:

• I have signed the Adobe Open Source CLA.
• My code follows the code style of this project.
• My change requires a change to the documentation.
• I have updated the documentation accordingly.
• I have read the CONTRIBUTING document.
• I have added tests to cover my changes.
• All new and existing tests passed - see note.

[aem-code-sync]

Hello, I'm the AEM Code Sync Bot and I will run some actions to deploy your branch and validate page speed.
In case there are problems, just click a checkbox below to rerun the respective action.

• Re-run PSI checks
• Re-sync branch

Commits

• b32b329 ✅ (latest)
• a22d5e2 ✅
• 55f371c ✅
• d59bab8 ✅
• 18a51d5 ✅
• 7706ce5 ✅
• 0eaaea1 ✅
• ffaa0b2 ✅
• b050606 ✅
• c4b4440 ✅
• bf457ed ✅
• 09f9e14 ✅
• b9863db ✅

[bosschaert]

Note that one of the tests fails on webkit. This is because the checkbox widget is not tab-selectable there. I left the test failure in there for now as this might be something we really want to fix?

[bosschaert]

I've limited the runs to be on Chromium and Firefox for now until the checkbox selection issue on Webkit is fixed. That way the playwright tests pass.

[auniverseaway]

What do you think about...

test
  ut
  e2e

Not sure if ut is a good name, but it would be nice to not take up a top level folder. Seems like all tests could live in the same folder.

[bosschaert]

What do you think about...

test
  ut
  e2e

Not sure if ut is a good name, but it would be nice to not take up a top level folder. Seems like all tests could live in the same folder.

Good point, I relocated the tests now as follows (so used unit for the unit tests):

test
  unit
  e2e

[bosschaert]

@auniverseaway I think I addressed your concerns, let me know if you need any further changes.

[auniverseaway]

One last small thing I'd recommend changing (but not required).

[auniverseaway]

I don't think I have a strong opinion on this, but it's an interesting observation:

Having another package.json in a sub-folder puts us squarely in monorepo territory. We know Playwright is a bit heavy from an npm package perspective, so this makes a ton of sense... if you do npm install on the root, you only get what you absolutely need. It's worth calling out that this is an outlier right now since WTR is not in a separate package. I can see someone preferring a consistent strategy for package.json...

package.json (linting, app dependencies, etc.)
  test
    unit
      package.json (Web Test Runner)
    e2e
      package.json (Playwright)

CC @chrischrischris