towards webextension working again

packages/taler-wallet-webextension/.gitignore

@@ -0,0 +1 @@
+taler-wallet-*.zip

packages/taler-wallet-webextension/manifest.json

@@ -18,8 +18,8 @@
   },
 
   "icons": {
-    "32": "img/icon.png",
-    "128": "img/logo.png"
+    "32": "static/img/icon.png",
+    "128": "static/img/logo.png"
   },
 
   "permissions": [
@@ -36,14 +36,14 @@
 
   "browser_action": {
     "default_icon": {
-      "32": "img/icon.png"
+      "32": "static/img/icon.png"
     },
     "default_title": "Taler",
-    "default_popup": "popup.html"
+    "default_popup": "static/popup.html"
   },
 
   "background": {
-    "page": "background.html",
+    "page": "static/background.html",
     "persistent": true
   }
 }

packages/taler-wallet-webextension/pack.sh

@@ -0,0 +1,15 @@
+#!/usr/bin/env bash
+
+set -eu
+
+if [[ ! -e package.json ]]; then
+  echo "Please run this from the root of the repo.">&2
+  exit 1
+fi
+
+vers_manifest=$(jq -r '.version' manifest.json)
+
+zipfile="taler-wallet-${vers_manifest}.zip"
+
+rm -f -- "$zipfile"
+zip -r "$zipfile" dist static manifest.json

packages/taler-wallet-webextension/package.json

@@ -9,7 +9,8 @@
   "private": false,
   "scripts": {
     "test": "tsc && ava",
-    "compile": "tsc"
+    "clean": "rimraf dist lib tsconfig.tsbuildinfo",
+    "compile": "tsc && rollup -c"
   },
   "dependencies": {
     "moment": "^2.27.0",
@@ -33,7 +34,9 @@
     "enzyme-adapter-react-16": "^1.15.2",
     "react": "^16.13.1",
     "react-dom": "^16.13.1",
+    "rimraf": "^3.0.2",
     "rollup": "^2.23.0",
+    "rollup-plugin-ignore": "^1.0.9",
     "rollup-plugin-sourcemaps": "^0.6.2",
     "rollup-plugin-terser": "^6.1.0",
     "typescript": "^3.9.7"

packages/taler-wallet-webextension/rollup.config.js

@@ -2,210 +2,96 @@
 import commonjs from "@rollup/plugin-commonjs";
 import nodeResolve from "@rollup/plugin-node-resolve";
 import json from "@rollup/plugin-json";
-import replace from "@rollup/plugin-replace";
 import builtins from "builtin-modules";
-import { terser } from "rollup-plugin-terser";
-import typescript from "@rollup/plugin-typescript";
+import replace from "@rollup/plugin-replace";
+import ignore from "rollup-plugin-ignore"
 
-// Base settings to use
-const baseTypescriptCompilerSettings = {
-  target: "ES6",
-  jsx: "react",
-  reactNamespace: "React",
-  moduleResolution: "node",
-  sourceMap: true,
-  lib: ["es6", "dom"],
-  noImplicitReturns: true,
-  noFallthroughCasesInSwitch: true,
-  strict: true,
-  strictPropertyInitialization: false,
-  noImplicitAny: true,
-  noImplicitThis: true,
-  allowJs: true,
-  checkJs: true,
-  incremental: false,
-  esModuleInterop: true,
-  importHelpers: true,
-  module: "ESNext",
-  include: ["src/**/*.+(ts|tsx)"],
-  rootDir: "./src",
-};
-
-const walletCli = {
-  input: "src/headless/taler-wallet-cli.ts",
-  output: {
-    file: "dist/standalone/taler-wallet-cli.js",
-    format: "cjs",
-  },
-  external: builtins,
-  plugins: [
-    nodeResolve({
-      preferBuiltins: true,
-    }),
-
-    commonjs({
-      include: ["node_modules/**", "dist/node/**"],
-      extensions: [".js", ".ts"],
-      ignoreGlobal: false, // Default: false
-      sourceMap: false,
-      ignore: ["taler-wallet"],
-    }),
-
-    json(),
-    
-    typescript({
-      tsconfig: false,
-      ...baseTypescriptCompilerSettings,
-      sourceMap: false,
-    }),
-  ],
-};
-
-const walletAndroid = {
-  input: "src/android/index.ts",
-  output: {
-    //dir: "dist/standalone",
-    file: "dist/standalone/taler-wallet-android.js",
-    format: "cjs",
-    exports: "named",
-  },
-  external: builtins,
-  plugins: [
-    json(),
-
-    nodeResolve({
-      preferBuiltins: true,
-    }),
-
-    commonjs({
-      include: ["node_modules/**"],
-      extensions: [".js"],
-      sourceMap: false,
-      ignore: ["taler-wallet"],
-    }),
-
-    typescript({
-      tsconfig: false,
-      ...baseTypescriptCompilerSettings,
-      sourceMap: false,
-    }),
-  ],
-};
 
 const webExtensionPageEntryPoint = {
-  input: "src/webex/pageEntryPoint.ts",
+  input: "lib/pageEntryPoint.js",
   output: {
-    file: "dist/webextension/pageEntryPoint.js",
+    file: "dist/pageEntryPoint.js",
     format: "iife",
     exports: "none",
     name: "webExtensionPageEntry",
   },
-  external: builtins,
   plugins: [
     json(),
 
+    ignore(builtins),
+
     nodeResolve({
-      preferBuiltins: true,
+      browser: true,
     }),
 
-    terser(),
+    //terser(),
 
     replace({
       "process.env.NODE_ENV": JSON.stringify("production"),
+      "__filename": "'__webextension__'",
     }),
 
-    commonjs({
-      include: ["node_modules/**", "dist/node/**"],
-      extensions: [".js"],
-      sourceMap: false,
-      ignore: ["taler-wallet"],
-    }),
-
-    typescript({
-      tsconfig: false,
-      ...baseTypescriptCompilerSettings,
-      sourceMap: false,
-    }),
+    commonjs(),
   ],
 };
 
 const webExtensionBackgroundPageScript = {
-  input: "src/webex/background.ts",
+  input: "lib/background.js",
   output: {
-    file: "dist/webextension/background.js",
+    file: "dist/background.js",
     format: "iife",
     exports: "none",
     name: "webExtensionBackgroundScript",
   },
-  external: builtins,
   plugins: [
     json(),
 
+    ignore(builtins),
+
     nodeResolve({
-      preferBuiltins: true,
+      browser: true,
     }),
 
-    terser(),
+    //terser(),
 
     replace({
       "process.env.NODE_ENV": JSON.stringify("production"),
+      "__filename": "'__webextension__'",
     }),
 
-    commonjs({
-      include: ["node_modules/**", "dist/node/**"],
-      extensions: [".js"],
-      sourceMap: false,
-      ignore: ["taler-wallet", "crypto"],
-    }),
-
-    typescript({
-      tsconfig: false,
-      ...baseTypescriptCompilerSettings,
-      sourceMap: false,
-    }),
+    commonjs()
   ],
 };
 
 const webExtensionCryptoWorker = {
-  input: "src/crypto/workers/browserWorkerEntry.ts",
+  input: "lib/browserWorkerEntry.js",
   output: {
-    file: "dist/webextension/browserWorkerEntry.js",
+    file: "dist/browserWorkerEntry.js",
     format: "iife",
     exports: "none",
     name: "webExtensionCryptoWorker",
   },
-  external: builtins,
   plugins: [
     json(),
 
+    ignore(builtins),
+
     nodeResolve({
-      preferBuiltins: true,
+      browser: true,
     }),
 
-    terser(),
+    //terser(),
 
     replace({
       "process.env.NODE_ENV": JSON.stringify("production"),
+      "__filename": "'__webextension__'",
     }),
 
-    commonjs({
-      include: ["node_modules/**", "dist/node/**"],
-      extensions: [".js"],
-      sourceMap: false,
-      ignore: ["taler-wallet", "crypto"],
-    }),
-
-    typescript({
-      tsconfig: false,
-      ...baseTypescriptCompilerSettings,
-      sourceMap: false,
-    }),
+    commonjs(),
   ],
 };
 
 export default [
-  walletCli,
-  walletAndroid,
   webExtensionPageEntryPoint,
   webExtensionBackgroundPageScript,
   webExtensionCryptoWorker,

packages/taler-wallet-webextension/src/browserCryptoWorkerFactory.ts

@@ -24,7 +24,7 @@ import type { CryptoWorker, CryptoWorkerFactory } from "taler-wallet-core";
 export class BrowserCryptoWorkerFactory implements CryptoWorkerFactory {
   startWorker(): CryptoWorker {
     const workerCtor = Worker;
-    const workerPath = "/browserWorkerEntry.js";
+    const workerPath = "/dist/browserWorkerEntry.js";
     return new workerCtor(workerPath) as CryptoWorker;
   }
 

packages/taler-wallet-webextension/src/wxBackend.ts

@@ -496,7 +496,8 @@ function setupHeaderListener(): void {
   // Handlers for catching HTTP requests
   getPermissionsApi().contains(extendedPermissions, (result: boolean) => {
     if (
-      chrome.webRequest.onHeadersReceived &&
+      "webRequest" in chrome &&
+      "onHeadersReceived" in chrome.webRequest &&
       chrome.webRequest.onHeadersReceived.hasListener(headerListener)
     ) {
       chrome.webRequest.onHeadersReceived.removeListener(headerListener);
@@ -509,11 +510,13 @@ function setupHeaderListener(): void {
         ["responseHeaders", "blocking"],
       );
     }
-    chrome.webRequest.handlerBehaviorChanged(() => {
-      if (chrome.runtime.lastError) {
-        console.error(chrome.runtime.lastError);
-      }
-    });
+    if ("webRequest" in chrome) {
+      chrome.webRequest.handlerBehaviorChanged(() => {
+        if (chrome.runtime.lastError) {
+          console.error(chrome.runtime.lastError);
+        }
+      });
+    }
   });
 }
 

packages/taler-wallet-webextension/static/background.html

@@ -2,10 +2,10 @@
 <html lang="en">
   <head>
     <meta charset="UTF-8" />
-    <script src="/background.js"></script>
+    <script src="/dist/background.js"></script>
     <title>(wallet bg page)</title>
   </head>
   <body>
-    <img id="taler-logo" src="/img/icon.png" />
+    <img id="taler-logo" src="/static/img/icon.png" />
   </body>
 </html>

packages/taler-wallet-webextension/tsconfig.json

@@ -3,17 +3,20 @@
         "composite": true,
         "lib": ["es6", "DOM"],
         "jsx": "react",
+        "moduleResolution": "Node",
         "reactNamespace": "React",
-        "module": "commonjs",
-        "target": "es5",
+        "module": "ESNext",
+        "target": "ES6",
         "noImplicitAny": true,
         "outDir": "lib",
-        "declaration": true,
         "noEmitOnError": true,
         "strict": true,
         "incremental": true,
         "sourceMap": true,
-        "esModuleInterop": true
+        "esModuleInterop": true,
+        "importHelpers": true,
+        "rootDir": "./src",
+        "typeRoots": ["./node_modules/@types"]
     },
     "include": ["src/**/*"]
 }

packages/taler-wallet-webextension/webextension/pack.sh

@@ -1,23 +0,0 @@
-#!/usr/bin/env bash
-
-set -eu
-
-if [[ ! -e package.json ]]; then
-  echo "Please run this from the root of the repo.">&2
-  exit 1
-fi
-
-vers_manifest=$(jq -r '.version' webextension/manifest.json)
-
-rm -rf dist/wx
-mkdir -p dist/wx
-cp webextension/manifest.json dist/wx/
-cp -r webextension/static/* dist/wx/
-cp -r dist/webextension/* dist/wx/
-
-cd dist/wx
-
-zipfile="../taler-wallet-${vers_manifest}.zip"
-
-rm -f -- "$zipfile"
-zip -r "$zipfile" ./*

pnpm-lock.yaml

@@ -199,7 +199,9 @@ importers:
       enzyme-adapter-react-16: 1.15.2_df2dc313d8031f8c2dbd009d86ca7fc7
       react: 16.13.1
       react-dom: 16.13.1_react@16.13.1
+      rimraf: 3.0.2
       rollup: 2.23.0
+      rollup-plugin-ignore: 1.0.9
       rollup-plugin-sourcemaps: 0.6.2_1bb4f16ce5b550396581a296af208cfa
       rollup-plugin-terser: 6.1.0_rollup@2.23.0
       typescript: 3.9.7
@@ -221,7 +223,9 @@ importers:
       moment: ^2.27.0
       react: ^16.13.1
       react-dom: ^16.13.1
+      rimraf: ^3.0.2
       rollup: ^2.23.0
+      rollup-plugin-ignore: ^1.0.9
       rollup-plugin-sourcemaps: ^0.6.2
       rollup-plugin-terser: ^6.1.0
       taler-wallet-core: 'workspace:*'
@@ -4109,6 +4113,10 @@ packages:
     hasBin: true
     resolution:
       integrity: sha512-JZkJMZkAGFFPP2YqXZXPbMlMBgsxzE8ILs4lMIX/2o0L9UBw9O/Y3o6wFw/i9YLapcUJWwqbi3kdxIPdC62TIA==
+  /rollup-plugin-ignore/1.0.9:
+    dev: true
+    resolution:
+      integrity: sha512-+Q2jmD4gbO3ByFuljkDEfpEcYvll7J5+ZadUuk/Pu35x2KGrbHxKtt3+s+dPIgXX1mG7zCxG4s/NdRqztR5Ruw==
   /rollup-plugin-sourcemaps/0.6.2_1bb4f16ce5b550396581a296af208cfa:
     dependencies:
       '@rollup/pluginutils': 3.1.0_rollup@2.23.0