chore(ci): new pipeline

.github/workflows/prune.yml

@@ -0,0 +1,24 @@
+name: Prune
+on:
+  schedule:
+    # At 00:00 on day-of-month 1 in every month from January through December.
+    # Generated with: https://crontab.guru/#0_0_1_1-12_*
+    - cron:  '0 0 1 1-12 *'
+jobs:
+  prune:
+    name: Prune
+    runs-on: ubuntu-latest
+    steps:
+      - name: Setup node.js
+        uses: actions/setup-node@v2-beta
+        with:
+          node-version: 14
+      - name: Cache pnpm store
+        uses: actions/cache@v2
+        with:
+          path: ~/.pnpm-store
+          key: pnpm-store
+      - name: Install pnpm
+        run: curl -L https://raw.githubusercontent.com/pnpm/self-installer/master/install.js | node
+      - name: Remove unreferenced dependencies
+        run : pnpm store prune

.github/workflows/release.yml

@@ -5,67 +5,173 @@ on:
       - master
       - next
 jobs:
-  tests:
-    name: Tests
+  # @see https://medium.com/attest-engineering/adding-a-unique-github-build-identifier-7aa2e83cadca
+  build_id:
+    name: Build Id
+    runs-on: ubuntu-latest
+    steps:
+      - name: Create build id
+        id: build_id
+        run: echo "::set-output name=id::$(date +%s)"
+      - name: Cache build id
+        uses: actions/cache@v2
+        with:
+          path: ${{ github.workspace }}/.build-id
+          key: ${{ runner.os }}-build-id-${{ github.head_ref }}-${{ github.sha }}-${{ steps.build_id.outputs.id }}
+      - name: Store build id
+        run: |
+          mkdir -p .build-id 
+          echo $BUILD_ID > .build-id/id
+        env:
+          BUILD_ID: ${{ steps.build_id.outputs.id }}
+  build:
+    name: Build
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v2
+      - name: Setup node.js
+        uses: actions/setup-node@v2-beta
+        with:
+          node-version: 14
+      - name: Cache pnpm store
+        uses: actions/cache@v2
+        with:
+          path: ~/.pnpm-store
+          key: pnpm-store
+      - name: Cache cypress binary
+        uses: actions/cache@v2
+        with:
+          path: ~/.cache
+          key: cypress-binary
+      - name: Cache packages
+        uses: actions/cache@v2
+        with:
+          path: packages
+          key: packages-${{ github.run_id }}
+      - name: Install pnpm
+        run: curl -L https://raw.githubusercontent.com/pnpm/self-installer/master/install.js | node
+      - name: Install dependencies
+        run: pnpm install --filter @vime/core
+      - name: Build 
+        run: pnpm run build --filter @vime/core
+  test_unit:
+    name: Unit Tests
+    needs: [build_id, build]
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v2
+      - name: Setup node.js
+        uses: actions/setup-node@v2-beta
+        with:
+          node-version: 14
+      - name: Restore packages
+        uses: actions/cache@v2
+        with:
+          path: packages
+          key: packages-${{ github.run_id }}
+      - name: Run unit tests
+        run: npm run test:unit.coverage --prefix packages/core
+      - name: Upload coverage report
+        uses: actions/upload-artifact@v2
+        with:
+          name: cov-report-unit
+          path: packages/core/jest-coverage
+  test_e2e:
+    name: E2E Tests
+    needs: [build_id, build]
     runs-on: ubuntu-latest
     strategy:
       fail-fast: false
       matrix:
-        containers: [1, 2, 3]
+        containers: [1, 2, 3, 4, 5]
     steps:
       - name: Checkout
-        uses: actions/checkout@v1
+        uses: actions/checkout@v2
+      - name: Restore build id from cache
+        uses: actions/cache@v2
+        with:
+          path: ${{ github.workspace }}/.build-id
+          key: ${{ runner.os }}-build-id-${{ github.head_ref }}-${{ github.sha }}
+      - name: Set build id
+        id: build_id
+        run: echo "::set-output name=id::$(cat .build-id/id)"
       - name: Setup node.js
-        uses: actions/setup-node@v1
+        uses: actions/setup-node@v2-beta
         with:
           node-version: 14
-      - name: Change directory to `@vime/core`
-        run: cd packages/core
-      - name: Install dependencies
-        uses: cypress-io/github-action@v2
+      - name: Restore packages
+        uses: actions/cache@v2
         with:
-          runTests: false
-      - name: Run unit tests
-        run: npm run test:unit.coverage
-      - name: Prepare for e2e tests
-        run: npm run coverage:e2e.prepare
+          path: packages
+          key: packages-${{ github.run_id }}
       - name: Run e2e tests
-        uses: cypress-io/github-action@v2
-        with:
-          install: false
-          start: npm run serve:public
-          wait-on: 'http://localhost:3334'
-          browser: chrome
-          headless: true
-          record: true
-          parallel: true
-          group: 'GitHub Actions'
+        run:  npm run test:e2e.ci --prefix packages/core
         env:
-          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+          BUILD_ID: '${{ github.sha }}-${{ github.workflow }}-${{ github.event_name }}'
           CYPRESS_RECORD_KEY: ${{ secrets.CYPRESS_RECORD_KEY }}
-      - name: Build coverage report
-        run: npm run coverage:combine && npx codecov
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+      - name: Upload coverage report
+        uses: actions/upload-artifact@v2
+        with:
+          name: cov-report-e2e-${{ matrix.containers }}
+          path: packages/core/cypress-coverage
+  coverage:
+    name: Coverage Report
+    needs: [test_unit, test_e2e]
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v2
+      - name: Setup node.js
+        uses: actions/setup-node@v2-beta
+        with:
+          node-version: 14
+      - name: Restore packages
+        uses: actions/cache@v2
+        with:
+          path: packages
+          key: packages-${{ github.run_id }}
+      - name: Download coverage reports
+        uses: actions/download-artifact@v2
+        with:
+          path: packages/core
+      - name: Combine reports
+        run: npm run coverage:combine --prefix packages/core
+      - name: Upload report to codecov
+        run: cd packages/core && npx codecov 
         env:
           CODECOV_TOKEN: ${{ secrets.CODECOV_TOKEN }}
   release:
     name: Release
-    needs: tests
+    needs: [test_unit, test_e2e]
     runs-on: ubuntu-latest
     steps:
       - name: Checkout
-        uses: actions/checkout@v1
+        uses: actions/checkout@v2
       - name: Setup node.js
-        uses: actions/setup-node@v1
+        uses: actions/setup-node@v2-beta
         with:
           node-version: 14
+      - name: Restore pnpm store
+        uses: actions/cache@v2
+        with:
+          path: ~/.pnpm-store
+          key: pnpm-store
+      - name: Restore cypress binary
+        uses: actions/cache@v2
+        with:
+          path: ~/.cache
+          key: cypress-binary
       - name: Install pnpm
         run: curl -L https://raw.githubusercontent.com/pnpm/self-installer/master/install.js | node
       - name: Install dependencies
         run: pnpm install --filter ./packages
       - name: Build packages
-        run: pnpm run build --filter vime
+        run: npm run build
       - name: Release packages
-        run: pnpm run release --filter vime
+        run: npm run release
         env:
           GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
           NPM_TOKEN: ${{ secrets.NPM_TOKEN }}

packages/core/cypress.json

@@ -6,8 +6,6 @@
   "testFiles": "**/*.e2e.ts",
   "fixturesFolder": false,
   "supportsFolder": "cypress/support/index.ts",
-  "video": false,
-  "screenshotOnRunFailure": false,
   "ignoreTestFiles": [
     "**/__snapshots__/*",
     "**/__image_snapshots__/*"

packages/core/cypress/tests/providers/harness.ts

@@ -113,28 +113,28 @@ export const runTestHarness = (provider: MediaProvider) => {
       // @TODO test flaky in CI with Vimeo/Dailymotion for some unknown reason.
       if ((provider !== MediaProvider.Vimeo) && (provider !== MediaProvider.Dailymotion)) {
         cy.player()
-        .should(() => {
-          expect(events.vPlay).to.have.been.called;
-          // Files are loaded too fast on the dev server so they don't always buffer.
-          if (!mediaFileProvider.has(provider)) {
-            expect(events.vBufferingChange)
-              .to.have.been.calledWith(true)
-              .and.to.have.been.calledWith(false);
-          }
-        })
-        .and(() => {
+          .should(() => {
+            expect(events.vPlay).to.have.been.called;
+            // Files are loaded too fast on the dev server so they don't always buffer.
+            if (!mediaFileProvider.has(provider)) {
+              expect(events.vBufferingChange)
+                .to.have.been.calledWith(true)
+                .and.to.have.been.calledWith(false);
+            }
+          })
+          .and(() => {
           // order => [paused=false] -> play -> buffering -> playing -> currentTime
-          expect(events.vPausedChange)
-            .to.be.calledBefore(events.vPlay);
-          expect(events.vPlay)
-            .to.be.calledBefore(events.vBufferingChange);
-          if (!mediaFileProvider.has(provider)) {
-            expect(events.vBufferingChange)
-              .to.be.calledBefore(events.vPlayingChange);
-          }
-          expect(events.vPlayingChange)
-            .to.be.calledBefore(events.vCurrentTimeChange);
-        });
+            expect(events.vPausedChange)
+              .to.be.calledBefore(events.vPlay);
+            expect(events.vPlay)
+              .to.be.calledBefore(events.vBufferingChange);
+            if (!mediaFileProvider.has(provider)) {
+              expect(events.vBufferingChange)
+                .to.be.calledBefore(events.vPlayingChange);
+            }
+            expect(events.vPlayingChange)
+              .to.be.calledBefore(events.vCurrentTimeChange);
+          });
       }
     });
 

packages/core/cypress/tests/ui/video.e2e.ts

@@ -1,5 +1,3 @@
-// @ts-ignore
-import { skipOn } from '@cypress/skip-test';
 import { en } from '../../../src/components/core/player/lang/en';
 
 before(() => {
@@ -15,15 +13,13 @@ after(() => {
 
 afterEach(() => {
   cy.pause();
+  cy.player().type('{esc}');
   cy.wait(50);
 });
 
-// @TODO why wont this pass in CI??
-skipOn('headless', () => {
-  it('should load video ui', () => {
-    cy.wait(2000);
-    cy.player().toMatchImageSnapshot();
-  });
+it('should load video ui', () => {
+  cy.wait(500);
+  cy.player().toMatchImageSnapshot();
 });
 
 it('should toggle playback when clicking player', () => {

packages/core/package.json

@@ -31,30 +31,31 @@
     "build": "stencil build --docs && npm run build:themes",
     "build:post": "node scripts/post-build.js",
     "build:themes": "rimraf themes/* && npm run min:theme.default && npm run min:theme.light",
+    "coverage:instrument": "nyc instrument dist --in-place",
     "coverage:combine": "nyc report --reporter lcov --reporter text --report-dir coverage",
-    "coverage:e2e.prepare": "rimraf .nyc_output && npm run build && npm run coverage:e2e.instrument",
-    "coverage:e2e.instrument": "nyc instrument dist --in-place",
     "generate": "stencil generate",
     "generate:provider": "node scripts/new-provider.js",
     "min:theme.default": "cleancss -o themes/default.css src/globals/themes/default.css",
     "min:theme.light": "cleancss -o themes/light.css src/globals/themes/light.css",
     "serve": "concurrently \"npm run serve:public\" \"npm run serve:dev\"",
     "serve:dev": "stencil build --dev --watch --serve --port 3336",
     "serve:public": "node scripts/link-public.js && sirv public --single tests/index.html --cors --port 3334 --quiet",
-    "serve:prod": "npm run build && npm run serve:public",
+    "serve:prod": "npm run serve:public",
     "test:unit": "stencil test --spec --max-workers=2",
     "test:unit.debug": "pnpx --node-arg=\"--inspect-brk\" stencil test --spec",
     "test:unit.watch": "stencil test --spec --watchAll --max-workers=2",
     "test:unit.coverage": "npm run test:unit --coverage",
-    "test:e2e": "start-server-and-test serve:public http://localhost:3334 cy:run",
-    "test:e2e.ui": "npm run build && start-server-and-test serve:public http://localhost:3334 cy:run.ui",
-    "test:e2e.providers": "npm run build && start-server-and-test serve:public http://localhost:3334 cy:run.providers",
-    "test:e2e.coverage": "npm run coverage:e2e.prepare && npm run test:e2e",
+    "test:e2e": "npm run build && start-server-and-test serve:prod http://localhost:3334 cy:run",
+    "test:e2e.ui": "npm run build && start-server-and-test serve:prod http://localhost:3334 cy:run.ui",
+    "test:e2e.providers": "npm run build && start-server-and-test serve:prod http://localhost:3334 cy:run.providers",
+    "test:e2e.ci": "npm run test:e2e.ci.prepare && start-server-and-test serve:prod http://localhost:3334 cy:run.ci",
+    "test:e2e.ci.prepare": "rimraf .nyc_output && npm run build && npm run coverage:instrument",
     "release": "semantic-release -e ../../scripts/semantic-release",
     "cy:open": "cypress open",
     "cy:run": "cypress run",
     "cy:run.ui": "cypress run --spec \"cypress/tests/ui/**/*\"",
-    "cy:run.providers": "cypress run --spec \"cypress/tests/providers/**/*\""
+    "cy:run.providers": "cypress run --spec \"cypress/tests/providers/**/*\"",
+    "cy:run.ci": "cypress run --record --group @vime/core --browser chrome --headless --parallel --ci-build-id $BUILD_ID"
   },
   "dependencies": {
     "stencil-wormhole": "^3.2.1"
@@ -91,6 +92,7 @@
     "start-server-and-test": "^1.11.3",
     "svelte": "^3.24.1",
     "ts-loader": "^8.0.3",
+    "typescript": "^4.0.2",
     "webpack": "^4.44.1"
   },
   "publishConfig": {