kaltura · JonathanTGold · Oct 30, 2023 · Nov 1, 2023 · Nov 1, 2023 · Nov 2, 2023
diff --git a/.eslintrc b/.eslintrc
@@ -1,17 +1,28 @@
 {
   "root": true,
   "parser": "@typescript-eslint/parser",
-  "extends": ["eslint:recommended", "plugin:@typescript-eslint/recommended"],
-  "plugins": ["@typescript-eslint"],
+  "extends": ["plugin:prettier/recommended", "plugin:@typescript-eslint/recommended", "prettier"],
+  "plugins": ["prettier", "@typescript-eslint"],
   "rules": {
-    "indent": ["error", 2],
     "react/prefer-stateless-function": "off",
-    "max-len": ["warn", { "code": 500 }],
+    "max-len": [
+      "error",
+      {
+        "code": 150,
+        "ignoreComments": true,
+        "ignoreStrings": true,
+        "ignoreUrls": true,
+        "ignoreTemplateLiterals": true,
+        "ignoreRegExpLiterals": true
+      }
+    ],
+    "space-before-function-paren": "off",
     "eol-last": "off",
+    "prettier/prettier": "error",
     "@typescript-eslint/explicit-function-return-type": "warn",
     "@typescript-eslint/no-non-null-assertion": "off",
     "@typescript-eslint/no-unused-vars": "error",
-//    "@typescript-eslint/no-explicit-any": "warn",
+    //    "@typescript-eslint/no-explicit-any": "warn",
     "@typescript-eslint/no-explicit-any": "off",
     "@typescript-eslint/explicit-member-accessibility": [
       "error",
@@ -27,34 +38,19 @@
       }
     ],
     "block-scoped-var": "error",
+    "arrow-parens": "error",
     "eqeqeq": "error",
     "no-var": "error",
     "no-console": "error",
     "prefer-const": "error",
     "prefer-arrow-callback": "error",
     "no-trailing-spaces": "error",
-    "quotes": ["warn", "single", { "avoidEscape": true }],
-    "no-restricted-properties": [
-      "error",
-      {
-        "object": "describe",
-        "property": "only"
-      },
-      {
-        "object": "it",
-        "property": "only"
-      }
-    ]
+    "quotes": ["warn", "single", { "avoidEscape": true }]
   },
   "overrides": [],
-  "settings": {
-    "jest": {
-      "version": 26
-    }
-  },
+  "settings": {},
   "env": {
     "browser": true,
-    "commonjs": true,
     "es6": true
   }
 }
diff --git a/.github/workflows/run_tests.yaml b/.github/workflows/run_tests.yaml
@@ -12,7 +12,7 @@ jobs:
     uses: kaltura/ovp-pipelines-pub/.github/workflows/player_tests.yaml@master
     with:
       node-version: '20.x'
-      yarn-run-to-execute: 'build'
+      yarn-run-to-execute: 'build:prod'
   test:
     uses: kaltura/ovp-pipelines-pub/.github/workflows/player_tests.yaml@master
     with:

diff --git a/.prettierrc b/.prettierrc
@@ -1,9 +1,7 @@
 {
-  "printWidth": 200,
+  "printWidth": 150,
   "tabWidth": 2,
-  "useTabs": false,
-  "semi": true,
   "singleQuote": true,
   "trailingComma": "none",
-  "proseWrap": "preserve"
+  "arrowParens": "always"
 }
diff --git a/api-extractor.json b/api-extractor.json
@@ -25,12 +25,12 @@
     },
     "extractorMessageReporting": {
       "default": {
-        "logLevel": "warning"
+        "logLevel": "none"
       }
     },
     "tsdocMessageReporting": {
       "default": {
-        "logLevel": "warning"
+        "logLevel": "none"
       }
     }
   }

diff --git a/demo/index.html b/demo/index.html
@@ -1,18 +1,18 @@
-<!DOCTYPE html>
+<!doctype html>
 <html lang="en">
-<head>
-  <meta charset="UTF-8">
-  <title>Title</title>
-  <style>
-    #player-placeholder {
-      width: 640px;
-      height: 360px;
-      background-color: black;
-    }
-  </style>
-  <script src="./playkit.js" type="text/javascript"></script>
-</head>
-<body>
-<div id="player-placeholder"></div>
-</body>
+  <head>
+    <meta charset="UTF-8" />
+    <title>Title</title>
+    <style>
+      #player-placeholder {
+        width: 640px;
+        height: 360px;
+        background-color: black;
+      }
+    </style>
+    <script src="./playkit.js" type="text/javascript"></script>
+  </head>
+  <body>
+    <div id="player-placeholder"></div>
+  </body>
 </html>
diff --git a/karma.conf.js b/karma.conf.js
@@ -1,4 +1,6 @@
-const webpackConfig = require('./webpack.config')( null, {mode: 'development'});
+const webpackConfig = require('./webpack.config')(null, {
+  mode: 'development'
+});
 delete webpackConfig.entry;
 delete webpackConfig.externals;
 delete webpackConfig.output;
@@ -15,15 +17,15 @@ module.exports = function (config) {
       {
         pattern: 'tests/assets/**/*',
         included: false
-      },
+      }
     ],
     exclude: [],
     preprocessors: {
       'tests/index.js': ['webpack', 'sourcemap']
     },
     reporters: ['mocha'],
     mochaReporter: {
-      showDiff: true,
+      showDiff: true
     },
 
     coverageIstanbulReporter: {

diff --git a/package.json b/package.json
@@ -69,7 +69,9 @@
     "copy-webpack-plugin": "^11.0.0",
     "css-loader": "6.8.1",
     "eslint": "^8.56.0",
+    "eslint-config-prettier": "^9.1.0",
     "eslint-plugin-mocha": "^10.2.0",
+    "eslint-plugin-prettier": "^5.1.2",
     "karma": "^6.4.0",
     "karma-chrome-launcher": "^3.1.1",
     "karma-firefox-launcher": "^1.3.0",

diff --git a/src/ads/ad-error-code.ts b/src/ads/ad-error-code.ts
@@ -1,4 +1,4 @@
-const AdErrorCode: {[code: string]: number} = {
+const AdErrorCode: { [code: string]: number } = {
   /**
    * VAST supplied in adm is not a valid XML document.
    * URL supplied in nurl does not resolve to a valid XML document.
@@ -172,4 +172,4 @@ const AdErrorCode: {[code: string]: number} = {
   GENERAL_VPAID_ERROR: 8901
 };
 
-export {AdErrorCode};
+export { AdErrorCode };
diff --git a/src/ads/ad-event-type.ts b/src/ads/ad-event-type.ts
@@ -101,4 +101,4 @@ const AdEventType = {
   AD_AUTOPLAY_FAILED: 'adautoplayfailed'
 } as const;
 
-export {AdEventType};
+export { AdEventType };
diff --git a/src/ads/ad-tag-type.ts b/src/ads/ad-tag-type.ts
@@ -1,4 +1,4 @@
-export  const AdTagType = {
+export const AdTagType = {
   VAST: 'vast',
   VMAP: 'vmap'
 } as const;
diff --git a/src/drm/fairplay.ts b/src/drm/fairplay.ts
@@ -1,7 +1,7 @@
-import {FairPlayDrmConfigType} from '../engines/html5/media-source/adapters/fairplay-drm-handler';
-import {DrmScheme} from './drm-scheme';
-import {PKDrmConfigObject, PKDrmDataObject} from '../types';
-import {ILogger} from 'js-logger';
+import { FairPlayDrmConfigType } from '../engines/html5/media-source/adapters/fairplay-drm-handler';
+import { DrmScheme } from './drm-scheme';
+import { PKDrmConfigObject, PKDrmDataObject } from '../types';
+import { ILogger } from 'js-logger';
 import getLogger from '../utils/logger';
 
 const _logger: ILogger = getLogger('FairPlay');
@@ -14,7 +14,7 @@ class FairPlay {
    * @return {boolean} - Whether FairPlay is the configure key system.
    */
   public static isConfigured(drmData: Array<PKDrmDataObject>, drmConfig: PKDrmConfigObject): boolean {
-    return DrmScheme.FAIRPLAY === drmConfig.keySystem && !!drmData.find(drmEntry => drmEntry.scheme === drmConfig.keySystem);
+    return DrmScheme.FAIRPLAY === drmConfig.keySystem && !!drmData.find((drmEntry) => drmEntry.scheme === drmConfig.keySystem);
   }
 
   /**
@@ -27,7 +27,7 @@ class FairPlay {
   public static canPlayDrm(drmData: Array<PKDrmDataObject>): boolean {
     // eslint-disable-next-line  @typescript-eslint/ban-ts-comment
     // @ts-ignore
-    const result = drmData.some(drmEntry => drmEntry.scheme === DrmScheme.FAIRPLAY) && !!window.WebKitMediaKeys;
+    const result = drmData.some((drmEntry) => drmEntry.scheme === DrmScheme.FAIRPLAY) && !!window.WebKitMediaKeys;
     _logger.debug(`Can play DRM scheme of: ${DrmScheme.FAIRPLAY} is ${result.toString()}`);
     return result;
   }
@@ -40,7 +40,7 @@ class FairPlay {
    */
   public static setDrmPlayback(config: FairPlayDrmConfigType, drmData: Array<PKDrmDataObject>): void {
     _logger.debug('Sets drm playback');
-    const drmEntry = drmData.find(drmEntry => drmEntry.scheme === DrmScheme.FAIRPLAY);
+    const drmEntry = drmData.find((drmEntry) => drmEntry.scheme === DrmScheme.FAIRPLAY);
     if (drmEntry) {
       config.licenseUrl = drmEntry.licenseUrl;
       config.certificate = drmEntry.certificate;

diff --git a/src/engines/dropped-frames-watcher.ts b/src/engines/dropped-frames-watcher.ts
@@ -1,10 +1,10 @@
 import { FakeEventTarget } from '../event/fake-event-target';
 import getLogger from '../utils/logger';
-import {CustomEventType} from '../event/event-type';
+import { CustomEventType } from '../event/event-type';
 import { EventManager } from '../event/event-manager';
 import { FakeEvent } from '../event/fake-event';
-import {IMediaSourceAdapter} from '../types';
-import {PKAbrConfigObject} from '../types';
+import { IMediaSourceAdapter } from '../types';
+import { PKAbrConfigObject } from '../types';
 
 const NOT_SUPPORTED: number = -1;
 
@@ -108,4 +108,4 @@ class DroppedFramesWatcher extends FakeEventTarget {
   }
 }
 
-export {DroppedFramesWatcher};
+export { DroppedFramesWatcher };
diff --git a/src/engines/engine-decorator-manager.ts b/src/engines/engine-decorator-manager.ts
@@ -1,8 +1,8 @@
 // @flow
 import getLogger from '../utils/logger';
-import {IEngine} from '../types/interfaces/engine';
-import {IEngineDecorator} from '../types/interfaces/engine-decorator';
-import {IEngineDecoratorProvider} from '../types';
+import { IEngine } from '../types/interfaces/engine';
+import { IEngineDecorator } from '../types/interfaces/engine-decorator';
+import { IEngineDecoratorProvider } from '../types';
 import { FakeEvent } from '../event/fake-event';
 
 /**
@@ -23,7 +23,7 @@ class EngineDecoratorManager {
 
   public createDecorators(engine: IEngine, dispatchEvent: (event: FakeEvent) => void): Array<IEngineDecorator> {
     this._logger.debug(`decorators created for ${Array.from(this._decoratorProviders.keys()).toString()}`);
-    return Array.from(this._decoratorProviders.values(), engineDecoratorProvider =>
+    return Array.from(this._decoratorProviders.values(), (engineDecoratorProvider) =>
       engineDecoratorProvider.getEngineDecorator(engine, dispatchEvent)
     );
   }
@@ -34,4 +34,4 @@ class EngineDecoratorManager {
   }
 }
 
-export {EngineDecoratorManager};
+export { EngineDecoratorManager };
diff --git a/src/engines/engine-decorator-provider.ts b/src/engines/engine-decorator-provider.ts
@@ -4,9 +4,9 @@
  * @param {IEngineDecoratorProvider} plugin - The plugin which have implemented decorator.
  * @implements {IEngineDecorator}
  */
-import {IEngineDecoratorProvider} from '../types';
-import {IEngine} from '../types/interfaces/engine';
-import {IEngineDecorator} from '../types/interfaces/engine-decorator';
+import { IEngineDecoratorProvider } from '../types';
+import { IEngine } from '../types/interfaces/engine';
+import { IEngineDecorator } from '../types/interfaces/engine-decorator';
 import { FakeEvent } from '../event/fake-event';
 
 class EngineDecoratorProvider implements IEngineDecoratorProvider {
@@ -27,4 +27,4 @@ class EngineDecoratorProvider implements IEngineDecoratorProvider {
   }
 }
 
-export {EngineDecoratorProvider};
+export { EngineDecoratorProvider };
diff --git a/src/engines/engine-decorator.ts b/src/engines/engine-decorator.ts
@@ -1,10 +1,10 @@
 import { FakeEvent } from '../event/fake-event';
-import {EventType} from '../event/event-type';
+import { EventType } from '../event/event-type';
 import { EventManager } from '../event/event-manager';
 import { FakeEventTarget } from '../event/fake-event-target';
-import {EngineDecoratorManager} from './engine-decorator-manager';
-import {IEngineDecorator} from '../types/interfaces/engine-decorator';
-import {IEngine} from '../types/interfaces/engine';
+import { EngineDecoratorManager } from './engine-decorator-manager';
+import { IEngineDecorator } from '../types/interfaces/engine-decorator';
+import { IEngine } from '../types/interfaces/engine';
 
 export type EngineDecoratorType = EngineDecorator & IEngine;
 
@@ -23,13 +23,13 @@ class EngineDecorator extends FakeEventTarget implements IEngineDecorator {
     this._eventManager = new EventManager();
     this._pluginDecorators = decoratorManager.createDecorators(engine, super.dispatchEvent.bind(this));
     const events: Array<string> = Object.values(EventType);
-    events.forEach(event => this._eventManager.listen(engine, event, (e: FakeEvent) => this.dispatchEvent(e)));
+    events.forEach((event) => this._eventManager.listen(engine, event, (e: FakeEvent) => this.dispatchEvent(e)));
     return new Proxy<IEngine>(engine, {
       get: (obj, prop): IEngine => {
         if (prop === 'destroy') {
           this._destroy();
         }
-        const activeDecorator = this._pluginDecorators.find(decorator => decorator.active);
+        const activeDecorator = this._pluginDecorators.find((decorator) => decorator.active);
         let target;
         //For events the proxy is the target - to avoid listening to engine itself
         if (prop === 'addEventListener' || prop === 'removeEventListener') {
@@ -41,15 +41,15 @@ class EngineDecorator extends FakeEventTarget implements IEngineDecorator {
         return target[prop] && typeof target[prop].bind === 'function' ? target[prop].bind(target) : target[prop];
       },
       set: (obj, prop, value): boolean => {
-        const activeDecorator = this._pluginDecorators.find(decorator => prop in decorator && decorator.active);
+        const activeDecorator = this._pluginDecorators.find((decorator) => prop in decorator && decorator.active);
         activeDecorator && prop in activeDecorator ? (activeDecorator[prop] = value) : (obj[prop] = value);
         return true;
       }
     }) as EngineDecoratorType;
   }
 
   public dispatchEvent(event: FakeEvent): boolean {
-    const activeDecorator = this._pluginDecorators.find(decorator => decorator.active);
+    const activeDecorator = this._pluginDecorators.find((decorator) => decorator.active);
     return activeDecorator && activeDecorator.dispatchEvent ? activeDecorator.dispatchEvent(event) : super.dispatchEvent(event);
   }
 
@@ -63,4 +63,4 @@ class EngineDecorator extends FakeEventTarget implements IEngineDecorator {
   }
 }
 
-export {EngineDecorator};
+export { EngineDecorator };
diff --git a/src/engines/engine-provider.ts b/src/engines/engine-provider.ts
@@ -1,6 +1,6 @@
 import getLogger from '../utils/logger';
 import Html5 from './html5/html5';
-import {IEngineStatic} from '../types';
+import { IEngineStatic } from '../types';
 
 /**
  * Engine Provider
@@ -21,7 +21,7 @@ class EngineProvider {
    * @static
    * @private
    */
-  private static _engineProviders: {[id: string]: IEngineStatic} = {};
+  private static _engineProviders: { [id: string]: IEngineStatic } = {};
 
   /**
    * Add an engine to the registry.
@@ -61,7 +61,7 @@ class EngineProvider {
    * @static
    */
   public static getEngines(): Array<IEngineStatic> {
-    return Object.keys(EngineProvider._engineProviders).map(key => EngineProvider._engineProviders[key]);
+    return Object.keys(EngineProvider._engineProviders).map((key) => EngineProvider._engineProviders[key]);
   }
 
   /**
@@ -80,4 +80,4 @@ if (Html5.isSupported()) {
 
 const registerEngine = EngineProvider.register;
 const unRegisterEngine = EngineProvider.unRegister;
-export {registerEngine, unRegisterEngine, EngineProvider};
+export { registerEngine, unRegisterEngine, EngineProvider };