Merge pull request #2 from arpitchakladar/dev/porting-to-firefox

Dev/implementing OCR for captcha autofill

15 files changed, 127 insertions, 86 deletions

diff --git a/config/webpack.config.js b/config/webpack.config.js
index 70b87ca..8fd3f15 100644
--- a/config/webpack.config.js
+++ b/config/webpack.config.js
@@ -1,27 +1,29 @@
-const path = require("path");
-const fs = require("fs");
-const webpack = require("webpack");
-const { merge } = require("webpack-merge");
-const CopyPlugin = require("copy-webpack-plugin");
+import path from "path";
+import fs from "fs";
+import { fileURLToPath } from "url";
+import webpack from "webpack";
+import { merge } from "webpack-merge";
+import CopyPlugin from "copy-webpack-plugin";
+
+const __filename = fileURLToPath(import.meta.url);
+const __dirname = path.dirname(__filename);
 
 global.ROOT_DIR = path.resolve(__dirname, "..");
 global.CONFIG_DIR = path.resolve(ROOT_DIR, "config");
 global.SOURCE_DIR = path.resolve(ROOT_DIR, "src");
 global.production = process.env.NODE_ENV === "production";
 
-global.webpackRequire = modulePath => require(path.resolve(CONFIG_DIR, "webpack", modulePath));
-
-const CreateManifestPlugin = webpackRequire("plugins/create-manifest-webpack-plugin");
-const CreateRulesPlugin = webpackRequire("plugins/create-rules-webpack-plugin");
-const InjectScriptPlugin = webpackRequire("plugins/inject-script-webpack-plugin");
-const CreateInjectedSharedModulesPlugin = webpackRequire("plugins/create-injected-shared-modules-webpack-plugin");
+import CreateManifestPlugin from "./webpack/plugins/create-manifest-webpack-plugin/index.js";
+import CreateRulesPlugin from "./webpack/plugins/create-rules-webpack-plugin.js";
+import InjectScriptPlugin from "./webpack/plugins/inject-script-webpack-plugin.js";
+import CreateInjectedSharedModulesPlugin from "./webpack/plugins/create-injected-shared-modules-webpack-plugin.js";
 
-const { inlineJavascript } = webpackRequire("utils/inline-javascript");
-const { getScriptRuntimeFromType } = webpackRequire("utils/script-runtime");
-const { getFileName } = webpackRequire("utils/build-file");
+import { inlineJavascript } from "./webpack/utils/inline-javascript.js";
+import { getScriptRuntimeFromType } from "./webpack/utils/script-runtime.js";
+import { getFileName } from "./webpack/utils/build-file.js";
 
-const scripts = webpackRequire("utils/scripts");
-const sharedModules = webpackRequire("utils/shared-modules");
+import scripts from "./webpack/utils/scripts.js";
+import sharedModules from "./webpack/utils/shared-modules.js";
 
 const sharedModulesImportedCount = {};
 
@@ -35,12 +37,21 @@ for (const sharedModule of sharedModules) {
 	injectedSharedModulesImportedCount[sharedModule] = 0;
 }
 
+const backgroundScriptEntries = {};
 const uninjectedScriptEntries = {};
 const injectedAfterScriptEntries = {};
 const injectedBeforeScriptEntries = {};
 const sharedModuleEntries = {};
 const sharedModuleExternals = {};
 
+const backgroundScriptImports = fs.readdirSync(path.resolve(SOURCE_DIR, "background"))
+	.map(scriptName => `import "${path.resolve(SOURCE_DIR, "background", scriptName)}";`)
+	.join("\n");
+backgroundScriptEntries["background script"] = {
+	import: inlineJavascript(backgroundScriptImports),
+	filename: "background.js"
+};
+
 for (const scriptPath in scripts) {
 	for (const scriptType in scripts[scriptPath]) {
 		const currentScripts = scripts[scriptPath][scriptType];
@@ -84,8 +95,8 @@ const commonOptions = {
 	resolve: {
 		extensions: [".ts", ".js", ".html"],
 		alias: {
-			"@": global.SOURCE_DIR
-		}
+			"@": global.SOURCE_DIR,
+		},
 	},
 	module: {
 		rules: [
@@ -93,27 +104,27 @@ const commonOptions = {
 				test: /\.ts$/,
 				loader: "ts-loader",
 				options: {
-					configFile: "config/tsconfig.json"
+					configFile: "config/tsconfig.json",
 				}
 			},
 			{
 				test: /\.html$/,
-				loader: path.resolve(CONFIG_DIR, "webpack/loader/to-string-loader.js")
-			}
-		]
+				loader: path.resolve(CONFIG_DIR, "webpack/loader/to-string-loader.js"),
+			},
+		],
 	},
 	optimization: {
 		minimize: process.env.NODE_ENV === "production",
-		runtimeChunk: false
+		runtimeChunk: false,
 	},
 	output: {
-		iife: true
+		iife: true,
 	},
 	plugins: [
 		new webpack.optimize.LimitChunkCountPlugin({
-			maxChunks: 1
-		})
-	]
+			maxChunks: 1,
+		}),
+	],
 };
 
 const sharedModuleOptions = {
@@ -125,14 +136,22 @@ const sharedModuleOptions = {
 				test: /banglar-bhumi-utils\/src\/.*.(^.?|\.[^d]|[^.]d|[^.][^d])\.(t|j)s$/,
 				loader: path.resolve(CONFIG_DIR, "webpack/loader/count-imports-loader.js"),
 				options: {
-					sharedModulesImportedCount
+					sharedModulesImportedCount,
 				},
-				enforce: "post"
+				enforce: "post",
 			}
 		]
 	}
 };
 
+const backgroundScriptConfiguration = merge(
+	commonOptions,
+	sharedModuleOptions,
+	{
+		entry: backgroundScriptEntries,
+	},
+);
+
 const uninjectedScriptConfiguration = merge(
 	commonOptions,
 	sharedModuleOptions,
@@ -174,10 +193,16 @@ const sharedModulesConfiguration = merge(
 		entry: sharedModuleEntries,
 		plugins: [
 			new CopyPlugin({
-				patterns: [{
-					from: path.resolve(ROOT_DIR, "static"),
-					to: "./"
-				}]
+				patterns: [
+					{
+						from: path.resolve("static"),
+						to: "./",
+					},
+					{
+						from: path.resolve("src/offscreen"),
+						to: "./offscreen",
+					},
+				],
 			}),
 			new CreateInjectedSharedModulesPlugin({
 				injectedSharedModulesImportedCount,
@@ -205,7 +230,8 @@ const sharedModulesConfiguration = merge(
 	}
 );
 
-module.exports = [
+export default [
+	backgroundScriptConfiguration,
 	uninjectedScriptConfiguration,
 	injectedScriptConfiguration,
 	sharedModulesConfiguration
diff --git a/config/webpack/loader/arrange-shared-module-loader.js b/config/webpack/loader/arrange-shared-module-loader.js
index 1669a64..2265185 100644
--- a/config/webpack/loader/arrange-shared-module-loader.js
+++ b/config/webpack/loader/arrange-shared-module-loader.js
@@ -1,10 +1,9 @@
-const path = require("path");
+import path from "path";
+import { ImportManager } from "import-manager";
 
-const { ImportManager } = require("import-manager");
+import sharedModules from "../utils/shared-modules.js";
 
-const sharedModules = webpackRequire("utils/shared-modules.js");
-
-module.exports = function(source) {
+export default function(source) {
 	const currentSharedModuleName = path.basename(this.resourcePath.substring(0, this.resourcePath.length - 3));
 
 	if (sharedModules.includes(currentSharedModuleName)) {
diff --git a/config/webpack/loader/count-imports-loader.js b/config/webpack/loader/count-imports-loader.js
index 4c3faa4..2586332 100644
--- a/config/webpack/loader/count-imports-loader.js
+++ b/config/webpack/loader/count-imports-loader.js
@@ -1,8 +1,7 @@
-const { ImportManager } = require("import-manager");
+import { ImportManager } from "import-manager";
+import sharedModules from "../utils/shared-modules.js";
 
-const sharedModules = webpackRequire("utils/shared-modules.js");
-
-module.exports = function(source) {
+export default function(source) {
 	const { sharedModulesImportedCount } = this.getOptions();
 	const manager = new ImportManager(source);
 
diff --git a/config/webpack/loader/to-string-loader.js b/config/webpack/loader/to-string-loader.js
index cf26b28..248574a 100644
--- a/config/webpack/loader/to-string-loader.js
+++ b/config/webpack/loader/to-string-loader.js
@@ -1,4 +1,4 @@
-module.exports = function(source) {
+export default function(source) {
 	source = source
 		.replaceAll("\\", "\\\\")
 		.replaceAll("`","\\`")
diff --git a/config/webpack/plugins/create-injected-shared-modules-webpack-plugin.js b/config/webpack/plugins/create-injected-shared-modules-webpack-plugin.js
index aa076b8..695d4ef 100644
--- a/config/webpack/plugins/create-injected-shared-modules-webpack-plugin.js
+++ b/config/webpack/plugins/create-injected-shared-modules-webpack-plugin.js
@@ -1,8 +1,8 @@
-const path = require("path");
-const fs = require("fs");
-const { sources } = require("webpack");
+import path from "path";
+import fs from "fs";
+import webpack from "webpack";
 
-const { getFileName } = webpackRequire("utils/build-file");
+import { getFileName } from "../utils/build-file.js";
 
 class CreateInjectedSharedModulesPlugin {
 	constructor({ injectedSharedModulesImportedCount, sortedSharedModules }) {
@@ -29,7 +29,7 @@ class CreateInjectedSharedModulesPlugin {
 							.join("");
 						compilation.emitAsset(
 							`shared/${getFileName("injected-shared-modules", "shared")}.js`,
-							new sources.RawSource(injectionCode)
+							new webpack.sources.RawSource(injectionCode)
 						);
 					}
 				}
@@ -38,4 +38,4 @@ class CreateInjectedSharedModulesPlugin {
 	}
 }
 
-module.exports = CreateInjectedSharedModulesPlugin;
+export default CreateInjectedSharedModulesPlugin;
diff --git a/config/webpack/plugins/create-manifest-webpack-plugin/index.js b/config/webpack/plugins/create-manifest-webpack-plugin/index.js
index 8dc0ae4..6f1e2be 100644
--- a/config/webpack/plugins/create-manifest-webpack-plugin/index.js
+++ b/config/webpack/plugins/create-manifest-webpack-plugin/index.js
@@ -1,10 +1,15 @@
-const { sources } = require("webpack");
-const path = require("path");
-
-const { getScriptRuntimeFromType } = webpackRequire("utils/script-runtime");
-const { getFileName } = webpackRequire("utils/build-file");
-const scripts = webpackRequire("utils/scripts");
-const manifest = webpackRequire("plugins/create-manifest-webpack-plugin/manifest-template.json");
+import webpack from "webpack";
+import path from "path";
+import fs from "fs";
+
+import { getScriptRuntimeFromType } from "../../utils/script-runtime.js";
+import { getFileName } from "../../utils/build-file.js";
+import scripts from "../../utils/scripts.js";
+const manifest = JSON.parse(
+	fs.readFileSync(
+		path.resolve("config/webpack/plugins/create-manifest-webpack-plugin/manifest-template.json"),
+	),
+);
 
 class CreateManifestPlugin {
 	constructor({ sharedModulesImportedCount, injectedSharedModulesImportedCount, sortedSharedModules }) {
@@ -21,7 +26,7 @@ class CreateManifestPlugin {
 					stage: compiler.webpack.Compilation.PROCESS_ASSETS_STAGE_ADDITIONAL
 				},
 				assets => {
-					manifest.version = require(path.resolve(ROOT_DIR, "package.json")).version;
+					manifest.version = JSON.parse(fs.readFileSync((path.resolve(ROOT_DIR, "package.json")))).version;
 					manifest.content_scripts = [];
 					let resources = [];
 
@@ -97,9 +102,11 @@ class CreateManifestPlugin {
 						];
 					}
 
+					manifest.background = { service_worker: "background.js" };
+
 					compilation.emitAsset(
 						"manifest.json",
-						new sources.RawSource(
+						new webpack.sources.RawSource(
 							JSON.stringify(
 								manifest,
 								undefined,
@@ -115,4 +122,5 @@ class CreateManifestPlugin {
 	}
 }
 
-module.exports = CreateManifestPlugin;
+export default CreateManifestPlugin;
+
diff --git a/config/webpack/plugins/create-manifest-webpack-plugin/manifest-template.json b/config/webpack/plugins/create-manifest-webpack-plugin/manifest-template.json
index d1d29f4..52496b6 100644
--- a/config/webpack/plugins/create-manifest-webpack-plugin/manifest-template.json
+++ b/config/webpack/plugins/create-manifest-webpack-plugin/manifest-template.json
@@ -1,7 +1,7 @@
 {
 	"manifest_version": 3,
 	"name": "Banglar Bhumi Utils",
-	"permissions": ["scripting", "declarativeNetRequest"],
+	"permissions": ["offscreen", "scripting", "declarativeNetRequest"],
 	"description": "A chrome extension to improve functionality of the banglarbhumi.gov.in website.",
 	"icons": {
 		"512": "icon512.png"
@@ -12,5 +12,8 @@
 			"enabled": true,
 			"path": "rules.json"
 		}]
+	},
+	"content_security_policy": {
+		"extension_pages": "script-src 'self' 'wasm-unsafe-eval'; object-src 'self';"
 	}
 }
diff --git a/config/webpack/plugins/create-rules-webpack-plugin.js b/config/webpack/plugins/create-rules-webpack-plugin.js
index 6e31196..5573ddf 100644
--- a/config/webpack/plugins/create-rules-webpack-plugin.js
+++ b/config/webpack/plugins/create-rules-webpack-plugin.js
@@ -1,6 +1,6 @@
-const path = require("path");
-const fs = require("fs");
-const { sources } = require("webpack");
+import path from "path";
+import fs from "fs";
+import webpack from "webpack";
 
 class CreateRulesPlugin {
 	apply(compiler) {
@@ -16,7 +16,7 @@ class CreateRulesPlugin {
 					let ruleId = 1;
 
 					for (const ruleFileName of ruleFileNames) {
-						const rule = require(path.resolve(SOURCE_DIR, "rules", ruleFileName));
+						const rule = JSON.parse(fs.readFileSync(path.resolve("src/rules", ruleFileName)));
 
 						if (rule instanceof Array) {
 							for (const currentRule of rule) {
@@ -31,7 +31,7 @@ class CreateRulesPlugin {
 
 					compilation.emitAsset(
 						"rules.json",
-						new sources.RawSource(
+						new webpack.sources.RawSource(
 							JSON.stringify(
 								rules,
 								undefined,
@@ -47,4 +47,4 @@ class CreateRulesPlugin {
 	}
 }
 
-module.exports = CreateRulesPlugin;
+export default CreateRulesPlugin;
diff --git a/config/webpack/plugins/inject-script-webpack-plugin.js b/config/webpack/plugins/inject-script-webpack-plugin.js
index 25b1dc6..2b60022 100644
--- a/config/webpack/plugins/inject-script-webpack-plugin.js
+++ b/config/webpack/plugins/inject-script-webpack-plugin.js
@@ -1,8 +1,8 @@
-const { sources } = require("webpack");
-const path = require("path");
+import webpack from "webpack";
+import path from "path";
 
-const { getFileName } = webpackRequire("utils/build-file");
-const { getInjectedCode } = webpackRequire("utils/injected-code");
+import { getFileName } from "../utils/build-file.js";
+import { getInjectedCode } from "../utils/injected-code.js";
 
 class InjectScriptPlugin {
 	apply(compiler) {
@@ -20,9 +20,9 @@ class InjectScriptPlugin {
 							const scriptInjectorModuleName = getFileName("script-injector", "shared", true);
 							compilation.updateAsset(
 								assetName,
-								new sources.RawSource(injectedCodeResponse[0])
+								new webpack.sources.RawSource(injectedCodeResponse[0])
 							);
-							assets["scripts/" + path.basename(assetName)] = new sources.RawSource(
+							assets["scripts/" + path.basename(assetName)] = new webpack.sources.RawSource(
 								`$${scriptInjectorModuleName}.injectScriptHead("scripts/injected/${path.basename(assetName)}", ${injectedCodeResponse[1]});`
 							);
 						}
@@ -33,4 +33,4 @@ class InjectScriptPlugin {
 	}
 }
 
-module.exports = InjectScriptPlugin;
+export default InjectScriptPlugin;
diff --git a/config/webpack/utils/build-file.js b/config/webpack/utils/build-file.js
index 2ab8d86..6945911 100644
--- a/config/webpack/utils/build-file.js
+++ b/config/webpack/utils/build-file.js
@@ -1,6 +1,6 @@
-const crypto = require("crypto");
+import crypto from "crypto";
 
-module.exports.getFileName = (fileName, prefix, justHash = false) => {
+export const getFileName = (fileName, prefix, justHash = false) => {
 	let hash = crypto
 		.createHash("md5")
 		.update(`${prefix}-${fileName}`)
diff --git a/config/webpack/utils/injected-code.js b/config/webpack/utils/injected-code.js
index a4f88ac..a2884f6 100644
--- a/config/webpack/utils/injected-code.js
+++ b/config/webpack/utils/injected-code.js
@@ -1,4 +1,4 @@
-const crypto = require("crypto");
+import crypto from "crypto";
 
 const getHash = url =>
 	crypto
@@ -7,7 +7,7 @@ const getHash = url =>
 		.digest("hex")
 		.substring(16);
 
-module.exports.getInjectedCode = code => {
+export const getInjectedCode = code => {
 	const extensionAssets = {};
 	let i = 0;
 
diff --git a/config/webpack/utils/inline-javascript.js b/config/webpack/utils/inline-javascript.js
index ea344a4..456dc11 100644
--- a/config/webpack/utils/inline-javascript.js
+++ b/config/webpack/utils/inline-javascript.js
@@ -1 +1 @@
-module.exports.inlineJavascript = code => `data:text/javascript;base64,${Buffer.from(code).toString("base64")}`;
+export const inlineJavascript = code => `data:text/javascript;base64,${Buffer.from(code).toString("base64")}`;
diff --git a/config/webpack/utils/script-runtime.js b/config/webpack/utils/script-runtime.js
index a89d4b8..a7c02f7 100644
--- a/config/webpack/utils/script-runtime.js
+++ b/config/webpack/utils/script-runtime.js
@@ -1,4 +1,4 @@
-module.exports.getScriptRuntimeFromType = scriptType => {
+export const getScriptRuntimeFromType = scriptType => {
 	switch (scriptType) {
 		case "before":
 		case "injected-after":
diff --git a/config/webpack/utils/scripts.js b/config/webpack/utils/scripts.js
index 427aaab..af58e0a 100644
--- a/config/webpack/utils/scripts.js
+++ b/config/webpack/utils/scripts.js
@@ -1,5 +1,11 @@
-const path = require("path");
-const scripts = require(path.resolve(SOURCE_DIR, "scripts.json"));
+import path from "path";
+import fs from "fs";
+
+const scripts = JSON.parse(
+	fs.readFileSync(
+		path.resolve("./src/scripts.json"),
+	),
+);
 
 const formattedScripts = {};
 
@@ -14,4 +20,4 @@ for (const scriptType in scripts) {
 	}
 }
 
-module.exports = formattedScripts;
+export default formattedScripts;
diff --git a/config/webpack/utils/shared-modules.js b/config/webpack/utils/shared-modules.js
index 1584f0f..2b16fa5 100644
--- a/config/webpack/utils/shared-modules.js
+++ b/config/webpack/utils/shared-modules.js
@@ -1,6 +1,6 @@
-const path = require("path");
-const fs = require("fs");
+import path from "path";
+import fs from "fs";
 
-module.exports = fs.readdirSync(path.resolve(SOURCE_DIR, "shared"))
+export default fs.readdirSync(path.resolve("src/shared"))
 	.filter(sharedModule => !sharedModule.endsWith("import-shared.js"))
 	.map(sharedModule => sharedModule.substring(0, sharedModule.length - 3));