TypeError Cannot read property 'points' of undefined.

[ndbroadbent]

Do you want to request a feature or report a bug?

Bug

What is the current behavior?

My app is crashing and sending the following error report to Sentry:

Version: Signature Pad v3.0.0-beta.3

TypeError: Cannot read property 'points' of undefined

TypeError: Cannot read property 'points' of undefined
  at _strokeUpdate(./node_modules/signature_pad/dist/signature_pad.m.js:278:43)
  at _strokeEnd(./node_modules/signature_pad/dist/signature_pad.m.js:298:14)
  at HTMLDocument._handleMouseUp(./node_modules/signature_pad/dist/signature_pad.m.js:141:22)

    _strokeUpdate(event) {
        const x = event.clientX;
        const y = event.clientY;
        const point = this._createPoint(x, y);
        const lastPointGroup = this._data[this._data.length - 1];
=>      const lastPoints = lastPointGroup.points;
        const lastPoint = lastPoints.length > 0 && lastPoints[lastPoints.length - 1];
        const isLastPointTooClose = lastPoint ? point.distanceTo(lastPoint) <= this.minDistance : false;
        const color = lastPointGroup.color;
        if (!lastPoint || !(lastPoint && isLastPointTooClose)) {
            const curve = this._addPoint(point);

...

       this._handleMouseUp = (event) => {
            if (event.which === 1 && this._mouseButtonDown) {
                this._mouseButtonDown = false;
=>              this._strokeEnd(event);
            }
        };

I've found the source code here: https://github.com/szimek/signature_pad/blob/master/src/signature_pad.ts#L271-L275

    const lastPointGroup = this._data[this._data.length - 1];
    const lastPoints = lastPointGroup.points;

Not sure how this happened, and I also can't reproduce it on my computer. Sorry I don't have any more information yet, but I'll try to add some more context to the error reports if it happens again.

[ndbroadbent]

I think I've figured out a possible way that this could be caused. My application calls clear(), and this resets this._data to []. Sometimes this is called asynchronously after data is updated. If someone is in the middle of drawing a signature, then each _strokeUpdate event will crash with this error.

this._data[this._data.length - 1]
// this._data.length == 0
=> this._data[-1]
=> null

I'm still not 100% sure where this is being triggered in my app, but it might be nice to protect against this case.

[ndbroadbent]

Fixed in #481