[PM-1072] Convert autofill.js to Typescript (#5376)

* Rename autofill.js to ts and update webpack

* Remove wrapping function

* Remove unreachable data-onepassword-title code

* Remove unused post-submit logic

* Run prettier

* Remove unused fake tested code

* Add typing

* Disable certain eslint rules or fix eslint violations

* Update modifications list

* Remove unnecessary/confusing types

* Checkout autofill.js from master

* Add ENV switch for autofill versions

* Rename autofill.ts to avoid confusion

* Use string union type for FillScriptOp

apps/browser/package.json

@@ -6,6 +6,7 @@
     "build:mv3": "cross-env MANIFEST_VERSION=3 webpack",
     "build:watch": "webpack --watch",
     "build:watch:mv3": "cross-env MANIFEST_VERSION=3 webpack --watch",
+    "build:watch:autofill": "cross-env AUTOFILL_VERSION=2 webpack --watch",
     "build:prod": "cross-env NODE_ENV=production webpack",
     "build:prod:watch": "cross-env NODE_ENV=production webpack --watch",
     "dist": "npm run build:prod && gulp dist",

apps/browser/src/autofill/models/autofill-script.ts

@@ -1,12 +1,27 @@
+// String values affect code flow in autofill.ts and must not be changed
+export type FillScriptOp = "click_on_opid" | "focus_by_opid" | "fill_by_opid" | "delay";
+
+export type FillScript = [op: FillScriptOp, opid: string, value?: string];
+
+export type AutofillScriptOptions = {
+  animate?: boolean;
+  markFilling?: boolean;
+};
+
+export type AutofillScriptProperties = {
+  delay_between_operations?: number;
+};
+
 export default class AutofillScript {
-  script: string[][] = [];
-  documentUUID: any = {};
-  properties: any = {};
-  options: any = {};
-  metadata: any = {};
-  autosubmit: any = null;
+  script: FillScript[] = [];
+  documentUUID = "";
+  properties: AutofillScriptProperties = {};
+  options: AutofillScriptOptions = {};
+  metadata: any = {}; // Unused, not written or read
+  autosubmit: any = null; // Appears to be unused, read but not written
   savedUrls: string[];
   untrustedIframe: boolean;
+  itemType: string; // Appears to be unused, read but not written
 
   constructor(documentUUID: string) {
     this.documentUUID = documentUUID;

apps/browser/webpack.config.js

@@ -14,8 +14,10 @@ if (process.env.NODE_ENV == null) {
 }
 const ENV = (process.env.ENV = process.env.NODE_ENV);
 const manifestVersion = process.env.MANIFEST_VERSION == 3 ? 3 : 2;
+const autofillVersion = process.env.AUTOFILL_VERSION == 2 ? 2 : 1;
 
 console.log(`Building Manifest Version ${manifestVersion} app`);
+console.log(`Using Autofill v${autofillVersion}`);
 const envConfig = configurator.load(ENV);
 configurator.log(envConfig);
 
@@ -141,7 +143,6 @@ const mainConfig = {
   entry: {
     "popup/polyfills": "./src/popup/polyfills.ts",
     "popup/main": "./src/popup/main.ts",
-    "content/autofill": "./src/autofill/content/autofill.js",
     "content/autofiller": "./src/autofill/content/autofiller.ts",
     "content/notificationBar": "./src/autofill/content/notification-bar.ts",
     "content/contextMenuHandler": "./src/autofill/content/context-menu-handler.ts",
@@ -301,4 +302,12 @@ if (manifestVersion == 2) {
   configs.push(backgroundConfig);
 }
 
+if (autofillVersion == 2) {
+  // Typescript refactors (WIP)
+  mainConfig.entry["content/autofill"] = "./src/autofill/content/autofillv2.ts";
+} else {
+  // Javascript (used in production)
+  mainConfig.entry["content/autofill"] = "./src/autofill/content/autofill.js";
+}
+
 module.exports = configs;