merge branch

src/background/workflow-engine/blocks-handler.js

@@ -1,12 +1,25 @@
 import { toCamelCase } from '@/utils/helper';
 
 const blocksHandler = require.context('./blocks-handler', false, /\.js$/);
-const handlers = blocksHandler.keys().reduce((acc, key) => {
-  const name = key.replace(/^\.\/handler-|\.js/g, '');
+const handlers = blocksHandler.keys().reduce(
+  (acc, fileName) => {
+    const isDebugHandler = fileName.includes('.debug');
+    const name = toCamelCase(
+      fileName.replace(/^\.\/handler-|\.debug|\.js/g, '')
+    );
 
-  acc[toCamelCase(name)] = blocksHandler(key).default;
+    const blockKey = toCamelCase(name);
+    const handler = blocksHandler(fileName).default;
 
-  return acc;
-}, {});
+    if (isDebugHandler) {
+      acc.debug[blockKey] = handler;
+    } else {
+      acc[blockKey] = handler;
+    }
+
+    return acc;
+  },
+  { debug: {} }
+);
 
 export default handlers;

src/background/workflow-engine/blocks-handler/handler-new-tab.js

@@ -1,5 +1,5 @@
 import browser from 'webextension-polyfill';
-import { getBlockConnection } from '../helper';
+import { getBlockConnection, attachDebugger } from '../helper';
 import { isWhitespace } from '@/utils/helper';
 
 async function newTab(block) {
@@ -40,6 +40,10 @@ async function newTab(block) {
 
     this.activeTab.url = url;
     if (tab) {
+      if (this.isDebugMode) {
+        await attachDebugger(tab.id, this.activeTab.id);
+      }
+
       this.activeTab.id = tab.id;
       this.windowId = tab.windowId;
     }

src/background/workflow-engine/engine.js

@@ -18,6 +18,7 @@ class WorkflowEngine {
     this.blocksHandler = blocksHandler;
     this.parentWorkflow = parentWorkflow;
     this.saveLog = workflow.settings?.saveLog ?? true;
+    this.isDebugMode = workflow.settings?.debugMode ?? false;
 
     this.loopList = {};
     this.repeatedTasks = {};
@@ -292,11 +293,18 @@ class WorkflowEngine {
     this.dispatchEvent('update', { state: this.state });
 
     const startExecutedTime = Date.now();
-    const blockHandler = this.blocksHandler[toCamelCase(block?.name)];
-    const handler =
-      !blockHandler && tasks[block.name].category === 'interaction'
-        ? this.blocksHandler.interactionBlock
-        : blockHandler;
+    const blockName = toCamelCase(block.name);
+    const isInteractionBlock = tasks[block.name].category === 'interaction';
+
+    const blockHandler = this.blocksHandler[blockName];
+    const debugBlockHandler = this.blocksHandler.debug[blockName];
+    let handler = blockHandler;
+
+    if (this.isDebugMode && debugBlockHandler) {
+      handler = debugBlockHandler;
+    } else if (!blockHandler && isInteractionBlock) {
+      handler = this.blocksHandler.interactionBlock;
+    }
 
     if (!handler) {
       console.error(`"${block.name}" block doesn't have a handler`);

src/background/workflow-engine/helper.js

@@ -1,3 +1,17 @@
+export function sendDebugCommand(tabId, method, params = {}) {
+  return new Promise((resolve) => {
+    chrome.debugger.sendCommand(tabId, method, params, resolve);
+  });
+}
+
+export function attachDebugger(tabId, prevTab) {
+  return new Promise((resolve) => {
+    if (prevTab) chrome.debugger.detach({ tabId: prevTab });
+
+    chrome.debugger.attach({ tabId }, '1.3', resolve);
+  });
+}
+
 export function waitTabLoaded(tabId) {
   return new Promise((resolve, reject) => {
     const activeTabStatus = () => {

src/components/newtab/workflow/WorkflowSettings.vue

@@ -23,7 +23,7 @@
         class="w-full max-w-sm"
       />
     </div>
-    <div v-if="false" class="flex mt-6">
+    <div class="flex mt-6">
       <ui-switch v-model="settings.debugMode" class="mr-4" />
       <p class="capitalize">{{ t('workflow.settings.debugMode') }}</p>
     </div>

src/manifest.json

@@ -55,6 +55,7 @@
     "proxy",
     "alarms",
     "storage",
+    "debugger",
     "webNavigation",
     "unlimitedStorage",
     "<all_urls>"

src/utils/data-exporter.js

@@ -56,7 +56,7 @@ export default function (data, { name, type, addBOMHeader }, converted) {
 
   const payload = [result];
 
-  if (addBOMHeader) {
+  if (type === 'csv' && addBOMHeader) {
     payload.unshift(new Uint8Array([0xef, 0xbb, 0xbf]));
   }