feat: add `wait for selector` option in loop data block

src/background/workflowEngine/blocksHandler/handlerLoopData.js

@@ -46,6 +46,8 @@ async function loopData({ data, id }, { refData }) {
               findBy,
               multiple: true,
               selector: data.elementSelector,
+              waitForSelector: data.waitForSelector ?? false,
+              waitSelectorTimeout: data.waitSelectorTimeout ?? 5000,
             },
           });
           this.loopEls.push({

src/components/newtab/workflow/edit/EditLoopData.vue

@@ -44,16 +44,33 @@
       class="w-full mt-2"
       @change="updateData({ variableName: $event })"
     />
-    <edit-autocomplete v-else-if="data.loopThrough === 'elements'" class="mt-2">
+    <template v-else-if="data.loopThrough === 'elements'">
+      <edit-autocomplete class="mt-2">
+        <ui-input
+          :model-value="data.elementSelector"
+          :label="t('workflow.blocks.base.selector')"
+          autocomplete="off"
+          placeholder="CSS Selector or XPath"
+          class="w-full"
+          @change="updateData({ elementSelector: $event })"
+        />
+      </edit-autocomplete>
+      <ui-checkbox
+        :model-value="data.waitForSelector"
+        block
+        class="mt-1"
+        @change="updateData({ waitForSelector: $event })"
+      >
+        {{ t('workflow.blocks.base.waitSelector.title') }}
+      </ui-checkbox>
       <ui-input
-        :model-value="data.elementSelector"
-        :label="t('workflow.blocks.base.selector')"
-        autocomplete="off"
-        placeholder="CSS Selector or XPath"
-        class="w-full"
-        @change="updateData({ elementSelector: $event })"
+        v-if="data.waitForSelector"
+        :model-value="data.waitSelectorTimeout"
+        :label="t('workflow.blocks.base.waitSelector.timeout')"
+        class="mt-1 w-full"
+        @change="updateData({ waitSelectorTimeout: +$event })"
       />
-    </edit-autocomplete>
+    </template>
     <ui-button
       v-else-if="data.loopThrough === 'custom-data'"
       class="w-full mt-4"

src/content/blocksHandler/handlerLoopData.js

@@ -20,7 +20,7 @@ function generateLoopSelectors(elements, { max, attrId, frameSelector }) {
 export default async function loopElements(block) {
   const elements = await handleSelector(block);
   if (!elements) throw new Error('element-not-found');
-
+  console.log(block);
   let frameSelector = '';
   if (block.data.$frameSelector) {
     frameSelector = `${block.data.$frameSelector} |> `;

src/utils/shared.js

@@ -702,6 +702,8 @@ export const tasks = {
       variableName: '',
       referenceKey: '',
       elementSelector: '',
+      waitForSelector: false,
+      waitSelectorTimeout: 5000,
       resumeLastWorkflow: false,
       loopThrough: 'data-columns',
     },