fix: preserve update starts for channelled updates

VChart drives update state through applyAnimationState after setting finalAttrs and diffAttrs.

When built-in update also declared a channel that omitted layout keys, AnimateExecutor

pre-committed attrOutChannel before Update captured from props. That collapsed layout

from and to values to final and skipped the visible position animation.

Constraint: D3 static truth keeps animation frames transient and base/final as final layout

Rejected: Make VChart pre-snapshot update starts | leaks Update ownership to consumers

Rejected: Disable attrOutChannel globally | breaks non-update channel semantics

Confidence: high

Scope-risk: narrow

Directive: Do not pre-commit context.diffAttrs before built-in Update captures starts

Tested: vrender-animate animation-runtime-attribute targeted and full file

Tested: packages/vrender-animate rushx test

Tested: rush compile -t @visactor/vrender-animate -t @visactor/vrender-core

Tested: packages/vrender-animate rushx eslint, 0 errors with existing warnings

Tested: git diff --check

Author: xuefei1313

packages/vrender-animate/__tests__/unit/animation-runtime-attribute.test.ts

@@ -1125,6 +1125,112 @@ describe('D3 pre-handoff animation runtime', () => {
     expect(rect.getFinalAttribute().y).toBe(finalY);
   });
 
+  test.each([
+    ['style-only channel', ['fillOpacity']],
+    ['empty channel', []]
+  ])('animation state update keeps diffAttrs animated with %s', (_name, channel) => {
+    const { group, ticker, graphicService } = createStageHarness('state-update-channel-out-position');
+    const oldAttrs = {
+      x: 0,
+      y: 46.90909090909094,
+      width: 10,
+      height: 34,
+      fillOpacity: 1,
+      visible: true
+    };
+    const diffAttrs = {
+      x: 974.1100285714286,
+      y: 3,
+      height: 34
+    };
+    const finalAttrs = {
+      ...oldAttrs,
+      ...diffAttrs
+    };
+    const rect = createRect(oldAttrs);
+    bindGraphicService(rect as any, graphicService);
+    rect.setFinalAttributes(oldAttrs);
+    (rect as any).context = {
+      diffState: 'update',
+      animationState: 'update',
+      data: [{ id: 'China_share_global_co2' }],
+      diffAttrs,
+      finalAttrs
+    };
+    group.appendChild(rect);
+
+    rect.setFinalAttributes(finalAttrs);
+    (rect as any).applyAnimationState(
+      ['update'],
+      [
+        {
+          name: 'update_0',
+          animation: {
+            type: 'update',
+            duration: 300,
+            easing: 'linear',
+            channel
+          }
+        }
+      ]
+    );
+
+    tick(ticker, 1);
+
+    const animate = (rect as any)._animationStateManager.stateList[0].executor._animates[0];
+    const step = (animate as any)._firstStep;
+    expect(step.getFromProps().y).toBeCloseTo(oldAttrs.y, 6);
+    expect(step.getEndProps().y).toBeCloseTo(diffAttrs.y, 6);
+    expect(rect.attribute.y).toBeGreaterThan(diffAttrs.y);
+    expect(rect.attribute.y).toBeLessThan(oldAttrs.y);
+
+    tick(ticker, 299);
+
+    expect(rect.attribute.y).toBe(diffAttrs.y);
+    expect((rect as any).baseAttributes.y).toBe(diffAttrs.y);
+    expect(rect.getFinalAttribute().y).toBe(diffAttrs.y);
+  });
+
+  test('non-animation update commits diffAttrs without going through animation executor', () => {
+    const oldAttrs = {
+      x: 0,
+      y: 46.90909090909094,
+      width: 10,
+      height: 34,
+      fillOpacity: 1,
+      visible: true
+    };
+    const diffAttrs = {
+      x: 974.1100285714286,
+      y: 3,
+      height: 34
+    };
+    const finalAttrs = {
+      ...oldAttrs,
+      ...diffAttrs
+    };
+    const rect = createRect(oldAttrs);
+    rect.setFinalAttributes(oldAttrs);
+    (rect as any).context = {
+      diffState: 'update',
+      animationState: 'update',
+      data: [{ id: 'China_share_global_co2' }],
+      diffAttrs,
+      finalAttrs
+    };
+
+    rect.setAttributes(diffAttrs);
+    rect.setFinalAttributes(finalAttrs);
+
+    expect(rect.attribute.y).toBe(diffAttrs.y);
+    expect((rect as any).baseAttributes.y).toBe(diffAttrs.y);
+    expect(rect.getFinalAttribute().y).toBe(diffAttrs.y);
+    expect(rect.attribute.x).toBe(diffAttrs.x);
+    expect((rect as any).baseAttributes.x).toBe(diffAttrs.x);
+    expect(rect.getFinalAttribute().x).toBe(diffAttrs.x);
+    expect((rect as any)._animationStateManager).toBeUndefined();
+  });
+
   test('superseded executor update cannot commit stale layout when it ends late', () => {
     const { group, ticker, graphicService } = createStageHarness('executor-update-stale-end');
     const threeItemLayout = {

packages/vrender-animate/src/executor/animate-executor.ts

@@ -341,20 +341,20 @@ export class AnimateExecutor implements IAnimateExecutor {
     //   animate.wait(delayValue);
     // }
 
-    // 根据 channel 配置创建属性对象
     // 根据 channel 配置创建属性对象
     let parsedFromProps = null;
     let props = params.to;
     let from = params.from;
+    const commitAttrOutChannel = this.shouldCommitAttrOutChannel(type);
     if (!props) {
       if (!parsedFromProps) {
-        parsedFromProps = this.createPropsFromChannel(channel, graphic);
+        parsedFromProps = this.createPropsFromChannel(channel, graphic, commitAttrOutChannel);
       }
       props = parsedFromProps.props;
     }
     if (!from) {
       if (!parsedFromProps) {
-        parsedFromProps = this.createPropsFromChannel(channel, graphic);
+        parsedFromProps = this.createPropsFromChannel(channel, graphic, commitAttrOutChannel);
       }
       from = parsedFromProps.from;
     }
@@ -552,15 +552,16 @@ export class AnimateExecutor implements IAnimateExecutor {
       let parsedFromProps = null;
       let props = effect.to;
       let from = effect.from;
+      const commitAttrOutChannel = this.shouldCommitAttrOutChannel(type);
       if (!props) {
         if (!parsedFromProps) {
-          parsedFromProps = this.createPropsFromChannel(channel, graphic);
+          parsedFromProps = this.createPropsFromChannel(channel, graphic, commitAttrOutChannel);
         }
         props = parsedFromProps.props;
       }
       if (!from) {
         if (!parsedFromProps) {
-          parsedFromProps = this.createPropsFromChannel(channel, graphic);
+          parsedFromProps = this.createPropsFromChannel(channel, graphic, commitAttrOutChannel);
         }
         from = parsedFromProps.from;
       }
@@ -620,6 +621,12 @@ export class AnimateExecutor implements IAnimateExecutor {
     animate.to(props, duration, easing);
   }
 
+  private shouldCommitAttrOutChannel(type: string): boolean {
+    // Update owns context.diffAttrs itself. Its channel config must not pre-commit
+    // omitted diff keys before Update captures their start frame.
+    return type !== 'update';
+  }
+
   /**
    * 创建自定义动画类
    */
@@ -654,7 +661,8 @@ export class AnimateExecutor implements IAnimateExecutor {
    */
   private createPropsFromChannel(
     channel: IAnimationChannelAttrs | IAnimationChannelAttributes | undefined,
-    graphic: IGraphic
+    graphic: IGraphic,
+    includeAttrOutChannel: boolean = true
   ): {
     from: Record<string, any> | null;
     props: Record<string, any>;
@@ -670,7 +678,7 @@ export class AnimateExecutor implements IAnimateExecutor {
       };
     }
 
-    const attrOutChannel: Record<string, any> | null = {};
+    const attrOutChannel: Record<string, any> | null = includeAttrOutChannel ? {} : null;
     let hasAttrs = false;
     const diffAttrs = graphic.context?.diffAttrs;
     if (Array.isArray(channel)) {
@@ -705,7 +713,7 @@ export class AnimateExecutor implements IAnimateExecutor {
       }
     });
 
-    if (diffAttrs) {
+    if (diffAttrs && attrOutChannel) {
       for (const key in diffAttrs) {
         const value = (diffAttrs as any)[key];
         if (value === undefined) {