feat: add canvasContextOptions API for use by the getContext (#761)

* Add willReadFrequently to getContext

* Pass it throught options

* Default to false

* Rename to canvasContextOptions

* Update readme

* Delete package-lock.json

* Url to MDN page

README.md

@@ -105,6 +105,8 @@ signaturePad.on();
 <dd>(string) Color used to draw the lines. Can be any color format accepted by <code>context.fillStyle</code>. Defaults to <code>"black"</code>.</dd>
 <dt>velocityFilterWeight</dt>
 <dd>(float) Weight used to modify new velocity based on the previous velocity. Defaults to <code>0.7</code>.</dd>
+<dt>canvasContextOptions</dt>
+<dd>(CanvasRenderingContext2DSettings) part of the Canvas API, provides the 2D rendering context for the drawing surface of a <code>canvas</code> element. It is used for drawing shapes, text, images, and other objects (<a href="https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D/getContextAttributes">MDN</a>).</dd>
 </dl>
 
 You can set options during initialization:

src/signature_pad.ts

@@ -48,6 +48,7 @@ export interface Options extends Partial<PointGroupOptions> {
   minDistance?: number;
   backgroundColor?: string;
   throttle?: number;
+  canvasContextOptions?: CanvasRenderingContext2DSettings;
 }
 
 export interface PointGroup extends PointGroupOptions {
@@ -65,6 +66,7 @@ export default class SignaturePad extends SignatureEventTarget {
   public compositeOperation: GlobalCompositeOperation;
   public backgroundColor: string;
   public throttle: number;
+  public canvasContextOptions: CanvasRenderingContext2DSettings;
 
   // Private stuff
   /* tslint:disable: variable-name */
@@ -94,11 +96,17 @@ export default class SignaturePad extends SignatureEventTarget {
     this.penColor = options.penColor || 'black';
     this.backgroundColor = options.backgroundColor || 'rgba(0,0,0,0)';
     this.compositeOperation = options.compositeOperation || 'source-over';
+    this.canvasContextOptions = (
+      'canvasContextOptions' in options ? options.canvasContextOptions : {}
+    ) as CanvasRenderingContext2DSettings;
 
     this._strokeMoveUpdate = this.throttle
       ? throttle(SignaturePad.prototype._strokeUpdate, this.throttle)
       : SignaturePad.prototype._strokeUpdate;
-    this._ctx = canvas.getContext('2d') as CanvasRenderingContext2D;
+    this._ctx = canvas.getContext(
+      '2d',
+      this.canvasContextOptions,
+    ) as CanvasRenderingContext2D;
 
     this.clear();