chore(ci): browser-specific cypress test

Test on multiple browsers (chromium, firefox, edge),
and at the same time only use a stable NodeJS version.

- needed to explicitly set media source duration to 0 in order to force
  lower latency on firefox, should not affect other browsers
- run cypress jobs in a custom docker images that has the proper browser
  and version bundled already (not: these do not include the actual
  cypress binary).
  cfr: https://github.com/cypress-io/cypress-docker-images
- when running job scripts in a container (and not directly on a host)
  the port mapping isn't necessary, but instead the services can be
  reached by using the service name as hostname. That means we need to
  use that in the TCP component instead of looking at hostname in the
  RTSP URI (otherwise we cannot use the same setup for testing on
  localhost)

.github/workflows/verify.yml

@@ -12,22 +12,84 @@ on:
       - main
 
 jobs:
-  verify:
+  node:
     runs-on: ubuntu-latest
     strategy:
       matrix:
         node-version: ['14', '15']
+    steps:
+      - uses: actions/checkout@v1
+      - name: Setup node
+        uses: actions/setup-node@v1
+        with:
+          node-version: ${{ matrix.node-version }}
+      - name: Install dependencies
+        run: yarn install --immutable --immutable-cache
+      - name: Linting & Unit testing
+        run: |
+          yarn lint
+          yarn test
+      - name: Build
+        run: yarn build
+
+  chrome:
+    runs-on: ubuntu-latest
+    container: cypress/browsers:node14.16.0-chrome89-ff86
     services:
-      rtsp:
+      gstreamer:
         image: steabert/gst-rtsp-launch
-        ports:
-          - 8554:8554
     steps:
       - uses: actions/checkout@v1
       - name: Setup node
         uses: actions/setup-node@v1
         with:
-          node-version: ${{ matrix.node-version }}
+          node-version: '14'
+      - name: Install dependencies
+        run: yarn install --immutable --immutable-cache
+      - name: Linting & Unit testing
+        run: |
+          yarn lint
+          yarn test
+      - name: Build
+        run: yarn build
+      - name: Test basic video functionality
+        run: sbin/test.sh chrome
+
+  firefox:
+    runs-on: ubuntu-latest
+    container: cypress/browsers:node14.16.0-chrome89-ff86
+    services:
+      gstreamer:
+        image: steabert/gst-rtsp-launch
+    steps:
+      - uses: actions/checkout@v1
+      - name: Setup node
+        uses: actions/setup-node@v1
+        with:
+          node-version: '14'
+      - name: Install dependencies
+        run: yarn install --immutable --immutable-cache
+      - name: Linting & Unit testing
+        run: |
+          yarn lint
+          yarn test
+      - name: Build
+        run: yarn build
+      - name: Test basic video functionality
+        run: sbin/test.sh firefox
+
+  edge:
+    runs-on: ubuntu-latest
+    container: cypress/browsers:node14.10.1-edge88
+    services:
+      gstreamer:
+        image: steabert/gst-rtsp-launch
+    steps:
+      - uses: actions/checkout@v1
+      - name: Setup node
+        uses: actions/setup-node@v1
+        with:
+          node-version: '14'
       - name: Install dependencies
         run: yarn install --immutable --immutable-cache
       - name: Linting & Unit testing
@@ -37,4 +99,4 @@ jobs:
       - name: Build
         run: yarn build
       - name: Test basic video functionality
-        run: sbin/test.sh
+        run: sbin/test.sh edge

examples/browser/test/h264-player.js

@@ -13,6 +13,11 @@ const play = (host) => {
   pipeline.ready.then(() => {
     pipeline.rtsp.play()
   })
+  pipeline.onSourceOpen = (mse) => {
+    // Setting a duration of zero seems to force lower latency
+    // on Firefox, and doesn't seem to affect Chromium.
+    mse.duration = 0
+  }
 }
 
 play(window.location.hostname)

sbin/test.sh

@@ -4,7 +4,7 @@ set -e
 #trap "kill 0" EXIT
 
 echo -n "Starting RTSP WebSocket proxy..."
-yarn node sbin/tcp-ws-proxy.js >& tcp-ws-proxy.log &
+yarn node sbin/tcp-ws-proxy.js --rtspHost gstreamer:8554 >& tcp-ws-proxy.log &
 echo "done."
 
 echo -n "Starting HTTP server with examples..."
@@ -14,7 +14,7 @@ echo "done."
 echo -n "Waiting for RTSP server at 8554..."
 START_TIME=$(date +%s%3N)
 duration=0
-until curl -i rtsp://localhost:8554 -s | grep -viq 'gstreamer rtsp server'; do
+until curl -i rtsp://gstreamer:8554 -s | grep -viq 'gstreamer rtsp server'; do
   sleep 0.1s
   duration=$(($(date +%s%3N) - $START_TIME))
   if (( $duration > 10000 )); then
@@ -40,4 +40,8 @@ done
 echo "ready! ($duration ms)"
 
 echo "Starting cypress"
-yarn cypress run
+if [[ -z "$1" ]]; then
+  yarn cypress run
+else
+  yarn cypress run --headless -b "$1"
+fi