Merge pull request #111 from clappr/feature/update-dependencies

Update dependencies for Node v18.17.1 LTS and Rollup v3 adjustments
clappr · Dec 20, 2023 · a12f661 · a12f661
2 parents c127b08 + feddd0a
commit a12f661
Show file tree

Hide file tree

Showing 17 changed files with 3,126 additions and 3,306 deletions.
diff --git a/jest.config.js b/jest.config.js
@@ -1,6 +1,7 @@
 const pkg = require('./package.json')
 
 module.exports = {
+  'testEnvironment': 'jsdom',
   'globals': {
     'VERSION': pkg.version
   },

diff --git a/package.json b/package.json
@@ -5,17 +5,17 @@
   "main": "./dist/clappr-core.js",
   "module": "./dist/clappr-core.esm.js",
   "scripts": {
-    "bundle-check": "ANALYZE_BUNDLE=true rollup --config",
-    "release": "MINIMIZE=true rollup --config",
-    "build": "rollup --config",
-    "watch": "rollup --config --watch",
+    "bundle-check": "ANALYZE_BUNDLE=true rollup --config --bundleConfigAsCjs",
+    "release": "MINIMIZE=true rollup --config --bundleConfigAsCjs",
+    "build": "rollup --config --bundleConfigAsCjs",
+    "watch": "rollup --config --watch --bundleConfigAsCjs",
     "test": "jest /src --coverage --silent",
     "test:coverage": "open coverage/lcov-report/index.html",
     "test:debug": "node --inspect node_modules/.bin/jest src/ --runInBand",
     "test:watch": "jest /src --watch",
     "lint": "eslint *.js src/",
     "lint:fix": "npm run lint -- --fix",
-    "start": "DEV=true rollup --config --watch",
+    "start": "DEV=true rollup --config --watch --bundleConfigAsCjs",
     "commitzen": "git-cz",
     "prepublishOnly": "npm run release"
   },
@@ -37,36 +37,36 @@
   },
   "homepage": "https://github.com/clappr/clappr-core",
   "devDependencies": {
-    "@babel/core": "^7.17.0",
-    "@babel/preset-env": "^7.16.11",
-    "@rollup/plugin-alias": "^3.1.9",
-    "@rollup/plugin-babel": "^5.3.0",
-    "@rollup/plugin-commonjs": "^21.0.1",
-    "@rollup/plugin-json": "^4.1.0",
-    "@rollup/plugin-node-resolve": "^13.1.3",
-    "@rollup/plugin-replace": "^3.0.1",
-    "autoprefixer": "10.4.2",
-    "babel-jest": "^26.6.3",
+    "@babel/core": "^7.22.17",
+    "@babel/preset-env": "^7.22.15",
+    "@rollup/plugin-alias": "^5.0.0",
+    "@rollup/plugin-babel": "^6.0.3",
+    "@rollup/plugin-commonjs": "^25.0.4",
+    "@rollup/plugin-json": "^6.0.0",
+    "@rollup/plugin-node-resolve": "^15.2.1",
+    "@rollup/plugin-replace": "^5.0.2",
+    "autoprefixer": "10.4.15",
+    "babel-jest": "^29.7.0",
     "clappr-zepto": "0.0.7",
     "coveralls": "^3.1.1",
     "cz-conventional-changelog": "^3.3.0",
-    "eslint": "^8.8.0",
-    "html-loader": "0.5.5",
-    "jest": "^26.6.3",
+    "eslint": "^8.49.0",
+    "jest": "^29.7.0",
+    "jest-environment-jsdom": "^29.7.0",
     "jest-directory-named-resolver": "^0.3.0",
-    "jest-mock-console": "^1.0.1",
-    "node-sass": "^7.0.1",
-    "postcss": "^8.4.6",
-    "rollup": "^2.67.0",
-    "rollup-plugin-filesize": "^9.1.2",
+    "jest-mock-console": "^2.0.0",
+    "node-sass": "^9.0.0",
+    "postcss": "^8.4.29",
+    "rollup": "^3.29.1",
+    "rollup-plugin-filesize": "^10.0.0",
     "rollup-plugin-html": "^0.2.1",
     "rollup-plugin-livereload": "^2.0.5",
     "rollup-plugin-named-directory": "^1.0.0",
     "rollup-plugin-postcss": "^4.0.2",
-    "rollup-plugin-serve": "^1.1.0",
-    "rollup-plugin-sizes": "^1.0.4",
+    "rollup-plugin-serve": "^2.0.2",
+    "rollup-plugin-sizes": "^1.0.5",
     "rollup-plugin-terser": "^7.0.2",
-    "rollup-plugin-visualizer": "^5.5.4"
+    "rollup-plugin-visualizer": "^5.9.2"
   },
   "config": {
     "commitizen": {

diff --git a/rollup.config.js b/rollup.config.js
@@ -11,7 +11,7 @@ import livereload from 'rollup-plugin-livereload'
 import serve from 'rollup-plugin-serve'
 import filesize from 'rollup-plugin-filesize'
 import size from 'rollup-plugin-sizes'
-import visualize from 'rollup-plugin-visualizer'
+const { visualizer } = require('rollup-plugin-visualizer')
 import { terser } from 'rollup-plugin-terser'
 import pkg from './package.json'
 
@@ -28,7 +28,7 @@ const postcssOptions = {
   inject: false,
 }
 const aliasPluginOptions = { entries: { 'clappr-zepto': 'node_modules/clappr-zepto/zepto.js', '@': __dirname + '/src' } }
-const replacePluginOptions = { VERSION: JSON.stringify(pkg.version) }
+const replacePluginOptions = { VERSION: JSON.stringify(pkg.version), preventAssignment: true }
 const babelPluginOptions = { babelHelpers: 'bundled', exclude: 'node_modules/**' }
 const servePluginOptions = { contentBase: ['dist', 'public'], host: '0.0.0.0', port: '8080' }
 const livereloadPluginOptions = { watch: ['dist', 'public'] }
@@ -48,7 +48,7 @@ const plugins = [
   filesize(),
   dev && serve(servePluginOptions),
   dev && livereload(livereloadPluginOptions),
-  analyzeBundle && visualize(visualizePluginOptions)
+  analyzeBundle && visualizer(visualizePluginOptions)
 ]
 
 const mainBundle = {

diff --git a/src/__mocks__/htmlMock.js b/src/__mocks__/htmlMock.js
@@ -1,8 +1,8 @@
 /* eslint-disable no-undef */
-const htmlLoader = require('html-loader')
-
 module.exports = {
-  process(src) {
-    return htmlLoader(src)
+  process(sourceText) {
+    return {
+      code: `module.exports = ${JSON.stringify(sourceText)};`,
+    }
   },
 }
diff --git a/src/base/adaptive_playback/adaptive_playback.test.js b/src/base/adaptive_playback/adaptive_playback.test.js
@@ -14,48 +14,49 @@ const isGetterProperty = (obj, prop) => {
 
 describe('AdaptivePlayback', () => {
   describe('have a getter', function() {
+    let playback
     beforeEach(() => {
-      this.playback = new AdaptivePlayback()
+      playback = new AdaptivePlayback()
     })
 
     test('called isAdaptive', () => {
-      expect(isGetterProperty(this.playback, 'isAdaptive')).toBeTruthy()
-      expect(isSetterProperty(this.playback, 'isAdaptive')).toBeFalsy()
+      expect(isGetterProperty(playback, 'isAdaptive')).toBeTruthy()
+      expect(isSetterProperty(playback, 'isAdaptive')).toBeFalsy()
     })
 
     test('called isAutoAdaptive and a setter too', () => {
-      expect(isGetterProperty(this.playback, 'isAutoAdaptive')).toBeTruthy()
-      expect(isSetterProperty(this.playback, 'isAutoAdaptive')).toBeTruthy()
+      expect(isGetterProperty(playback, 'isAutoAdaptive')).toBeTruthy()
+      expect(isSetterProperty(playback, 'isAutoAdaptive')).toBeTruthy()
     })
 
     test('called activeVideoQualityLevels', () => {
-      expect(isGetterProperty(this.playback, 'activeVideoQualityLevels')).toBeTruthy()
-      expect(isSetterProperty(this.playback, 'activeVideoQualityLevels')).toBeFalsy()
+      expect(isGetterProperty(playback, 'activeVideoQualityLevels')).toBeTruthy()
+      expect(isSetterProperty(playback, 'activeVideoQualityLevels')).toBeFalsy()
     })
 
     test('called videoQualityLevels', () => {
-      expect(isGetterProperty(this.playback, 'videoQualityLevels')).toBeTruthy()
-      expect(isSetterProperty(this.playback, 'videoQualityLevels')).toBeFalsy()
+      expect(isGetterProperty(playback, 'videoQualityLevels')).toBeTruthy()
+      expect(isSetterProperty(playback, 'videoQualityLevels')).toBeFalsy()
     })
 
     test('called availableAudioOptions', () => {
-      expect(isGetterProperty(this.playback, 'availableAudioOptions')).toBeTruthy()
-      expect(isSetterProperty(this.playback, 'availableAudioOptions')).toBeFalsy()
+      expect(isGetterProperty(playback, 'availableAudioOptions')).toBeTruthy()
+      expect(isSetterProperty(playback, 'availableAudioOptions')).toBeFalsy()
     })
 
     test('called audioOptions', () => {
-      expect(isGetterProperty(this.playback, 'audioOptions')).toBeTruthy()
-      expect(isSetterProperty(this.playback, 'audioOptions')).toBeFalsy()
+      expect(isGetterProperty(playback, 'audioOptions')).toBeTruthy()
+      expect(isSetterProperty(playback, 'audioOptions')).toBeFalsy()
     })
 
     test('called availableClosedCaptions', () => {
-      expect(isGetterProperty(this.playback, 'availableClosedCaptions')).toBeTruthy()
-      expect(isSetterProperty(this.playback, 'availableClosedCaptions')).toBeFalsy()
+      expect(isGetterProperty(playback, 'availableClosedCaptions')).toBeTruthy()
+      expect(isSetterProperty(playback, 'availableClosedCaptions')).toBeFalsy()
     })
 
     test('called closedCaptions', () => {
-      expect(isGetterProperty(this.playback, 'closedCaptions')).toBeTruthy()
-      expect(isSetterProperty(this.playback, 'closedCaptions')).toBeFalsy()
+      expect(isGetterProperty(playback, 'closedCaptions')).toBeTruthy()
+      expect(isSetterProperty(playback, 'closedCaptions')).toBeFalsy()
     })
   })
 

diff --git a/src/base/error_mixin/error_mixin.test.js b/src/base/error_mixin/error_mixin.test.js
@@ -9,8 +9,9 @@ import Playback from '@/base/playback'
 import Events from '@/base/events'
 
 describe('ErrorMixin', function() {
+  let errorExample
   beforeEach(() => {
-    this.errorExample = { code: 'TEST_ERROR', description: 'A error example.', level: PlayerError.Levels.FATAL }
+    errorExample = { code: 'TEST_ERROR', description: 'A error example.', level: PlayerError.Levels.FATAL }
   })
 
   test('is used on all plugins base classes', () => {
@@ -30,7 +31,7 @@ describe('ErrorMixin', function() {
   describe('creates a error', () => {
 
     test('with default values', () => {
-      expect(ErrorMixin.createError(this.errorExample)).toEqual({
+      expect(ErrorMixin.createError(errorExample)).toEqual({
         code: ':TEST_ERROR',
         description: 'A error example.',
         level: 'FATAL',
@@ -52,7 +53,7 @@ describe('ErrorMixin', function() {
     })
 
     test('owns option to not manipulate error code', () => {
-      expect(ErrorMixin.createError(this.errorExample, { useCodePrefix: false })).toEqual({
+      expect(ErrorMixin.createError(errorExample, { useCodePrefix: false })).toEqual({
         description: 'A error example.',
         level: 'FATAL',
         origin: '',
@@ -67,7 +68,7 @@ describe('ErrorMixin', function() {
       const plugin1 = new CorePlugin({})
       const plugin2 = new ContainerPlugin({})
 
-      expect(playback.createError(this.errorExample)).toEqual({
+      expect(playback.createError(errorExample)).toEqual({
         description: 'A error example.',
         level: 'FATAL',
         origin: 'playback',
@@ -76,7 +77,7 @@ describe('ErrorMixin', function() {
         code: 'playback:TEST_ERROR'
       })
 
-      expect(plugin1.createError(this.errorExample)).toEqual({
+      expect(plugin1.createError(errorExample)).toEqual({
         description: 'A error example.',
         level: 'FATAL',
         origin: 'core',
@@ -85,7 +86,7 @@ describe('ErrorMixin', function() {
         code: 'core:TEST_ERROR'
       })
 
-      expect(plugin2.createError(this.errorExample)).toEqual({
+      expect(plugin2.createError(errorExample)).toEqual({
         description: 'A error example.',
         level: 'FATAL',
         origin: 'container',
@@ -102,7 +103,7 @@ describe('ErrorMixin', function() {
         }
       })
 
-      expect(plugin.createError(this.errorExample)).toEqual({
+      expect(plugin.createError(errorExample)).toEqual({
         description: 'A error example.',
         level: 'FATAL',
         origin: 'container',
@@ -119,7 +120,7 @@ describe('ErrorMixin', function() {
     const plugin = new UICorePlugin(new Core({}))
 
     plugin.listenTo(plugin.core, Events.ERROR, callback)
-    plugin.createError(this.errorExample)
+    plugin.createError(errorExample)
 
     expect(callback).toHaveBeenCalledWith({
       description: 'A error example.',