Browse Source

feat: handle dialog block no longer need debug mode

Ahmad Kholid 3 years ago
parent
commit
cffefb26b4

+ 49 - 29
src/background/workflowEngine/blocksHandler/handlerHandleDialog.js

@@ -1,38 +1,58 @@
 import { getBlockConnection, sendDebugCommand } from '../helper';
 
-function handleDialog({ data, outputs }) {
-  const nextBlockId = getBlockConnection({ outputs });
+const overwriteDialog = (accept, promptText) => `
+  const realConfirm = window.confirm;
+  window.confirm = function() {
+    return ${accept};
+  };
 
-  return new Promise((resolve, reject) => {
-    if (BROWSER_TYPE !== 'chrome') {
-      const error = new Error('log.messages.browser-not-supported');
-      error.data = { browser: BROWSER_TYPE };
+  const realAlert = window.alert;
+  window.alert = function() {
+    return ${accept};
+  };
 
-      reject(error);
-      return;
-    }
-    if (!this.settings.debugMode) {
-      const error = new Error('not-debug-mode');
-      error.nextBlockId = nextBlockId;
+  const realPrompt = window.prompt;
+  window.prompt = function() {
+    return ${accept} ? "${promptText}" : null;
+  }
+`;
 
-      reject(error);
-      return;
-    }
+function handleDialog({ data, outputs, id: blockId }) {
+  const nextBlockId = getBlockConnection({ outputs });
+
+  return new Promise((resolve) => {
+    if (!this.settings.debugMode || BROWSER_TYPE !== 'chrome') {
+      const isScriptExist = this.preloadScripts.find(
+        ({ id }) => id === blockId
+      );
+
+      if (!isScriptExist) {
+        this.preloadScripts.push({
+          id: blockId,
+          isBlock: true,
+          name: 'javascript-code',
+          data: {
+            everyNewTab: true,
+            code: overwriteDialog(data.accept, data.promptText),
+          },
+        });
+      }
+    } else {
+      this.dialogParams = {
+        accept: data.accept,
+        promptText: data.promptText,
+      };
 
-    this.dialogParams = {
-      accept: data.accept,
-      promptText: data.promptText,
-    };
-
-    const methodName = 'Page.javascriptDialogOpening';
-    if (!this.engine.eventListeners[methodName]) {
-      this.engine.on(methodName, () => {
-        sendDebugCommand(
-          this.activeTab.id,
-          'Page.handleJavaScriptDialog',
-          this.dialogParams
-        );
-      });
+      const methodName = 'Page.javascriptDialogOpening';
+      if (!this.engine.eventListeners[methodName]) {
+        this.engine.on(methodName, () => {
+          sendDebugCommand(
+            this.activeTab.id,
+            'Page.handleJavaScriptDialog',
+            this.dialogParams
+          );
+        });
+      }
     }
 
     resolve({

+ 18 - 27
src/components/newtab/workflow/edit/EditHandleDialog.vue

@@ -6,33 +6,25 @@
       :placeholder="t('common.description')"
       @change="updateData({ description: $event })"
     />
-    <p
-      v-if="browserType !== 'chrome'"
-      class="text-sm leading-tight text-red-400 dark:text-red-300 mt-4"
+    <ui-checkbox
+      :model-value="data.accept"
+      block
+      class="mt-4"
+      @change="updateData({ accept: $event })"
     >
-      {{ t('log.messages.browser-not-supported', { browser: browserType }) }}
-    </p>
-    <template v-else>
-      <ui-checkbox
-        :model-value="data.accept"
-        block
-        class="mt-4"
-        @change="updateData({ accept: $event })"
-      >
-        {{ t('workflow.blocks.handle-dialog.accept') }}
-      </ui-checkbox>
-      <edit-autocomplete v-if="data.accept" class="mt-1">
-        <ui-input
-          :model-value="data.promptText"
-          :label="t('workflow.blocks.handle-dialog.promptText.label')"
-          :title="t('workflow.blocks.handle-dialog.promptText.description')"
-          autocomplete="off"
-          placeholder="Text"
-          class="w-full"
-          @change="updateData({ promptText: $event })"
-        />
-      </edit-autocomplete>
-    </template>
+      {{ t('workflow.blocks.handle-dialog.accept') }}
+    </ui-checkbox>
+    <edit-autocomplete v-if="data.accept" class="mt-1">
+      <ui-input
+        :model-value="data.promptText"
+        :label="t('workflow.blocks.handle-dialog.promptText.label')"
+        :title="t('workflow.blocks.handle-dialog.promptText.description')"
+        autocomplete="off"
+        placeholder="Text"
+        class="w-full"
+        @change="updateData({ promptText: $event })"
+      />
+    </edit-autocomplete>
   </div>
 </template>
 <script setup>
@@ -48,7 +40,6 @@ const props = defineProps({
 const emit = defineEmits(['update:data']);
 
 const { t } = useI18n();
-const browserType = BROWSER_TYPE;
 
 function updateData(value) {
   emit('update:data', { ...props.data, ...value });

+ 6 - 5
src/content/blocksHandler/handlerJavascriptCode.js

@@ -2,7 +2,7 @@ import { sendMessage } from '@/utils/message';
 import { automaRefDataStr } from '../utils';
 
 function getAutomaScript(blockId, everyNewTab) {
-  const str = `
+  let str = `
 function automaSetVariable(name, value) {
   const data = JSON.parse(sessionStorage.getItem('automa--${blockId}')) || null;
 
@@ -20,17 +20,19 @@ function automaResetTimeout() {
 ${automaRefDataStr(blockId)}
   `;
 
-  if (everyNewTab) return '';
+  if (everyNewTab) str = automaRefDataStr(blockId);
 
   return str;
 }
 
 function javascriptCode(block) {
-  if (!block.data.everyNewTab)
+  if (!block.data.everyNewTab) {
     sessionStorage.setItem(
       `automa--${block.id}`,
       JSON.stringify(block.refData)
     );
+  }
+
   const automaScript = getAutomaScript(block.id, block.data.everyNewTab);
 
   return new Promise((resolve, reject) => {
@@ -60,7 +62,7 @@ function javascriptCode(block) {
     }
 
     const promisePreloadScripts =
-      block.data?.preloadScripts.map(async (item) => {
+      block.data?.preloadScripts?.map(async (item) => {
         try {
           const { protocol, pathname } = new URL(item.src);
           const isValidUrl = /https?/.test(protocol) && /\.js$/.test(pathname);
@@ -139,7 +141,6 @@ function javascriptCode(block) {
       } else {
         resolve();
       }
-
       documentCtx.body.appendChild(script);
     });
   });