added mask unit test

Author: k9p5

src/clips/mixins/visual.spec.ts

@@ -6,11 +6,12 @@
  */
 
 import { describe, expect, it, vi } from 'vitest';
-import { BlurFilter, Sprite, Texture } from 'pixi.js';
+import { BlurFilter, Sprite, Texture, Graphics } from 'pixi.js';
 import { VisualMixin } from './visual';
 import { Keyframe } from '../../models';
 import { Clip } from '../clip';
 import { Composition } from '../../composition';
+import { CircleMask } from '../mask';
 
 describe('The Visual Clip Mixin', () => {
 	const VisualClip = VisualMixin(Clip);
@@ -116,4 +117,23 @@ describe('The Visual Clip Mixin', () => {
 		expect(exitSpy).toHaveBeenCalledTimes(1);
 		expect(clip.view.filters).toBeNull();
 	});
+
+	it('should add a mask to the view', async () => {
+    const clip = new VisualClip();
+
+    expect(clip.mask).toBeUndefined();
+    expect(clip.view.mask).toBeUndefined();
+
+    clip.mask = new CircleMask({
+      radius: 1080/2,
+      position: {
+        x: 1920 / 2,
+        y: 1080 / 2,
+      },
+    });
+    
+    expect(clip.mask).toBeInstanceOf(CircleMask);
+    expect(clip.view.mask).toBeInstanceOf(Graphics);
+  });
+
 });

src/clips/mixins/visual.ts

@@ -27,8 +27,6 @@ export function VisualMixin<T extends Constructor<BaseClass>>(Base: T) {
 		 */
 		public filters?: Filter | Filter[];
 
-		private _mask?: Graphics;
-
 		@serializable(deserializers.Deserializer1D)
 		public _height?: int | Keyframe<int> | Percent | NumberCallback;
 
@@ -179,11 +177,10 @@ export function VisualMixin<T extends Constructor<BaseClass>>(Base: T) {
 		 * The mask to apply to the clip
 		 */
 		public get mask(): Graphics | undefined {
-			return this._mask;
+			return this.view.mask as Graphics | undefined;
 		}
 
 		public set mask(value: Graphics | undefined) {
-			this._mask = value;
 			this.view.mask = value ?? null;
 		}