fix(tests): solves testing issues + add some documentation

szimek · Jun 28, 2023 · bc5b39e · bc5b39e
1 parent 494538c
commit bc5b39e
Show file tree

Hide file tree

Showing 4 changed files with 24 additions and 0 deletions.
diff --git a/src/signature_pad.ts b/src/signature_pad.ts
@@ -36,6 +36,11 @@ export interface PointGroupOptions {
   maxWidth: number;
   penColor: string;
   velocityFilterWeight: number;
+  /**
+   * This is the globalCompositeOperation for the line.
+   * *default: 'source-over'*
+   * @see https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D/globalCompositeOperation
+   */
   compositeOperation: GlobalCompositeOperation;
 }
 

diff --git a/tests/fixtures/face.ts b/tests/fixtures/face.ts
@@ -7,6 +7,7 @@ export const face: PointGroup[] = [
     minWidth: 0.5,
     maxWidth: 2.5,
     velocityFilterWeight: 0.7,
+    compositeOperation: 'source-over',
     points: [
       {
         time: 1523730547109,
@@ -22,6 +23,7 @@ export const face: PointGroup[] = [
     minWidth: 0.5,
     maxWidth: 2.5,
     velocityFilterWeight: 0.7,
+    compositeOperation: 'source-over',
     points: [
       {
         time: 1523730547775,
@@ -37,6 +39,7 @@ export const face: PointGroup[] = [
     minWidth: 0.5,
     maxWidth: 2.5,
     velocityFilterWeight: 0.7,
+    compositeOperation: 'source-over',
     points: [
       {
         time: 1523730548448,

diff --git a/tests/fixtures/square.ts b/tests/fixtures/square.ts
@@ -7,6 +7,7 @@ export const square: PointGroup[] = [
     minWidth: 0.5,
     maxWidth: 2.5,
     velocityFilterWeight: 0.7,
+    compositeOperation: 'source-over',
     points: [
       {
         time: 1637131731972,

diff --git a/tests/signature_pad.test.ts b/tests/signature_pad.test.ts
@@ -53,6 +53,21 @@ describe('#clear', () => {
     expect(pad.isEmpty()).toBe(true);
     expect(pad.toData()).toEqual([]);
   });
+
+  it('clear should apply erase options to canvas context', () => {
+    const pad = new SignaturePad(canvas);
+
+    pad.fromData(face);
+    expect(pad.isEmpty()).toBe(false);
+
+    pad.penColor = 'pink';
+    pad.compositeOperation = 'destination-out';
+
+    pad.clear();
+
+    const context = canvas.getContext('2d') as CanvasRenderingContext2D;
+    expect(context.globalCompositeOperation).toBe('destination-out');
+  })
 });
 
 describe('#isEmpty', () => {