Merge branch 'develop'

Author: michaeldzjap

.github/workflows/ci.yml

@@ -0,0 +1,35 @@
+name: CI
+on: [push]
+jobs:
+  ci:
+    name: CI - OS ${{ matrix.os }}, Node.js ${{ matrix.node-version }}
+    runs-on: ${{ matrix.os }}
+    strategy:
+      matrix:
+        os: [ubuntu-latest, macos-latest, windows-latest]
+        node-version: [14.x, 16.x]
+    steps:
+    - name: Check out repository code
+      uses: actions/checkout@v3
+    - name: Use Node.js ${{ matrix.node-version }}
+      uses: actions/setup-node@v3
+      with:
+        node-version: ${{ matrix.node-version }}
+        cache: 'npm'
+    - name: Install
+      run: npm ci
+    - name: Lint
+      run: npm run lint
+    - name: Build
+      run: npm run prod
+    - name: Test
+      run: npm run test
+    - name: Upload coverage report
+      if: ${{ matrix.os == 'ubuntu-latest' && matrix.node-version == '16.x' }}
+      uses: codecov/codecov-action@v3
+    - name: SonarCloud Scan
+      if: ${{ matrix.os == 'ubuntu-latest' && matrix.node-version == '16.x' }}
+      uses: sonarsource/sonarcloud-github-action@master
+      env:
+        GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+        SONAR_TOKEN: ${{ secrets.SONAR_TOKEN }}

.prettierrc.js

@@ -4,4 +4,5 @@ module.exports = {
     singleQuote: true,
     printWidth: 120,
     tabWidth: 4,
+    endOfLine: 'auto',
 };

.travis.yml

@@ -43,43 +43,51 @@ describe('Component', () => {
 
             render(<SignaturePad ref={instance} redrawOnResize />);
 
-            instance.current!.clear();
+            const signaturePad = instance.current as SignaturePad;
 
-            expect(instance.current!.isEmpty()).toBeTruthy();
+            signaturePad.clear();
 
-            instance.current!.fromDataURL(signature);
+            expect(signaturePad.isEmpty()).toBeTruthy();
 
-            expect(instance.current!.isEmpty()).toBeFalsy();
+            signaturePad.fromDataURL(signature);
+
+            expect(signaturePad.isEmpty()).toBeFalsy();
         });
 
         it('clears the signature pad', () => {
             const instance = React.createRef<SignaturePad>();
 
             render(<SignaturePad ref={instance} redrawOnResize />);
 
-            instance.current!.fromDataURL(signature);
+            const signaturePad = instance.current as SignaturePad;
+
+            signaturePad.fromDataURL(signature);
 
-            expect(instance.current!.isEmpty()).toBeFalsy();
+            expect(signaturePad.isEmpty()).toBeFalsy();
 
-            instance.current!.clear();
+            signaturePad.clear();
 
-            expect(instance.current!.isEmpty()).toBeTruthy();
+            expect(signaturePad.isEmpty()).toBeTruthy();
         });
 
         it('returns the underlying signature pad instance', () => {
             const instance = React.createRef<SignaturePad>();
 
             render(<SignaturePad ref={instance} redrawOnResize />);
 
-            expect(instance.current!.instance).toBeInstanceOf(SigPad);
+            const signaturePad = instance.current as SignaturePad;
+
+            expect(signaturePad.instance).toBeInstanceOf(SigPad);
         });
 
         it('returns a ref to the underlying HTML canvas element', () => {
             const instance = React.createRef<SignaturePad>();
 
             render(<SignaturePad ref={instance} redrawOnResize />);
 
-            expect(instance.current!.canvas).toBeInstanceOf(Object);
+            const signaturePad = instance.current as SignaturePad;
+
+            expect(signaturePad.canvas).toBeInstanceOf(Object);
         });
 
         [
@@ -107,22 +115,27 @@ describe('Component', () => {
 
             render(<SignaturePad ref={instance} redrawOnResize />);
 
-            expect(instance.current!.toDataURL()).toContain('data:image/png;base64');
+            const signaturePad = instance.current as SignaturePad;
+
+            expect(signaturePad.toDataURL()).toContain('data:image/png;base64');
         });
 
         it('returns a signature as an array of data points', () => {
             const instance = React.createRef<SignaturePad>();
 
             render(<SignaturePad ref={instance} redrawOnResize />);
 
-            expect(instance.current!.toData()).toHaveLength(0);
+            const signaturePad = instance.current as SignaturePad;
+
+            expect(signaturePad.toData()).toHaveLength(0);
         });
 
         it('draws a signature from an array of data points', () => {
             const instance = React.createRef<SignaturePad>();
 
             render(<SignaturePad ref={instance} redrawOnResize />);
 
+            const signaturePad = instance.current as SignaturePad;
             const data = [
                 {
                     dotSize: 0,
@@ -133,19 +146,20 @@ describe('Component', () => {
                 },
             ];
 
-            instance.current!.fromData(data);
+            signaturePad.fromData(data);
 
-            expect(instance.current!.toData()).toStrictEqual(data);
+            expect(signaturePad.toData()).toStrictEqual(data);
         });
 
         it('unbinds all event handlers', () => {
             const instance = React.createRef<SignaturePad>();
 
             render(<SignaturePad ref={instance} redrawOnResize />);
 
-            const spy = jest.spyOn(instance.current!.instance, 'off');
+            const signaturePad = instance.current as SignaturePad;
+            const spy = jest.spyOn(signaturePad.instance, 'off');
 
-            instance.current!.off();
+            signaturePad.off();
 
             expect(spy).toHaveBeenCalled();
 
@@ -157,9 +171,10 @@ describe('Component', () => {
 
             render(<SignaturePad ref={instance} redrawOnResize />);
 
-            const spy = jest.spyOn(instance.current!.instance, 'on');
+            const signaturePad = instance.current as SignaturePad;
+            const spy = jest.spyOn(signaturePad.instance, 'on');
 
-            instance.current!.on();
+            signaturePad.on();
 
             expect(spy).toHaveBeenCalled();
 
@@ -171,11 +186,12 @@ describe('Component', () => {
 
             render(<SignaturePad ref={instance} />);
 
-            const spy = jest.spyOn(instance.current!.instance, 'clear');
+            const signaturePad = instance.current as SignaturePad;
+            const spy = jest.spyOn(signaturePad.instance, 'clear');
 
             scaleCanvas(768, 768);
             act(() => {
-                instance.current!.handleResize();
+                signaturePad.handleResize();
             });
 
             expect(spy).toHaveBeenCalled();
@@ -186,11 +202,12 @@ describe('Component', () => {
 
             render(<SignaturePad ref={instance} redrawOnResize />);
 
-            const spy = jest.spyOn(instance.current!.instance, 'toDataURL');
+            const signaturePad = instance.current as SignaturePad;
+            const spy = jest.spyOn(signaturePad.instance, 'toDataURL');
 
             scaleCanvas(768, 768);
             act(() => {
-                instance.current!.handleResize();
+                signaturePad.handleResize();
             });
 
             expect(spy).toHaveBeenCalled();
@@ -201,9 +218,10 @@ describe('Component', () => {
 
             render(<SignaturePad ref={instance} redrawOnResize />);
 
-            const spy = jest.spyOn(instance.current!.instance, 'toDataURL');
+            const signaturePad = instance.current as SignaturePad;
+            const spy = jest.spyOn(signaturePad.instance, 'toDataURL');
 
-            instance.current!.handleResize();
+            signaturePad.handleResize();
 
             expect(spy).not.toHaveBeenCalled();
         });

__tests__/SignaturePad.test.tsx

@@ -3,4 +3,8 @@ import { createRoot } from 'react-dom/client';
 
 import Layout from './Layout';
 
-createRoot(document.getElementById('root')!).render(<Layout />);
+const element = document.getElementById('root');
+
+if (element) {
+    createRoot(element).render(<Layout />);
+}