[BUG] Browser crashes with "type: 'time'" for Y axis while hidden

[usethe4ce]

The browser freezes/crashes in this minimal test case (uncomment the indicated line to try it):

https://jsfiddle.net/aLk05ptk/10/

This is using 2.7.1.

From what testing I could do so far, the problem does not happen if the canvas is visible initially, nor when the axis type is "linear", nor when only the X axis is "time".

[jcopperfield]

This bug is caused in part by the ChartJS layoutservice, which doesn't sanitize sizes to be positive. Unfortunately in the case of a time axis this negative value bubbles through buildTicks, generate, getLabelCapacity and can cause the computation of the time stepSize to become negative, which will result in an endless loop.
Changing the following line in scale.time.js in the function determineStepSize will resolve the problem.

Chart.js/src/scales/scale.time.js

Line 243 in 6f34b22

return Math.ceil(range / ((capacity || 1) * milliseconds));

// possible fix
capacity = (capacity && capacity > 0) ? capacity : 1; // guarantee capacity is positive
return Math.ceil(range / (capacity * milliseconds));

Edit: added link to current code.

[jcopperfield]

@etimberg or would it be better/preferred to make the sanity check inside the getLabelCapacity method?

Chart.js/src/scales/scale.time.js

Line 751 in 6f34b22

return Math.floor(innerWidth / tickLabelWidth);

var capacity = Math.floor(innerWidth / tickLabelWidth);
return (capacity && capacity > 0) ? capacity : 1;

Edit:
Or should the computed stepSize in the generate method be sanitized?

Chart.js/src/scales/scale.time.js

Lines 320 to 322 in 6f34b22

	if (!stepSize) {
	stepSize = determineStepSize(min, max, minor, capacity);
	}

if (stepSize <= 0) {
    stepSize = 1;
}

[etimberg]

@jcopperfield I wonder how hard it is to sanitize the size to not be negative in the layout service. That would prevent other potential issues in the future

[jcopperfield]

@etimberg I agree that having the layout service take care of this would be best, however it seems that the generate is called from buildTicks which is called in the update process. I think that getLabelCapacity should always return a positive capacity. This would solve the problem and would also make the line capacity || 1 in determineStepSize unnecessary.

[jcopperfield]

Another possibility would be to skip the tick creation loop if the stepSize is invalid as it would also get rid of the dead-loop due to user misconfiguration.

Chart.js/src/scales/scale.time.js

Lines 349 to 351 in 6f34b22

	for (; time < last; time.add(stepSize, minor)) {
	ticks.push(+time);
	}

if (stepSize > 0) {
    for (; time < last; time.add(stepSize, minor)) {
        ticks.push(+time);
    }
}

[etimberg]

I agree that the label capacity should always be positive so I would recommend that as the solution for the time scale