feat: block delay option in workflow setting

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

@@ -55,7 +55,6 @@ async function interactionHandler(block, prevBlockData) {
       name: block.name,
       selector: block.data.selector,
     };
-    console.dir(error);
 
     throw error;
   }

src/background/workflow-engine/engine.js

@@ -333,6 +333,8 @@ class WorkflowEngine {
         : blockHandler;
 
     if (handler) {
+      const blockDelay =
+        block.name === 'trigger' ? 0 : this.workflow.settings?.blockDelay || 0;
       const replacedBlock = referenceData(block, {
         prevBlockData,
         data: this.data,
@@ -354,7 +356,9 @@ class WorkflowEngine {
           });
 
           if (result.nextBlockId) {
-            this._blockHandler(this.blocks[result.nextBlockId], result.data);
+            setTimeout(() => {
+              this._blockHandler(this.blocks[result.nextBlockId], result.data);
+            }, blockDelay);
           } else {
             this.addLog({
               type: 'finish',
@@ -376,10 +380,12 @@ class WorkflowEngine {
             this.workflow.settings.onError === 'keep-running' &&
             error.nextBlockId
           ) {
-            this._blockHandler(
-              this.blocks[error.nextBlockId],
-              error.data || ''
-            );
+            setTimeout(() => {
+              this._blockHandler(
+                this.blocks[error.nextBlockId],
+                error.data || ''
+              );
+            }, blockDelay);
           } else {
             this.destroy('error', error.message);
           }

src/components/newtab/workflow/WorkflowSettings.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="workflow-settings">
-    <div class="mb-4">
+    <div class="mb-6">
       <p class="mb-1">{{ t('workflow.settings.onError.title') }}</p>
       <div class="space-x-4">
         <ui-radio
@@ -15,14 +15,29 @@
         </ui-radio>
       </div>
     </div>
-    <div>
+    <div class="mb-6">
       <p class="mb-1">{{ t('workflow.settings.timeout.title') }}</p>
       <ui-input
         :model-value="workflow.settings.timeout"
         type="number"
+        class="w-full max-w-sm"
         @change="updateWorkflow({ timeout: +$event })"
       />
     </div>
+    <div>
+      <p class="mb-1">
+        {{ t('workflow.settings.blockDelay.title') }}
+        <span :title="t('workflow.settings.blockDelay.description')">
+          &#128712;
+        </span>
+      </p>
+      <ui-input
+        :model-value="workflow.settings.blockDelay"
+        type="number"
+        class="w-full max-w-sm"
+        @change="updateWorkflow({ blockDelay: +$event })"
+      />
+    </div>
   </div>
 </template>
 <script setup>

src/locales/en/newtab.json

@@ -47,7 +47,11 @@
       },
       "timeout": {
         "title": "Workflow timeout (milliseconds)"
-      }
+      },
+      "blockDelay": {
+        "title": "Block delay (milliseconds)",
+        "description": "Add delay before executing each of the blocks"
+      },
     }
   },
   "collection": {

src/models/workflow.js

@@ -24,6 +24,7 @@ class Workflow extends Model {
       createdAt: this.number(),
       isDisabled: this.boolean(false),
       settings: this.attr({
+        blockDelay: 0,
         timeout: 120000,
         onError: 'stop-workflow',
       }),