Correct Object Vector V2 flame anchoring by fixing scale behavior instead of zoom behavior - PR_26133_102-object-vector-scale-anchor-fix

Author: DavidQ

docs/dev/reports/PR_26133_102-object-vector-scale-anchor-fix_report.md

@@ -0,0 +1,49 @@
+# PR_26133_102 Object Vector Scale Anchor Fix
+
+## Scope
+- Read `docs/dev/PROJECT_INSTRUCTIONS.md` before implementation.
+- Used the currently integrated PR_26133_101 state as the prior reference. The prior delta ZIP `tmp/PR_26133_101-object-vector-zoom-and-layout-fixes_delta.zip` was not present locally.
+- Limited changes to the Object Vector Studio V2 scale-anchor correction and focused Playwright coverage.
+
+## Implementation
+- Removed the prior zoom-anchoring/preview-state workaround from `ToolStarterApp.js`:
+  - `objectScalePreviewValues`
+  - `currentObjectScalePreviewValue`
+  - `transformWithRelativeScaleAroundPivot`
+- Replaced it with object scale math based on current per-shape transforms:
+  - Object Scale input derives from the selected object shape transforms.
+  - Applying Object Scale computes each shape's current scale ratio against the requested scale.
+  - Each shape origin is moved around the object pivot by that ratio, then `scaleX`/`scaleY` are set to the requested uniform scale.
+- Kept PR_26133_101 zoom/layout behavior intact, including `MAX_ZOOM = 1.0`.
+
+## Targeted Validation
+- PASS: `node --check tools\object-vector-studio-v2\js\ToolStarterApp.js`
+- PASS: `node --check tests\playwright\tools\WorkspaceManagerV2.spec.mjs`
+- PASS: targeted Object Vector V2 Playwright validation:
+  - `npx playwright test tests/playwright/tools/WorkspaceManagerV2.spec.mjs --project=playwright --workers=1 --reporter=list -g "shows Object Vector Studio V2 layout shell|expands Object Vector Studio V2 asset authoring controls"`
+  - Result: 2 passed.
+- PASS: `npm run test:workspace-v2`
+  - Result: 56 passed.
+- PASS: `git diff --check -- tools/object-vector-studio-v2/js/ToolStarterApp.js tests/playwright/tools/WorkspaceManagerV2.spec.mjs`
+  - Only CRLF warning for the existing Playwright test file.
+
+## Scale / Zoom Notes
+- The object preview zoom contract from PR_26133_101 was not reworked.
+- The anchoring fix is now in Object Scale behavior: repeated object scale changes derive from each shape's actual current transform instead of a separate preview tracking map.
+- The focused Playwright assertions verify the prior preview-state helper is gone and that object scale offsets follow the requested scale rather than compounding from stale preview state.
+
+## Manual Verification Guidance
+- Open Object Vector Studio V2 with the Asteroids ship object selected.
+- Use Object Transform scale repeatedly, for example `1.10` then `1.09`.
+- Verify flame/inner line shapes remain anchored to the bottom hull lines instead of drifting upward.
+- Verify preview zoom still reaches the PR_26133_101 max zoom behavior and Tools/fullscreen layout remains usable.
+
+## Diff Stat
+```
+tests/playwright/tools/WorkspaceManagerV2.spec.mjs |  3 +
+ tools/object-vector-studio-v2/js/ToolStarterApp.js | 79 ++++++++--------------
+ 2 files changed, 31 insertions(+), 51 deletions(-)
+```
+
+## Full Samples Smoke Test
+Skipped per PR_26133_102 instructions.

tests/playwright/tools/WorkspaceManagerV2.spec.mjs

@@ -3438,6 +3438,9 @@ test.describe("Workspace Manager V2 bootstrap", () => {
       expect(zoomSource).toContain("const MAX_ZOOM = 1.0;");
       expect(zoomSource).toContain("const MIN_ZOOM = 0.01;");
       expect(zoomSource).toContain("const ZOOM_STEP = 0.01;");
+      expect(zoomSource).toContain("transformWithObjectScaleAroundPivot");
+      expect(zoomSource).not.toContain("objectScalePreviewValues");
+      expect(zoomSource).not.toContain("transformWithRelativeScaleAroundPivot");
       expect(zoomSource).toMatch(/formatZoomPercentage\(\) \{\s+return Math\.round\(this\.viewport\.zoom \* 100\);\s+\}/);
       expect(zoomSource.match(/formatZoomPercentage\(\) \* 10/g)?.length || 0).toBeGreaterThanOrEqual(4);
       expect(zoomSource).not.toMatch(/viewport\.zoom\s*\*\s*100\s*\*\s*GRID_STEP|const MAX_ZOOM = 2/);

tools/object-vector-studio-v2/js/ToolStarterApp.js

@@ -525,7 +525,6 @@ export class ToolStarterApp {
     this.previewRedoStack = [];
     this.previewPointerEdit = null;
     this.transformInputValues = new Map();
-    this.objectScalePreviewValues = new Map();
     this.stateControlStateId = "";
     this.pendingAddObjectClick = false;
     this.hiddenObjectIds = new Set();
@@ -2806,8 +2805,7 @@ export class ToolStarterApp {
     const section = document.createElement("section");
     section.className = "object-vector-studio-v2__edit-panel object-vector-studio-v2__edit-panel--transform object-vector-studio-v2__edit-panel--object-transform";
     const origin = this.objectTransformOrigin(object);
-    const objectScaleInput = Number(this.objectScalePreviewValues.get(object.id) ?? 1);
-    const objectScale = Number.isFinite(objectScaleInput) && objectScaleInput > 0 ? objectScaleInput : 1;
+    const objectScale = this.objectScaleControlValue(object);
     section.append(
       this.createObjectOriginControlRow(origin),
       this.createObjectRotateControlRow(),
@@ -2827,6 +2825,18 @@ export class ToolStarterApp {
     return section;
   }
 
+  objectScaleControlValue(object) {
+    const frame = object?.id === this.selectedObjectId ? this.activeFrame() : null;
+    const transforms = sortedShapes(object)
+      .map((shape, shapeIndex) => this.ensureShapeTransform(this.effectiveShapeForFrame(shape, frame, shapeIndex)));
+    if (!transforms.length) {
+      return 1;
+    }
+    const firstScale = transforms[0].scaleX;
+    const sameScale = transforms.every((transform) => Math.abs(transform.scaleX - transform.scaleY) < 0.001 && Math.abs(transform.scaleX - firstScale) < 0.001);
+    return sameScale && firstScale > 0 ? this.formatViewportNumber(firstScale) : 1;
+  }
+
   createMoveControlRow() {
     return this.createTransformAxisControlRow({
       action: () => this.moveSelectedShape(),
@@ -4101,17 +4111,25 @@ export class ToolStarterApp {
     };
   }
 
-  transformWithRelativeScaleAroundPivot(transform, pivot, scaleRatio) {
+  transformWithObjectScaleAroundPivot(transform, pivot, scale) {
     const normalized = this.ensureShapeTransform({ transform });
+    if (Math.abs(normalized.scaleX - normalized.scaleY) >= 0.001) {
+      throw new Error("shape transform scale must be uniform for Object Scale.");
+    }
+    const currentScale = normalized.scaleX;
+    const scaleRatio = scale / currentScale;
+    if (!Number.isFinite(scaleRatio) || scaleRatio <= 0) {
+      throw new Error("scale ratio must be greater than 0.");
+    }
     const originWorld = this.transformedPoint(normalized.shapeOrigin, normalized);
     const nextOriginWorld = {
       x: this.formatViewportNumber(pivot.x + (originWorld.x - pivot.x) * scaleRatio),
       y: this.formatViewportNumber(pivot.y + (originWorld.y - pivot.y) * scaleRatio)
     };
     return {
       ...normalized,
-      scaleX: this.formatViewportNumber(normalized.scaleX * scaleRatio),
-      scaleY: this.formatViewportNumber(normalized.scaleY * scaleRatio),
+      scaleX: this.formatViewportNumber(scale),
+      scaleY: this.formatViewportNumber(scale),
       x: this.formatViewportNumber(nextOriginWorld.x - normalized.shapeOrigin.x),
       y: this.formatViewportNumber(nextOriginWorld.y - normalized.shapeOrigin.y)
     };
@@ -7385,54 +7403,20 @@ export class ToolStarterApp {
       this.transformInputValues.set(inputElement.id, inputElement.value);
     }
     this.applySelectedObjectScaleValue(nextScale, {
-      previousScale: input.value,
       okMessage: `OK Object scale preview set to ${this.formatScaleInputValue(nextScale)} for ${this.selectedObject()?.name || "selected object"}.`
     });
   }
 
-  currentObjectScalePreviewValue(object = this.selectedObject()) {
-    const storedScale = this.objectScalePreviewValues.get(object?.id);
-    return Number.isFinite(storedScale) && storedScale > 0 ? storedScale : 1;
-  }
-
-  applySelectedObjectScaleValue(scale, { okMessage, previousScale } = {}) {
+  applySelectedObjectScaleValue(scale, { okMessage } = {}) {
     const origin = this.readObjectOriginInputs();
     if (!origin.ok) {
       this.statusLog.write(`FAIL Invalid object transform rejected: ${origin.error}`);
       return false;
     }
     const object = this.selectedObject();
-    const priorScale = Number.isFinite(previousScale) && previousScale > 0
-      ? previousScale
-      : this.currentObjectScalePreviewValue(object);
-    const scaleRatio = scale / priorScale;
-    if (!Number.isFinite(scaleRatio) || scaleRatio <= 0) {
-      this.statusLog.write("FAIL Invalid object transform rejected: scale ratio must be greater than 0.");
-      return false;
-    }
-    const priorStoredScale = object?.id ? this.objectScalePreviewValues.get(object.id) : undefined;
-    const priorInputScale = this.transformInputValues.get("objectVectorStudioV2ObjectScaleInput");
-    const nextScale = this.formatViewportNumber(scale);
-    if (object?.id) {
-      this.objectScalePreviewValues.set(object.id, nextScale);
-      this.transformInputValues.set("objectVectorStudioV2ObjectScaleInput", this.formatScaleInputValue(nextScale));
-    }
-    const committed = this.updateSelectedObjectTransforms("scale", (shape) => {
-      shape.transform = this.transformWithRelativeScaleAroundPivot(this.ensureShapeTransform(shape), origin.value, scaleRatio);
+    return this.updateSelectedObjectTransforms("scale", (shape) => {
+      shape.transform = this.transformWithObjectScaleAroundPivot(this.ensureShapeTransform(shape), origin.value, scale);
     }, okMessage || `OK Object scale preview set to ${this.formatScaleInputValue(scale)} for ${object?.name || "selected object"}.`, "Object Transform scale failed schema validation");
-    if (!committed && object?.id) {
-      if (priorStoredScale === undefined) {
-        this.objectScalePreviewValues.delete(object.id);
-      } else {
-        this.objectScalePreviewValues.set(object.id, priorStoredScale);
-      }
-      if (priorInputScale === undefined) {
-        this.transformInputValues.delete("objectVectorStudioV2ObjectScaleInput");
-      } else {
-        this.transformInputValues.set("objectVectorStudioV2ObjectScaleInput", priorInputScale);
-      }
-    }
-    return committed;
   }
 
   resizeSelectedObject() {
@@ -7463,18 +7447,12 @@ export class ToolStarterApp {
     }
 
     const nextPayload = this.cloneCurrentPayload();
-    const currentScale = this.currentObjectScalePreviewValue(object);
-    const scaleRatio = input.value / currentScale;
-    if (!Number.isFinite(scaleRatio) || scaleRatio <= 0) {
-      this.statusLog.write("FAIL Resize Geometry rejected for selected object: scale ratio must be greater than 0.");
-      return;
-    }
     try {
       targetIndexes.forEach((shapeIndex) => {
         const baseShape = this.findShapeInPayload(nextPayload, shapeIndex);
         const override = this.frameOverrideInPayload(nextPayload, shapeIndex, { create: false });
         const transformTarget = override?.transform ? { transform: override.transform, geometry: baseShape.geometry } : baseShape;
-        const transform = this.transformWithRelativeScaleAroundPivot(this.ensureShapeTransform(transformTarget), origin.value, scaleRatio);
+        const transform = this.transformWithObjectScaleAroundPivot(this.ensureShapeTransform(transformTarget), origin.value, input.value);
         this.resizeShapeGeometryByTransformScale(baseShape, transform);
         transform.scaleX = 1;
         transform.scaleY = 1;
@@ -7494,7 +7472,6 @@ export class ToolStarterApp {
     }
 
     this.transformInputValues.set("objectVectorStudioV2ObjectScaleInput", "1");
-    this.objectScalePreviewValues.set(object.id, 1);
     this.commitPayloadUpdate(
       nextPayload,
       object.id,