[Broadcaster] Add headless client

Author: mickel8

.github/workflows/__CD__broadcaster.yml

@@ -27,11 +27,18 @@ jobs:
           username: ${{ secrets.BROADCASTER_SSH_USERNAME }}
           key: ${{ secrets.BROADCASTER_SSH_PRIV_KEY }}
           script: |
+            # Exit if any command fails.
+            set -e
+
             export APP_NAME=broadcaster
             export TAG=${{ github.ref_name }}
             export TAG=${TAG#*-v}
+
+            echo "Cleaning previous broadcaster docker image"
             docker stop $APP_NAME
             docker rm $APP_NAME
+
+            echo "Running a new broadcaster image - $TAG"
             docker run -d --restart unless-stopped \
               --name $APP_NAME \
               -e SECRET_KEY_BASE=${{ secrets.BROADCASTER_SECRET_KEY_BASE }} \
@@ -42,10 +49,40 @@ jobs:
               -e WHIP_TOKEN=${{ secrets.BROADCASTER_WHIP_TOKEN }} \
               --network host \
               ghcr.io/elixir-webrtc/apps/$APP_NAME:$TAG
-            docker image prune --all --force
-
-
 
+            docker image prune --all --force
 
+            echo "Waiting for broadcaster to be ready."
+            attempts=10
+            until curl localhost:4000 > /dev/null 2>&1
+            do 
+              ((attempts--))
+              if [ $attempts -eq 0 ]; then
+                exit 1
+              fi
+              sleep 1
+            done
+            
+            echo "Cloning client script"
+            rm -rf /tmp/apps
+            git clone -b ${{ github.ref_name }} https://github.com/${{ github.repository }} /tmp/apps
+            cd /tmp/apps/broadcaster
 
+            echo "Terminating previously running client"
+            # ignore non-zero exit status
+            killall node || true
+            
+            # This is needed to find `node` and `npm` commands.
+            # See difference between interactive and non-interactive shells.
+            source ~/.nvm/nvm.sh
+            
+            echo "Installing puppeteer in current directory"
+            npm install puppeteer
 
+            # Run node in bg, disconnect it from terminal and redirect all output. 
+            # In other case action won't end.
+            echo "Running client script"
+            USERNAME=${{ secrets.BROADCASTER_ADMIN_USERNAME }} \
+              PASSWORD=${{ secrets.BROADCASTER_ADMIN_PASSWORD }} \
+              TOKEN=${{ secrets.BROADCASTER_WHIP_TOKEN }} \
+              nohup node headless_client.js > nohup.out 2> nohup.err < /dev/null &

broadcaster/README.md

@@ -27,7 +27,7 @@ Now you can visit [`localhost:4000`](http://localhost:4000) from your browser. Y
 
 You can also run Broadcaster using Docker.
 
-Build an image:
+Build an image (or use `ghcr.io/elixir-webrtc/apps/broadcaster:latest`):
 
 ```
 docker build -t broadcaster .

broadcaster/headless_client.js

@@ -0,0 +1,46 @@
+'use strict';
+
+const puppeteer = require('puppeteer');
+
+(async () => {
+    const browser = await puppeteer.launch({
+        // headless: false,
+        args: [
+            '--no-sandbox',
+            '--use-fake-ui-for-media-stream',
+            '--use-fake-device-for-media-stream'
+        ]
+    });
+    
+    try {
+        const username = (process.env.USERNAME === undefined) ? 'admin' : process.env.USERNAME;
+        const password = (process.env.PASSWORD === undefined) ? 'admin' : process.env.PASSWORD;
+        const url = (process.env.URL === undefined) ? 'http://localhost:4000' : process.env.URL;
+        const token = (process.env.TOKEN === undefined) ? 'example' : process.env.TOKEN;
+      
+        const page = await browser.newPage();
+        await page.setViewport({width: 1280, height: 720});
+        await page.authenticate({username: username, password: password});
+        await page.goto(`${url}/admin/player`);
+      
+        // When button is available and initialized,
+        // we can safely start streaming.
+        await page.waitForSelector('button');
+        await page.waitForFunction(() => {
+          const button = document.getElementById('button');
+          console.log(button);
+          return button.onclick !== null;
+        });
+      
+        await page.evaluate((url, token) => {
+          document.getElementById('serverUrl').value = `${url}/api/whip`;
+          document.getElementById('serverToken').value = token;
+        }, url, token);
+      
+        page.evaluate(() => {
+          document.getElementById('button').click();
+        });
+    } catch {
+      await browser.close();
+    }
+})();