mirror of
https://github.com/chartjs/Chart.js.git
synced 2024-10-06 12:19:08 +02:00
009ae4dec6
See discussion in the issue for context and possible approaches. When invoking update() inside an event handler, such as onHover, `options.hover.animationDuration` was not being respected. Given that some use cases may require additional animation properties for the manual update call, this commit changes that method signature to accept a configuration object. This object provides backwards compatibility with duration and lazy properties, and also introduces the easing property so that the event animation is different from the global one. Add tests that guarantee that when update is called manually with arguments, it properly builds the _bufferedRequest or calls render with the proper arguments. It includes test cases for when update is called with legacy arguments (duration and lazy) instead of the config object. .update() documentation was previously updated but .render() was left out. Since the backwards compatible change was also made to render(), this commit adds documentation for it.
219 lines
5.7 KiB
JavaScript
219 lines
5.7 KiB
JavaScript
describe('Deprecations', function() {
|
|
describe('Version 2.7.0', function() {
|
|
describe('Chart.Controller.update(duration, lazy)', function() {
|
|
beforeEach(function() {
|
|
this.chart = acquireChart({
|
|
type: 'doughnut',
|
|
options: {
|
|
animation: {
|
|
easing: 'linear',
|
|
duration: 500
|
|
}
|
|
}
|
|
});
|
|
|
|
this.addAnimationSpy = spyOn(Chart.animationService, 'addAnimation');
|
|
});
|
|
|
|
it('should add an animation with the provided options', function() {
|
|
this.chart.update(800, false);
|
|
|
|
expect(this.addAnimationSpy).toHaveBeenCalledWith(
|
|
this.chart,
|
|
jasmine.objectContaining({easing: 'linear'}),
|
|
800,
|
|
false
|
|
);
|
|
});
|
|
});
|
|
|
|
describe('Chart.Controller.render(duration, lazy)', function() {
|
|
beforeEach(function() {
|
|
this.chart = acquireChart({
|
|
type: 'doughnut',
|
|
options: {
|
|
animation: {
|
|
easing: 'linear',
|
|
duration: 500
|
|
}
|
|
}
|
|
});
|
|
|
|
this.addAnimationSpy = spyOn(Chart.animationService, 'addAnimation');
|
|
});
|
|
|
|
it('should add an animation with the provided options', function() {
|
|
this.chart.render(800, true);
|
|
|
|
expect(this.addAnimationSpy).toHaveBeenCalledWith(
|
|
this.chart,
|
|
jasmine.objectContaining({easing: 'linear'}),
|
|
800,
|
|
true
|
|
);
|
|
});
|
|
});
|
|
});
|
|
|
|
describe('Version 2.6.0', function() {
|
|
// https://github.com/chartjs/Chart.js/issues/2481
|
|
describe('Chart.Controller', function() {
|
|
it('should be defined and an alias of Chart', function() {
|
|
expect(Chart.Controller).toBeDefined();
|
|
expect(Chart.Controller).toBe(Chart);
|
|
});
|
|
it('should be prototype of chart instances', function() {
|
|
var chart = acquireChart({});
|
|
expect(chart.constructor).toBe(Chart.Controller);
|
|
expect(chart instanceof Chart.Controller).toBeTruthy();
|
|
expect(Chart.Controller.prototype.isPrototypeOf(chart)).toBeTruthy();
|
|
});
|
|
});
|
|
|
|
describe('chart.chart', function() {
|
|
it('should be defined and an alias of chart', function() {
|
|
var chart = acquireChart({});
|
|
var proxy = chart.chart;
|
|
expect(proxy).toBeDefined();
|
|
expect(proxy).toBe(chart);
|
|
});
|
|
it('should defined previously existing properties', function() {
|
|
var chart = acquireChart({}, {
|
|
canvas: {
|
|
style: 'width: 140px; height: 320px'
|
|
}
|
|
});
|
|
|
|
var proxy = chart.chart;
|
|
expect(proxy.config instanceof Object).toBeTruthy();
|
|
expect(proxy.controller instanceof Chart.Controller).toBeTruthy();
|
|
expect(proxy.canvas instanceof HTMLCanvasElement).toBeTruthy();
|
|
expect(proxy.ctx instanceof CanvasRenderingContext2D).toBeTruthy();
|
|
expect(proxy.currentDevicePixelRatio).toBe(window.devicePixelRatio || 1);
|
|
expect(proxy.aspectRatio).toBe(140/320);
|
|
expect(proxy.height).toBe(320);
|
|
expect(proxy.width).toBe(140);
|
|
});
|
|
});
|
|
|
|
describe('Chart.Animation.animationObject', function() {
|
|
it('should be defined and an alias of Chart.Animation', function(done) {
|
|
var animation = null;
|
|
|
|
acquireChart({
|
|
options: {
|
|
animation: {
|
|
duration: 50,
|
|
onComplete: function(arg) {
|
|
animation = arg;
|
|
}
|
|
}
|
|
}
|
|
});
|
|
|
|
setTimeout(function() {
|
|
expect(animation).not.toBeNull();
|
|
expect(animation.animationObject).toBeDefined();
|
|
expect(animation.animationObject).toBe(animation);
|
|
done();
|
|
}, 200);
|
|
});
|
|
});
|
|
|
|
describe('Chart.Animation.chartInstance', function() {
|
|
it('should be defined and an alias of Chart.Animation.chart', function(done) {
|
|
var animation = null;
|
|
var chart = acquireChart({
|
|
options: {
|
|
animation: {
|
|
duration: 50,
|
|
onComplete: function(arg) {
|
|
animation = arg;
|
|
}
|
|
}
|
|
}
|
|
});
|
|
|
|
setTimeout(function() {
|
|
expect(animation).not.toBeNull();
|
|
expect(animation.chartInstance).toBeDefined();
|
|
expect(animation.chartInstance).toBe(chart);
|
|
done();
|
|
}, 200);
|
|
});
|
|
});
|
|
|
|
describe('Chart.elements.Line: fill option', function() {
|
|
it('should decode "zero", "top" and "bottom" as "origin", "start" and "end"', function() {
|
|
var chart = window.acquireChart({
|
|
type: 'line',
|
|
data: {
|
|
datasets: [
|
|
{fill: 'zero'},
|
|
{fill: 'bottom'},
|
|
{fill: 'top'},
|
|
]
|
|
}
|
|
});
|
|
|
|
['origin', 'start', 'end'].forEach(function(expected, index) {
|
|
var meta = chart.getDatasetMeta(index);
|
|
expect(meta.$filler).toBeDefined();
|
|
expect(meta.$filler.fill).toBe(expected);
|
|
});
|
|
});
|
|
});
|
|
});
|
|
|
|
describe('Version 2.5.0', function() {
|
|
describe('Chart.PluginBase', function() {
|
|
it('should exist and extendable', function() {
|
|
expect(Chart.PluginBase).toBeDefined();
|
|
expect(Chart.PluginBase.extend).toBeDefined();
|
|
});
|
|
});
|
|
|
|
describe('IPlugin.afterScaleUpdate', function() {
|
|
it('should be called after the chart as been layed out', function() {
|
|
var sequence = [];
|
|
var plugin = {};
|
|
var hooks = [
|
|
'beforeLayout',
|
|
'afterScaleUpdate',
|
|
'afterLayout'
|
|
];
|
|
|
|
var override = Chart.layoutService.update;
|
|
Chart.layoutService.update = function() {
|
|
sequence.push('layoutUpdate');
|
|
override.apply(this, arguments);
|
|
};
|
|
|
|
hooks.forEach(function(name) {
|
|
plugin[name] = function() {
|
|
sequence.push(name);
|
|
};
|
|
});
|
|
|
|
window.acquireChart({plugins: [plugin]});
|
|
expect(sequence).toEqual([].concat(
|
|
'beforeLayout',
|
|
'layoutUpdate',
|
|
'afterScaleUpdate',
|
|
'afterLayout'
|
|
));
|
|
});
|
|
});
|
|
});
|
|
|
|
describe('Version 2.1.5', function() {
|
|
// https://github.com/chartjs/Chart.js/pull/2752
|
|
describe('Chart.pluginService', function() {
|
|
it('should be defined and an alias of Chart.plugins', function() {
|
|
expect(Chart.pluginService).toBeDefined();
|
|
expect(Chart.pluginService).toBe(Chart.plugins);
|
|
});
|
|
});
|
|
});
|
|
});
|