Upgrade dependencies of the widget package

leoeuclids · leoeuclids · commit 8105f8183a46 · 2025-03-21T10:47:12.000-03:00
diff --git a/.gitignore b/.gitignore
@@ -40,6 +40,7 @@ build/Release
 # Dependency directories
 node_modules/
 jspm_packages/
+tmp/
 
 # TypeScript v1 declaration files
 typings/
diff --git a/packages/push/rollup.test.js b/packages/push/rollup.test.js
@@ -0,0 +1,20 @@
+import config from './rollup.config.js';
+import multi from '@rollup/plugin-multi-entry';
+import mocha from 'rollup-plugin-mocha';
+
+export default {
+  input: {
+    include: ['test/index.js', 'test/channel.js'],
+  },
+  output: {
+    file: 'tmp/test.cjs',
+    format: 'cjs',
+  },
+  plugins: [
+    ...config.plugins,
+    multi(),
+    mocha({
+      cache: true,
+    }),
+  ],
+};
diff --git a/packages/widget/.babelrc b/packages/widget/.babelrc
diff --git a/packages/widget/.eslintrc.js b/packages/widget/.eslintrc.js
diff --git a/packages/widget/.mocharc.json b/packages/widget/.mocharc.json
@@ -0,0 +1,7 @@
+{
+  "extension": ["js"],
+  "package": "./package.json",
+  "require": ["@babel/register", "test/helper.js"],
+  "recursive": true,
+  "colors": true
+}
diff --git a/packages/widget/.prettierrc.js b/packages/widget/.prettierrc.js
@@ -0,0 +1,12 @@
+export default {
+  overrides: [
+    {
+      files: '*.{js,ts,mjs,mts,cjs,cts}',
+      options: {
+        singleQuote: true,
+        trailingComma: 'es5',
+        printWidth: 120,
+      },
+    }
+  ],
+};
diff --git a/packages/widget/babel.config.json b/packages/widget/babel.config.json
@@ -0,0 +1,5 @@
+{
+  "presets": ["@babel/preset-env"],
+  "plugins": ["@babel/plugin-transform-runtime"],
+  "generatorOpts": { "importAttributesKeyword": "with" }
+}
diff --git a/packages/widget/eslint.config.js b/packages/widget/eslint.config.js
@@ -0,0 +1,33 @@
+import globals from 'globals';
+
+import js from '@eslint/js';
+import prettier from 'eslint-plugin-prettier/recommended';
+
+import babelParser from '@babel/eslint-parser';
+
+export default [
+  js.configs.recommended,
+  prettier,
+  {
+    languageOptions: {
+      globals: {
+        ...globals.node,
+        ...globals.mocha,
+        window: 'readonly',
+        document: 'readonly',
+      },
+
+      parser: babelParser,
+      ecmaVersion: 2018,
+      sourceType: 'module',
+    },
+  },
+  {
+    linterOptions: {
+      reportUnusedDisableDirectives: 'error',
+    },
+  },
+  {
+    ignores: ['node_modules', 'dist', '!**/.*'],
+  },
+];
diff --git a/packages/widget/package.json b/packages/widget/package.json
@@ -5,6 +5,7 @@
   "author": "Benedikt Deicke <benedikt@userlist.com>",
   "homepage": "https://github.com/userlist/userlist-javascript",
   "license": "MIT",
+  "type": "module",
   "main": "dist/index.cjs.js",
   "module": "dist/index.esm.js",
   "files": [
@@ -13,6 +14,12 @@
     "src",
     "test"
   ],
+  "exports": {
+    ".": {
+      "import": "./dist/index.esm.js",
+      "require": "./dist/index.cjs.js"
+    }
+  },
   "publishConfig": {
     "access": "public"
   },
@@ -24,7 +31,7 @@
     "lint": "eslint src test",
     "build": "rollup -c",
     "serve": "rollup -c rollup.serve.js",
-    "test": "mocha --require ignore-styles --require test/helper --require @babel/register --recursive --colors",
+    "test": "rollup -c rollup.test.js",
     "test:watch": "pnpm test --watch",
     "prepublish": "pnpm lint && pnpm test && pnpm build"
   },
@@ -33,24 +40,36 @@
   },
   "devDependencies": {
     "@babel/core": "^7.9.0",
+    "@babel/eslint-parser": "^7.26.10",
     "@babel/plugin-transform-runtime": "^7.9.0",
     "@babel/preset-env": "^7.9.0",
     "@babel/register": "^7.9.0",
     "@babel/runtime": "^7.9.2",
-    "@rollup/plugin-commonjs": "^11.0.2",
-    "@rollup/plugin-node-resolve": "^7.1.1",
-    "autoprefixer": "^9.7.5",
-    "chai": "^4.2.0",
-    "eslint": "6.8.0",
+    "@eslint/js": "^9.22.0",
+    "@rollup/plugin-babel": "^6.0.0",
+    "@rollup/plugin-commonjs": "^28.0.0",
+    "@rollup/plugin-node-resolve": "^16.0.0",
+    "autoprefixer": "^10.0.0",
+    "chai": "^5.0.0",
+    "eslint": "^9.0.0",
+    "eslint-config-prettier": "^10.1.1",
+    "eslint-plugin-prettier": "^5.2.3",
+    "globals": "^16.0.0",
     "ignore-styles": "^5.0.1",
-    "jsdom": "^16.2.1",
-    "mocha": "^7.1.1",
+    "jsdom": "^26.0.0",
+    "mocha": "^11.0.0",
+    "postcss": "^8.5.3",
     "postcss-initial": "^3.0.2",
-    "rollup": "^2.2.0",
-    "rollup-plugin-babel": "^4.4.0",
-    "rollup-plugin-postcss": "^2.5.0",
-    "rollup-plugin-serve": "^1.0.1",
-    "sinon": "^9.0.1",
-    "sinon-chai": "^3.5.0"
+    "prettier": "^3.5.3",
+    "rollup": "^4.0.0",
+    "rollup-plugin-import-css": "^3.5.8",
+    "rollup-plugin-mocha": "^0.0.1",
+    "rollup-plugin-postcss": "^4.0.0",
+    "rollup-plugin-serve": "^3.0.0",
+    "sinon": "^19.0.0",
+    "sinon-chai": "^4.0.0"
+  },
+  "dependencies": {
+    "@rollup/plugin-multi-entry": "^6.0.1"
   }
 }
diff --git a/packages/widget/rollup.config.js b/packages/widget/rollup.config.js
@@ -1,39 +1,35 @@
-import babel from 'rollup-plugin-babel';
-import postcss from 'rollup-plugin-postcss';
-
+import babel from '@rollup/plugin-babel';
 import resolve from '@rollup/plugin-node-resolve';
 import commonjs from '@rollup/plugin-commonjs';
+import postcss from 'rollup-plugin-postcss';
 
 import autoprefixer from 'autoprefixer';
 import initial from 'postcss-initial';
 
-import pkg from './package.json';
+import pkg from './package.json' with { type: 'json' };
 
 export default {
   input: 'src/index.js',
   output: [
     {
       file: pkg.main,
-      format: 'cjs'
+      format: 'cjs',
     },
     {
       file: pkg.module,
-      format: 'esm'
-    }
+      format: 'esm',
+    },
   ],
   plugins: [
     resolve(),
     babel({
-      runtimeHelpers: true
+      babelHelpers: 'runtime',
     }),
     commonjs(),
     postcss({
       inject: false,
       minimize: true,
-      plugins: [
-        autoprefixer,
-        initial
-      ]
-    })
-  ]
+      plugins: [autoprefixer, initial],
+    }),
+  ],
 };
diff --git a/packages/widget/rollup.test.js b/packages/widget/rollup.test.js
@@ -0,0 +1,21 @@
+import config from './rollup.config.js';
+import multi from '@rollup/plugin-multi-entry';
+import mocha from 'rollup-plugin-mocha';
+
+export default {
+  input: {
+    include: ['test/**/*.js'],
+    exclude: ['test/helper.js'],
+  },
+  output: {
+    file: 'tmp/test.cjs',
+    format: 'cjs',
+  },
+  plugins: [
+    ...config.plugins,
+    multi(),
+    mocha({
+      cache: true,
+    }),
+  ],
+};
diff --git a/packages/widget/src/channel.js b/packages/widget/src/channel.js
@@ -17,11 +17,11 @@ export default class Channel extends EventEmitter {
   static listen(element) {
     return new Promise((resolve) => {
       element.addEventListener('message', (event) => {
-        if(event.data === INIT) {
+        if (event.data === INIT) {
           let channel = new Channel(event.ports[0]);
           channel.on('connect', () => resolve(channel));
         }
-      })
+      });
     });
   }
 
diff --git a/packages/widget/src/index.js b/packages/widget/src/index.js
@@ -1,5 +1,5 @@
 import Channel from './channel';
-import styles from './styles.css';
+import styles from './styles.css' with { type: 'css' };
 
 function createWidget(widgetURI) {
   let body = document.body;
@@ -29,7 +29,7 @@ class Widget {
 
     this.connectChannel().then((channel) => {
       channel.on('resize', (dimensions) => {
-        if(dimensions.height > 0) {
+        if (dimensions.height > 0) {
           this.resize(dimensions);
           this.open();
         } else {
@@ -46,13 +46,15 @@ class Widget {
   }
 
   connectChannel() {
-    return this._connectChannel = this._connectChannel || Channel.listen(window).then((channel) => {
-      return this.tokenProvider.receiveToken().then((token) => {
-        channel.postMessage('init', { token });
-
-        return channel;
-      });
-    });
+    return (this._connectChannel =
+      this._connectChannel ||
+      Channel.listen(window).then((channel) => {
+        return this.tokenProvider.receiveToken().then((token) => {
+          channel.postMessage('init', { token });
+
+          return channel;
+        });
+      }));
   }
 
   resize({ height }) {
@@ -82,15 +84,12 @@ class Widget {
   }
 
   destroy() {
-    if(this._connectChannel) {
+    if (this._connectChannel) {
       this.connectChannel().then((channel) => channel.close());
     }
 
     this.element.remove();
   }
 }
 
-export {
-  Widget,
-  Channel
-};
+export { Widget, Channel };
diff --git a/packages/widget/src/utils/event_emitter.js b/packages/widget/src/utils/event_emitter.js
@@ -4,7 +4,7 @@ export default class EventEmitter {
   }
 
   on(eventName, callback) {
-    if(!this._callbacks[eventName]) {
+    if (!this._callbacks[eventName]) {
       this._callbacks[eventName] = [];
     }
 
@@ -14,8 +14,8 @@ export default class EventEmitter {
   emit(eventName, ...args) {
     let callbacks = this._callbacks[eventName];
 
-    if(callbacks) {
-      for(let callback of callbacks) {
+    if (callbacks) {
+      for (let callback of callbacks) {
         callback(...args);
       }
     }
diff --git a/packages/widget/test/channel.js b/packages/widget/test/channel.js
diff --git a/packages/widget/test/helper.js b/packages/widget/test/helper.js
diff --git a/packages/widget/test/index.js b/packages/widget/test/index.js
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
