Chart.js: Controller: TypeError: class constructors must be invoked with 'new'

Expected Behavior

Following the documentation about the controllers and the classic way to implement them, the following code works with beta6:

// Constructor
function Charbamyline() {
  Chart.controllers.line.apply(this, arguments);
}
Charbamyline.prototype = Object.create(Chart.controllers.line.prototype);
Charbamyline.prototype.constructor = Charbamyline;
// --------------------
// Overrided methods
// --------------------
// Initializes the controller
Charbamyline.prototype.initialize = function() {
	Chart.controllers.line.prototype.initialize.apply(this, arguments);
};
// Create elements for each piece of data in the dataset. Store elements in an array on the dataset as dataset.metaData
Charbamyline.prototype.addElements = function() {
	Chart.controllers.line.prototype.addElements.apply(this, arguments);
};
// Draw the representation of the dataset
Charbamyline.prototype.draw = function() {
	Chart.controllers.line.prototype.draw.apply(this, arguments);
};
// Remove hover styling from the given element
Charbamyline.prototype.removeHoverStyle = function() {
	Chart.controllers.line.prototype.removeHoverStyle.apply(this, arguments);
};
// Add hover styling to the given element
Charbamyline.prototype.setHoverStyle = function() {
	Chart.controllers.line.prototype.setHoverStyle.apply(this, arguments);
};
// Update the elements in response to new data
Charbamyline.prototype.update = function() {
	Chart.controllers.line.prototype.update.apply(this, arguments);
};
// Ensures that the dataset represented by this controller is linked to a scale. 
// Overridden to helpers.noop in the polar area and doughnut controllers as these chart types using a single scale
Charbamyline.prototype.linkScales = function() {
	Chart.controllers.line.prototype.linkScales.apply(this, arguments);
};
// Called by the main chart controller when an update is triggered.
// The default implementation handles the number of data points changing and creating elements appropriately.
Charbamyline.prototype.buildOrUpdateElements = function() {
	Chart.controllers.line.prototype.buildOrUpdateElements.apply(this, arguments);
};
// --------------------
// Register to CHART.JS
// --------------------
// sets the controller id
Charbamyline.id = 'myline'; 
// copies the default options of extended chart type
Charbamyline.defaults = Chart.defaults.controllers.line; 
// registers into CHART.JS
Chart.register(Charbamyline);

Current Behavior

With dist/master, the above doesn’t work anymore, with the following exception:

Uncaught TypeError: Class constructor LineController cannot be invoked without 'new'
    at new Charbamyline (Line Chart.html:38)
    at Chart.buildOrUpdateControllers (chart.js:5587)
    at Chart.update (chart.js:5620)
    at new Chart (chart.js:5380)
    at window.onload (Line Chart.html:177)

Steps to Reproduce

https://codepen.io/stockinail/pen/YzWjywq

Changing the CHART.JS version (importing beta6), it works.

Environment

  • Chart.js version: dist/master
  • Browser name and version: FF 82.0.3

About this issue

  • Original URL
  • State: closed
  • Created 4 years ago
  • Comments: 16 (16 by maintainers)

Most upvoted comments

Lets have this open at least until the docs are updated