feat(export): hide dynamic-group nodes during snapshot capture

src/components/Toolbar.vue

@@ -555,6 +555,48 @@ const addWatermarkToImage = (base64: string) => {
   });
 };
 
+const waitForNextPaint = () => {
+  return new Promise<void>((resolve) => {
+    if (typeof window === 'undefined' || typeof window.requestAnimationFrame !== 'function') {
+      resolve();
+      return;
+    }
+    window.requestAnimationFrame(() => resolve());
+  });
+};
+
+const withDynamicGroupsHiddenForSnapshot = async <T>(
+  logicFlowInstance: any,
+  runner: () => Promise<T>,
+): Promise<T> => {
+  const graphModel = logicFlowInstance?.graphModel;
+  const dynamicGroupModels = (graphModel?.nodes ?? []).filter(
+    (node: any) => node?.type === 'dynamic-group',
+  );
+
+  if (!dynamicGroupModels.length) {
+    return runner();
+  }
+
+  const previousStates = dynamicGroupModels.map((model: any) => ({
+    model,
+    visible: model.visible,
+  }));
+
+  try {
+    previousStates.forEach(({ model }) => {
+      model.visible = false;
+    });
+    await waitForNextPaint();
+    return await runner();
+  } finally {
+    previousStates.forEach(({ model, visible }) => {
+      model.visible = visible;
+    });
+    await waitForNextPaint();
+  }
+};
+
 const captureLogicFlowSnapshot = async () => {
   const logicFlowInstance = getLogicFlowInstance() as any;
   if (!logicFlowInstance || typeof logicFlowInstance.getSnapshotBase64 !== 'function') {
@@ -562,7 +604,9 @@ const captureLogicFlowSnapshot = async () => {
     return null;
   }
 
-  const snapshotResult = await logicFlowInstance.getSnapshotBase64(
+  const snapshotResult = await withDynamicGroupsHiddenForSnapshot(
+    logicFlowInstance,
+    () => logicFlowInstance.getSnapshotBase64(
       undefined,
       undefined,
       {
@@ -571,6 +615,7 @@ const captureLogicFlowSnapshot = async () => {
         partial: false,
         padding: 20,
       },
+    ),
   );
 
   const base64 = typeof snapshotResult === 'string' ? snapshotResult : snapshotResult?.data;