refactor: Update test environments and lint configuration (#1736)

* Update test environments and lint configuration

Update Jest (unit + integration) and Playwright (e2e) test environments. Includes stability improvements for e2e tests using newer, more stable methods per the Playwright docs.

- Update Jest 26 => 27
- Update Jest-related libs (babel parser)
- Update Playwright 1.8 => Playwright Test 1.18
- Update GitHub CI (action versions, job parallelization, and matrices)
- Update ESLint 5 => 8
- Update ESLint-related libs (parser, prettier, Jest, Playwright)
- Fix test failures on M1-based Macs
- Fix e2e stability issues by replacing PW $ method calls
- Fix ESLint errors
- Fix incorrect CI flag on Jest runs (-ci => --ci)
- Refactor e2e test runner from Jest to Playwright Test
- Refactor e2e test files for Playwright Test
- Refactor fix-lint script name to lint:fix for consistency
- Refactor npm scripts order for readability
- Remove unnecessary configs and libs
- Remove example image snapshots

.github/workflows/lint.yml

@@ -1,30 +0,0 @@
-name: Lint
-
-on:
-  push:
-    branches:
-      - master
-      - develop
-  pull_request:
-    branches:
-      - master
-      - develop
-
-jobs:
-  build:
-    runs-on: ubuntu-latest
-    strategy:
-      fail-fast: false
-      matrix:
-        node-version: [12.x, 14.x]
-
-    steps:
-      - uses: actions/checkout@v2
-      - name: Use Node.js ${{ matrix.node-version }}
-        uses: actions/setup-node@v1
-        with:
-          node-version: ${{ matrix.node-version }}
-      - name: Install
-        run: npm i --ignore-scripts
-      - name: Lint
-        run: npm run lint

.github/workflows/test.yml

@@ -2,41 +2,78 @@ name: Build & Test
 
 on:
   push:
-    branches:
-      - master
-      - develop
+    branches: [master, develop]
   pull_request:
-    branches:
-      - master
-      - develop
+    branches: [master, develop]
 
 jobs:
-  build:
+  lint:
+    runs-on: ubuntu-latest
+    strategy:
+      matrix:
+        node-version: ['lts/*']
+    steps:
+      - uses: actions/checkout@v2
+      - name: Setup Node.js ${{ matrix.node-version }}
+        uses: actions/setup-node@v2
+        with:
+          node-version: ${{ matrix.node-version }}
+          cache: 'npm'
+      - name: Install dependencies
+        run: npm ci --ignore-scripts
+      - name: Build
+        run: npm run build
+      - name: Lint
+        run: npm run lint
+
+  test-jest:
     runs-on: ${{ matrix.os }}
     strategy:
       fail-fast: false
       matrix:
-        node-version: [12.x, 14.x]
+        node-version: ['lts/*']
         os: ['macos-latest', 'ubuntu-latest', 'windows-latest']
-
     steps:
       - uses: actions/checkout@v2
-      - name: Use Node.js ${{ matrix.node-version }}
-        uses: actions/setup-node@v1
+      - name: Setup Node.js ${{ matrix.node-version }}
+        uses: actions/setup-node@v2
         with:
           node-version: ${{ matrix.node-version }}
-      - name: bootstrap
-        run: npm run bootstrap
-      - name: unit tests
-        run: npm run test:unit -- -ci --runInBand
-      - name: integration tests
-        run: npm run test:integration -- -ci --runInBand
-      - uses: microsoft/playwright-github-action@v1
-      - name: e2e tests
-        run: npm run test:e2e -- --ci --runInBand
-      - name: Upload artifacts (diff output)
+          cache: 'npm'
+      - name: Install dependencies
+        run: npm ci --ignore-scripts
+      - name: Build
+        run: npm run build
+      - name: Unit Tests
+        run: npm run test:unit -- --ci --runInBand
+      - name: Integration Tests
+        run: npm run test:integration -- --ci --runInBand
+
+  test-playwright:
+    runs-on: ubuntu-latest
+    strategy:
+      matrix:
+        node-version: ['lts/*']
+    steps:
+      - uses: actions/checkout@v2
+      - name: Setup Node.js ${{ matrix.node-version }}
+        uses: actions/setup-node@v2
+        with:
+          node-version: ${{ matrix.node-version }}
+          cache: 'npm'
+      - name: Install dependencies
+        run: npm ci --ignore-scripts
+      - name: Build
+        run: npm run build
+      - name: Install Playwright
+        run: npx playwright install --with-deps
+      - name: E2E Tests (Playwright)
+        run: npm run test:e2e
+      - name: Store artifacts
         uses: actions/upload-artifact@v2
         if: failure()
         with:
-          name: ${{ matrix.os }}-${{ matrix.node-version }}-diff-output
-          path: ${{ github.workspace }}/test/**/__diff_output__/*
+          name: ${{ matrix.os }}-${{ matrix.node-version }}-artifacts
+          path: |
+            _playwright-results/
+            _playwright-report/