Add github action workflows and upgrade wepback

.env.development

@@ -1,2 +1,3 @@
 NODE_ENV=development
 SELECTED_PLAYER=FLUID_PLAYER
+VIEWABILITY_IMPLEMENTATION=GPT_EVENT

.env.production

@@ -1,2 +1,3 @@
 NODE_ENV=production
 SELECTED_PLAYER=FLUID_PLAYER
+VIEWABILITY_IMPLEMENTATION=GPT_EVENT

.github/dependabot.yml

@@ -0,0 +1,6 @@
+version: 2
+updates:
+  - package-ecosystem: "github-actions"
+    directory: "/"
+    schedule:
+      interval: "weekly"

.github/release-drafter.yml

@@ -0,0 +1,27 @@
+name-template: 'Prebid-Outstream $RESOLVED_VERSION Release'
+tag-template: '$RESOLVED_VERSION'
+categories:
+  - title: '🚀 New Features'
+    label: 'feature'
+  - title: '🛠 Maintenance'
+    label: 'maintenance'
+  - title: '🐛 Bug Fixes'
+    labels:
+      - 'fix'
+      - 'bugfix'
+      - 'bug'
+change-template: '- $TITLE (#$NUMBER)'
+version-resolver:
+  major:
+    labels:
+      - 'major'
+  minor:
+    labels:
+      - 'minor'
+  patch:
+    labels:
+      - 'patch'
+  default: minor
+template: |
+  ## In This Release
+  $CHANGES

.github/workflows/release-drafter.yml

@@ -0,0 +1,25 @@
+name: Release Drafter
+
+on:
+  push:
+    # branches to consider in the event; optional, defaults to all
+    branches:
+      - master
+      - main
+
+permissions:
+  contents: read
+
+jobs:
+  update_release_draft:
+    permissions:
+      contents: write  # for release-drafter/release-drafter to create a github release
+      pull-requests: write  # for release-drafter/release-drafter to add label to PR
+    runs-on: ubuntu-latest
+    steps:
+      # Drafts your next Release notes as Pull Requests are merged into "master"
+      - uses: release-drafter/release-drafter@v5
+        with:
+         config-name: release-drafter.yml
+        env:
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}

.github/workflows/validate-pr.yml

@@ -0,0 +1,28 @@
+name: Validate PR
+
+on:
+  push:
+    branches: [ master, main ]
+  pull_request:
+    branches: [ master, main ]
+
+jobs:
+  build:
+
+    runs-on: ubuntu-latest
+
+    strategy:
+      matrix:
+        node-version: [14.x, 16.x, 18.x]
+
+    steps:
+      - uses: actions/checkout@v3
+      - name: Use Node.js ${{ matrix.node-version }}
+        uses: actions/setup-node@v3
+        with:
+          node-version: ${{ matrix.node-version }}
+      - run: npm ci
+      - run: npm run build --if-present
+      - run: npm lint
+      - run: npm test
+      - run: npm coverage

Jenkinsfile

@@ -0,0 +1,74 @@
+@Library('jenkins-shared-library') _
+
+pipeline {
+    agent any
+
+    environment {
+        // for integration tests
+        CI = "Jenkins"
+        // for slack
+        SERVICE_NAME = "prebid-outstream"
+
+        // upload paths
+        MINIO_BUCKET = "assets.h5v.eu"
+        MINIO_PATH = "prebid-outstream"
+    }
+
+    tools {
+        nodejs 'nodejs-14.5.0'
+    }
+
+    options {
+        disableConcurrentBuilds()
+    }
+
+    stages {
+        stage('Install') {
+            steps {
+                sh 'npm install'
+            }
+        }
+
+        stage('Build') {
+            steps {
+                sh 'npm run build'
+            }
+        }
+
+        stage('Test') {
+            steps {
+                sh 'npm run test'
+            }
+        }
+
+        stage('Upload to assets.h5v.eu') {
+            steps {
+                withAWS(endpointUrl: 'https://minio.gutefrage.net', credentials: 'minio') {
+                    echo 'starting upload to minio'
+                    s3Upload(
+                        workingDir: 'dist',
+                        includePathPattern: 'bundle.js*',
+                        bucket: "${MINIO_BUCKET}",
+                        path: "${MINIO_PATH}/${BUILD_NUMBER}",
+                        pathStyleAccessEnabled: true,
+                        cacheControl: 'public,max-age=31536000,immutable',
+                        contentType: 'text/javascript;charset=utf-8'
+                    )
+                }
+            }
+        }
+
+    }
+
+    post {
+        success {
+            markBuildAsSuccessful()
+        }
+        unstable {
+            markBuildAsUnstable()
+        }
+        failure {
+            markBuildAsFailed()
+        }
+    }
+}

README.md

@@ -1,3 +1,25 @@
+This repository was initially cloned from https://github.com/prebid/prebid-outstream.
+
+The following steps can be used to pull updates from the github repository, by creating a local branch named "github", which is tracking the github repository.
+
+```
+# add github remote as "sync"
+git remote add sync https://github.com/prebid/prebid-outstream
+
+# setup local "github" branch to track "sync" remote's "master" branch
+git branch --track github sync/master
+
+# switch to the new branch
+git checkout github
+
+# pull from github
+git pull
+
+# rebase updates to master branch
+git checkout master
+git rebase github
+```
+
 # Prebid Outstream Renderer
 
 > A free and open source library for publishers to quickly implement outstream renderer.
@@ -57,7 +79,7 @@ The project allows the user to provide configuration at two levels:
 ### Build Time Configuration
 To provide the configuration at build time use the **.env.development** and **env.production** files for development and production modes respectively. Some of the available options are:
 
-##### Base Player
+#### Base Player
 This project allows user to select the base player of his choice from the available player list. If your favourite player is not available in the supported player list and you are interested in contributing to the project to provide its support, then please refer the document [How to add a new player support](https://github.com/prebid/prebid-outstream/blob/master/src/players/README.md).
 
 The user needs to provide his selected player in **SELECTED_PLAYER** environment variable from the given supported player list.
@@ -70,6 +92,17 @@ The user needs to provide his selected player in **SELECTED_PLAYER** environment
 
 *Note 2:* By default, we are choosing Fluid player as the base player for outstream renderer.
 
+#### Viewability implementation
+
+The video player will only initialize, and start and stop accordingly, if it is in the user's viewport. The way this is implemented can be configured via the `VIEWABILITY_IMPLEMENTATION` environment variable.
+
+**Supported viewability implementations**
+
++ `GPT_EVENT` – Uses the google publisher-tag's [SlotVisibilityChangedEvent](https://developers.google.com/publisher-tag/reference#googletag.events.slotvisibilitychangedevent). If you use the google publisher tag anyway, this should be your preferred choice.
++ `INTERSECTION_OBSERVER` – Uses the browser's [Intersection Observer API](https://developer.mozilla.org/en-US/docs/Web/API/Intersection_Observer_API). Does not support IE11.
++ `MANUAL_SCROLL_CHECK` – This is the default, but should not be your first choice. It is slow and not very performant, but supports IE11 and probably most other  browsers.
+
+
 ### Runtime Configuration
 User can provide some configurations to the outstream player on runtime while calling the global function window.outstreamPlayer(). The supported parameters for this are defined in GenericConfiguration class. At present, the following configurations are supported:
 

__mocks__/fluid-player.ts

@@ -1,10 +1,30 @@
-export const play = jest.fn();
-export const pause = jest.fn();
+import fluidPlayer, { FluidPlayer } from 'fluid-player';
+
+/**
+ * Mocks the fluid-player library.
+ * Just as the library, it creates a DOM element if used and has
+ * appropriate function implementations for testing.
+ */
+
+export const fakeFluidPlayerTestId = 'fake-fluid-player';
+
+const eventListeners: Map<string, Function> = new Map();
+
+export const on = jest.fn((event, callback) => eventListeners.set(event, callback));
+export const play = jest.fn(() => eventListeners.get('playing')?.());
+export const pause = jest.fn(() => eventListeners.get('pause')?.());
+
+const mock = jest.fn<FluidPlayer, Parameters<typeof fluidPlayer>>(id => {
+    const parent = document.getElementById(id);
+
+    const fakeVideoElement = document.createElement('div');
+    fakeVideoElement.setAttribute('data-testid', fakeFluidPlayerTestId);
+    parent?.appendChild(fakeVideoElement);
 
-const mock = jest.fn().mockImplementation(() => {
     return {
-        play: play,
-        pause: pause
+        play,
+        pause,
+        on
     };
 });
 

jest.config.js

@@ -106,7 +106,7 @@ module.exports = {
   // projects: undefined,
 
   // Use this configuration option to add custom reporters to Jest
-  // reporters: undefined,
+  "reporters": ["default", "github-actions"],
 
   // Automatically reset mock state between every test
   // resetMocks: false,
@@ -144,10 +144,13 @@ module.exports = {
   // snapshotSerializers: [],
 
   // The test environment that will be used for testing
-  // testEnvironment: "jest-environment-jsdom",
+  testEnvironment: "jest-environment-jsdom",
 
   // Options that will be passed to the testEnvironment
-  // testEnvironmentOptions: {},
+  testEnvironmentOptions: {
+    // This option sets the URL for the jsdom environment. It is reflected in properties such as location.href
+    url: "http://localhost?playerDebugLevel=5"
+  },
 
   // Adds a location field to test results
   // testLocationInResults: false,
@@ -172,9 +175,6 @@ module.exports = {
   // This option allows use of a custom test runner
   // testRunner: "jasmine2",
 
-  // This option sets the URL for the jsdom environment. It is reflected in properties such as location.href
-  testURL: "http://localhost?playerDebugLevel=5",
-
   // Setting this value to "fake" allows the use of fake timers for functions such as "setTimeout"
   // timers: "real",