diff --git a/CHANGELOG.md b/CHANGELOG.md index 41358e8fc19..b78a3ced0eb 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -2,6 +2,7 @@ ## [next] +- fix(): bubble dirty flag for group only when true [#9540](https://github.com/fabricjs/fabric.js/pull/9540) - test() Backport a test to capture a failing text style situation [#9531](https://github.com/fabricjs/fabric.js/pull/9531) ## [6.0.0-beta16] diff --git a/src/shapes/Object/Object.spec.ts b/src/shapes/Object/Object.spec.ts index 446886b2dfc..d209338a6fd 100644 --- a/src/shapes/Object/Object.spec.ts +++ b/src/shapes/Object/Object.spec.ts @@ -1,6 +1,7 @@ import { Shadow } from '../../Shadow'; import { Rect } from '../Rect'; import { FabricObject } from './Object'; +import { Group } from '../Group'; describe('Object', () => { it('rotate with centered rotation', () => { @@ -100,4 +101,22 @@ describe('Object', () => { expect(rect.needsItsOwnCache()).toBe(false); }); }); + describe('set method and dirty flag bubbling', () => { + it('when dirty is true it bubbles', () => { + const rect = new Rect({ width: 100, height: 100 }); + const group = new Group([rect]); + group.dirty = false; + expect(group.dirty).toBe(false); + rect.set('dirty', true); + expect(group.dirty).toBe(true); + }); + it('when dirty is false it does not bubble', () => { + const rect = new Rect({ width: 100, height: 100 }); + const group = new Group([rect]); + group.dirty = true; + expect(group.dirty).toBe(true); + rect.set('dirty', false); + expect(group.dirty).toBe(true); + }); + }); }); diff --git a/src/shapes/Object/Object.ts b/src/shapes/Object/Object.ts index 384b85f985a..372add34d36 100644 --- a/src/shapes/Object/Object.ts +++ b/src/shapes/Object/Object.ts @@ -706,7 +706,10 @@ export class FabricObject< // i don't like this automatic initialization here } else if (key === 'shadow' && value && !(value instanceof Shadow)) { value = new Shadow(value); - } else if (key === 'dirty' && this.group) { + } else if (key === 'dirty' && this.group && value) { + // a dirty child makes the parent dirty + // but a non dirty child will not make the parent non dirty. + // the parent could be dirty for some other reason this.group.set('dirty', value); }