Controller: TypeError: class constructors must be invoked with 'new'
See original GitHub issueExpected 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
Issue Analytics
- State:
- Created 3 years ago
- Comments:16 (16 by maintainers)
Top Results From Across the Web
Class constructor Controller cannot be invoked without 'new ...
I got an error Uncaught TypeError: Class constructor Controller cannot be invoked without 'new' at new _default ...
Read more >Class constructor cannot be invoked without 'new' in JS
To solve the "Class constructor cannot be invoked without 'new'" error, extend the Component class when defining a class in a React. js...
Read more >Upgraded to Stimulus 3, console error Cannot call a class ...
Now, all my controllers generates the console error Unhandled Promise Rejection: TypeError: Cannot call a class constructor without |new| .
Read more >Python Class Constructors: Control Your Object Instantiation
Then you create a new instance of SomeClass by calling the class with a pair of parentheses. In this example, you don't need...
Read more >class constructors must be invoked with 'new' - three.js forum
There's nothing special to do — extend the class normally using ES6 Class syntax. If you're getting this error and you're not intentionally ......
Read more >Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start FreeTop Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
Top GitHub Comments
Lets have this open at least until the docs are updated
@stockiNail yeah, thats it.