waygraph 0.12.35 → 0.12.36

package/dist/cli.js

@@ -889,7 +889,8 @@ async function installOverlay(page, title) {
           if (ring) ring.style.opacity = "0";
           if (ringLabel) ringLabel.style.opacity = "0";
           if (window.__wgHideFocusVeil) window.__wgHideFocusVeil();
-          if (window.__wgClearZoom) window.__wgClearZoom();
+          // Do NOT clear camera zoom here - zoomOut:false keeps scale between
+          // rings; only resetCameraZoom / teardown call __wgClearZoom.
         };
         // Screen Studio-style camera: scale <body>, keep overlays on <html> fixed.
         window.__wgCamera = { scale: 1, cx: 0, cy: 0 };
@@ -1618,7 +1619,11 @@ async function cycleHighlightRings(page, highlights, gatesFast, opts) {
     }
   }
   await stopLiveFollow();
-  await resetCameraZoom(page);
+  // Keep camera if the last ring (or phase default) asked zoomOut:false.
+  const last = list.length > 0 ? list[list.length - 1] : null;
+  if (!last || last.zoomOut !== false) {
+    await resetCameraZoom(page);
+  }
   if (list.length === 0) {
     await hideRing(page);
   }
@@ -2345,6 +2350,7 @@ async function teardownOverlay(page) {
         window.__wgRingTrack = null;
       }
       window.__wgNarrateOwnsRing = false;
+      if (window.__wgClearZoom) window.__wgClearZoom();
       for (const id of ["wg-panel", "wg-ring", "wg-ring-label", "wg-cursor", "wg-click-pulse", "wg-banner", "wg-todo-modal", "wg-focus-veil"]) {
         const el = document.getElementById(id);
         if (el) el.remove();

package/examples/saucedemo/src/blocks/saucedemo-web/cart/nav-cart.block.ts

@@ -20,6 +20,7 @@ export const NavCartBlock = defineNavClickBlock<CartPage>({
     ctx.todos(["Find the product", "Add to cart", "Open cart"]);
     ctx.todoIndex(2);
     ctx.zoom(1.4);
+    ctx.zoomOut(false);
     ctx.highlights({
       cart: {
         selector: ".shopping_cart_link",

package/examples/saucedemo/src/blocks/saucedemo-web/inventory/methods/add-to-cart.effect.block.ts

@@ -66,6 +66,7 @@ export const AddToCartBlock = defineEffectBlock<Checkpoint<string>, ItemInCart>(
       ctx.banner("In the cart");
       ctx.todos(["Find the product", "Add to cart", "Open cart"]);
       ctx.todoIndex(1);
+      ctx.zoomOut(false);
       ctx.ring("badge", {
         selector: InventorySel.cartBadge,
         label: "Cart badge",
@@ -73,6 +74,7 @@ export const AddToCartBlock = defineEffectBlock<Checkpoint<string>, ItemInCart>(
         focus: true,
         color: "#86efac",
         zoom: 1.6,
+        zoomOut: false,
         followMouse: true,
         duration: true,
       });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "waygraph",
-  "version": "0.12.35",
+  "version": "0.12.36",
   "type": "module",
   "description": "A typed graph of reusable Blocks for driving a browser through E2E flows.",
   "license": "MIT",

package/templates/quickstart/src/blocks/saucedemo-web/cart/nav-cart.block.ts

@@ -20,6 +20,7 @@ export const NavCartBlock = defineNavClickBlock<CartPage>({
     ctx.todos(["Find the product", "Add to cart", "Open cart"]);
     ctx.todoIndex(2);
     ctx.zoom(1.4);
+    ctx.zoomOut(false);
     ctx.highlights({
       cart: {
         selector: ".shopping_cart_link",

package/templates/quickstart/src/blocks/saucedemo-web/inventory/methods/add-to-cart.effect.block.ts

@@ -66,6 +66,7 @@ export const AddToCartBlock = defineEffectBlock<Checkpoint<string>, ItemInCart>(
       ctx.banner("In the cart");
       ctx.todos(["Find the product", "Add to cart", "Open cart"]);
       ctx.todoIndex(1);
+      ctx.zoomOut(false);
       ctx.ring("badge", {
         selector: InventorySel.cartBadge,
         label: "Cart badge",
@@ -73,6 +74,7 @@ export const AddToCartBlock = defineEffectBlock<Checkpoint<string>, ItemInCart>(
         focus: true,
         color: "#86efac",
         zoom: 1.6,
+        zoomOut: false,
         followMouse: true,
         duration: true,
       });