feat: add convenience functions, update Docker setup, and integrate Webpack for building WebRTC internals exporter

webrtc-internals-exporter/background.js

@@ -6,17 +6,17 @@ function log(...args) {
 
 log("loaded");
 
-import "/assets/pako.min.js";
+import "./assets/pako.min.js";
 
 const DEFAULT_OPTIONS = {
-  url: "http://localhost:9092",
+  url: process.env.WEBRTC_INTERNALS_EXPORTER_URL + ":9092",
   username: "",
   password: "",
   updateInterval: 2,
   gzip: false,
   job: "webrtc-internals-exporter",
-  enabledOrigins: { },
-  enabledStats: ["data-channel", "local-candidate", "remote-candidate"]
+  enabledOrigins: {},
+  enabledStats: ["data-channel", "local-candidate", "remote-candidate", "candidate-pair"]
 };
 
 const options = {};

webrtc-internals-exporter/manifest.json

@@ -40,7 +40,7 @@
     }
   ],
   "background": {
-    "service_worker": "background.js",
+    "service_worker": "background.bundle.js",
     "type": "module"
   },
   "web_accessible_resources": [

webrtc-internals-exporter/webpack/babel.config.js

@@ -0,0 +1,3 @@
+module.exports = {
+  shouldPrintComment: () => false
+};

webrtc-internals-exporter/webpack/build.js

@@ -0,0 +1,26 @@
+const { execSync } = require('child_process');
+const args = process.argv.slice(2);
+
+let url = '';
+
+args.forEach((arg, index) => {
+    if (arg === '-u' || arg === '--url') {
+        url = args[index + 1];
+    } else if (arg === '-h' || arg === '--help') {
+        console.log('Usage: npm run build -- [-u|--url <url>]');
+        console.log('Options:');
+        console.log('  -u, --url <url>  URL to use for the extension collector server');
+        console.log('  -h, --help       Display this help message');
+        process.exit(0);
+    } else if (arg.startsWith('-')) {
+        console.error(`Unrecognized argument: ${arg}`);
+        process.exit(1);
+    }
+});
+
+if (url) {
+  console.log(`Building with URL: ${url}`);
+  execSync(`webpack --env URL=${url}`, { stdio: 'inherit' });
+} else {
+  execSync('webpack', { stdio: 'inherit' });
+}

webrtc-internals-exporter/webpack/package.json

@@ -0,0 +1,32 @@
+{
+  "name": "webrtc-internals-exporter",
+  "version": "1.0.0",
+  "private": true,
+  "scripts": {
+    "build": "node build.js"
+  },
+  "keywords": [],
+  "author": "Mirko Milovanovic",
+  "license": "MIT",
+  "devDependencies": {
+    "babel-loader": "^8.2.2",
+    "clean-webpack-plugin": "^3.0.0",
+    "copy-webpack-plugin": "^12.0.2",
+    "file-loader": "^6.2.0",
+    "html-webpack-plugin": "^5.3.1",
+    "mini-css-extract-plugin": "^1.6.0",
+    "postcss": "^8.2.14",
+    "postcss-loader": "^5.2.0",
+    "postcss-preset-env": "^10.1.4",
+    "sass": "^1.32.12",
+    "sass-loader": "^11.0.1",
+    "serve": "^14.2.4",
+    "style-loader": "^2.0.0",
+    "terser-webpack-plugin": "^5.1.1",
+    "ts-loader": "^9.1.2",
+    "typescript": "^4.2.4",
+    "webpack": "^5.38.1",
+    "webpack-cli": "^4.7.2",
+    "webpack-dev-server": "^5.2.0"
+  }
+}

webrtc-internals-exporter/webpack/webpack.config.js

@@ -0,0 +1,32 @@
+const path = require('path');
+const { EnvironmentPlugin } = require('webpack');
+
+module.exports = (env) => {
+  const url = env.URL || 'http://localhost';
+
+  return {
+    entry: '../background.js',
+    target: 'web',
+    mode: 'production',
+    module: {
+      rules: [
+        {
+          test: /\.js?$/,
+          use: 'babel-loader',
+          exclude: /node_modules/,
+        },
+      ],
+    },
+    resolve: { extensions: ['.tsx', '.ts', '.js'] },
+    output: {
+      filename: 'background.bundle.js',
+      path: path.resolve(__dirname, '../'),
+      publicPath: '',
+    },
+    plugins: [
+      new EnvironmentPlugin({
+        WEBRTC_INTERNALS_EXPORTER_URL: url,
+      }),
+    ],
+  };
+};