@midscene/visualizer 0.15.2 → 0.15.3-beta-20250423152742.0

package/dist/es/component/blackboard.js

@@ -76,7 +76,7 @@ const Blackboard = (props) => {
   const highlightIds = highlightElements.map((e) => e.id);
   const highlightRect = props.highlightRect;
   const context = props.uiContext;
-  const { size, screenshotBase64, screenshotBase64WithElementMarker } = context;
+  const { size, screenshotBase64 } = context;
   const screenWidth = size.width;
   const screenHeight = size.height;
   const domRef = useRef(null);
@@ -87,7 +87,6 @@ const Blackboard = (props) => {
   const [hoverElement, setHoverElement] = useState(null);
   const pixiBgRef = useRef();
   const { markerVisible, setMarkerVisible, elementsVisible, setTextsVisible } = useBlackboardPreference();
-  const ifMarkerAvailable = !!screenshotBase64WithElementMarker;
   useEffect(() => {
     Promise.resolve(
       (() => __async(void 0, null, function* () {
@@ -138,24 +137,6 @@ const Blackboard = (props) => {
       backgroundSprite.width = screenWidth;
       backgroundSprite.height = screenHeight;
       app.stage.addChildAt(backgroundSprite, 0);
-      if (ifMarkerAvailable) {
-        const markerImg = new Image();
-        markerImg.onload = () => {
-          const markerTexture = PIXI.Texture.from(markerImg);
-          const markerSprite = new PIXI.Sprite(markerTexture);
-          markerSprite.x = 0;
-          markerSprite.y = 0;
-          markerSprite.width = screenWidth;
-          markerSprite.height = screenHeight;
-          app.stage.addChildAt(markerSprite, 1);
-          pixiBgRef.current = markerSprite;
-          markerSprite.visible = markerVisible;
-        };
-        markerImg.onerror = (e) => {
-          console.error("load marker failed", e);
-        };
-        markerImg.src = screenshotBase64WithElementMarker;
-      }
     };
     img.onerror = (e) => {
       console.error("load screenshot failed", e);
@@ -241,18 +222,7 @@ const Blackboard = (props) => {
       {
         className: "blackboard-filter",
         style: { display: props.hideController ? "none" : "block" },
-        children: /* @__PURE__ */ jsxs("div", { className: "overlay-control", children: [
-          /* @__PURE__ */ jsx(
-            Checkbox,
-            {
-              checked: markerVisible,
-              onChange: onSetMarkerVisible,
-              disabled: !ifMarkerAvailable,
-              children: "Marker"
-            }
-          ),
-          /* @__PURE__ */ jsx(Checkbox, { checked: elementsVisible, onChange: onSetElementsVisible, children: "Elements" })
-        ] })
+        children: /* @__PURE__ */ jsx("div", { className: "overlay-control", children: /* @__PURE__ */ jsx(Checkbox, { checked: elementsVisible, onChange: onSetElementsVisible, children: "Elements" }) })
       }
     ),
     /* @__PURE__ */ jsx(

package/dist/es/component/player.js

@@ -452,7 +452,7 @@ function Player(props) {
     let cancelFn;
     Promise.resolve(
       (() => __async(this, null, function* () {
-        var _a2;
+        var _a2, _b;
         if (!app) {
           throw new Error("app is not initialized");
         }
@@ -496,12 +496,12 @@ function Player(props) {
             }
             currentImg.current = item.img;
             yield repaintImage();
-            const elements = item.insightDump.context.content;
+            const elements = ((_a2 = item.context) == null ? void 0 : _a2.content) || [];
             const highlightElements = item.insightDump.matchedElement;
             yield insightElementsAnimation(
               elements,
               highlightElements,
-              (_a2 = item.insightDump.taskInfo) == null ? void 0 : _a2.searchArea,
+              (_b = item.insightDump.taskInfo) == null ? void 0 : _b.searchArea,
               item.duration,
               frame
             );

package/dist/es/component/replay-scripts.js

@@ -189,7 +189,7 @@ const generateAnimationScripts = (execution, task, imageWidth, imageHeight) => {
   let initSubTitle = "";
   let errorStateFlag = false;
   tasksIncluded.forEach((task2, index) => {
-    var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k;
+    var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j;
     if (errorStateFlag)
       return;
     if (task2.type === "Planning") {
@@ -205,7 +205,7 @@ const generateAnimationScripts = (execution, task, imageWidth, imageHeight) => {
         });
         initSubTitle = paramStr(task2);
       }
-    } else if (task2.type === "Insight") {
+    } else if (task2.type === "Insight" && task2.subType === "Locate") {
       const insightTask = task2;
       const resultElement = (_c = insightTask.output) == null ? void 0 : _c.element;
       const title = typeStr(task2);
@@ -216,16 +216,14 @@ const generateAnimationScripts = (execution, task, imageWidth, imageHeight) => {
           pointerTop: resultElement.center[1]
         });
       }
-      if ((_d = insightTask.log) == null ? void 0 : _d.dump) {
+      const context = insightTask.pageContext;
+      if (((_d = insightTask.log) == null ? void 0 : _d.dump) && (context == null ? void 0 : context.screenshotBase64)) {
         const insightDump = insightTask.log.dump;
-        if (!((_e = insightDump == null ? void 0 : insightDump.context) == null ? void 0 : _e.screenshotBase64)) {
-          throw new Error("insight dump is required");
-        }
-        const insightContentLength = insightDump.context.content.length;
-        if (insightDump.context.screenshotBase64WithElementMarker) {
+        const insightContentLength = context.content.length;
+        if (context.screenshotBase64) {
           scripts.push({
             type: "img",
-            img: insightDump.context.screenshotBase64,
+            img: context.screenshotBase64,
             duration: stillAfterInsightDuration,
             title,
             subTitle
@@ -244,7 +242,8 @@ const generateAnimationScripts = (execution, task, imageWidth, imageHeight) => {
         }
         scripts.push({
           type: "insight",
-          img: insightDump.context.screenshotBase64WithElementMarker || insightDump.context.screenshotBase64,
+          img: context.screenshotBase64,
+          context,
           insightDump,
           camera: cameraState,
           duration: insightContentLength > 20 ? locateDuration : locateDuration * 0.5,
@@ -267,7 +266,7 @@ const generateAnimationScripts = (execution, task, imageWidth, imageHeight) => {
       currentCameraState = insightCameraState != null ? insightCameraState : fullPageCameraState;
       scripts.push({
         type: "img",
-        img: (_g = (_f = task2.recorder) == null ? void 0 : _f[0]) == null ? void 0 : _g.screenshot,
+        img: (_f = (_e = task2.recorder) == null ? void 0 : _e[0]) == null ? void 0 : _f.screenshot,
         duration: actionDuration,
         camera: task2.subType === "Sleep" ? fullPageCameraState : insightCameraState,
         title,
@@ -283,7 +282,7 @@ const generateAnimationScripts = (execution, task, imageWidth, imageHeight) => {
         insightOnTop = false;
       }
       const imgStillDuration = index < taskCount - 1 ? stillDuration : 0;
-      if ((_i = (_h = task2.recorder) == null ? void 0 : _h[1]) == null ? void 0 : _i.screenshot) {
+      if ((_h = (_g = task2.recorder) == null ? void 0 : _g[1]) == null ? void 0 : _h.screenshot) {
         scripts.push({
           type: "spinning-pointer",
           duration: actionSpinningPointerDuration,
@@ -293,7 +292,7 @@ const generateAnimationScripts = (execution, task, imageWidth, imageHeight) => {
         scripts.push(pointerScript(mousePointer, title, subTitle));
         scripts.push({
           type: "img",
-          img: (_k = (_j = task2.recorder) == null ? void 0 : _j[1]) == null ? void 0 : _k.screenshot,
+          img: (_j = (_i = task2.recorder) == null ? void 0 : _i[1]) == null ? void 0 : _j.screenshot,
           duration: imgStillDuration,
           title,
           subTitle