},
visible: {
type: 'boolean',
+ easing: 'linear',
fn: v => v | 0 // for keeping the dataset visible all the way through the animation
},
}
me.notifyPlugins('resize', {size: newSize});
- callCallback(options.onResize, [newSize], me);
+ callCallback(options.onResize, [me, newSize], me);
if (me.attached) {
if (me._doResize()) {
// singleton instance
export default new Defaults({
- _scriptable: (name) => name !== 'onClick' && name !== 'onHover',
+ _scriptable: (name) => !name.startsWith('on'),
_indexable: (name) => name !== 'events',
hover: {
_fallback: 'interaction'
describe('default transitions', function() {
describe('hide', function() {
it('should keep dataset visible through the animation', function(done) {
- let test = false;
let count = 0;
window.acquireChart({
type: 'line',
},
options: {
animation: {
- duration: 100,
+ duration: 0,
onProgress: (args) => {
- if (test) {
- if (args.currentStep < args.numSteps) {
- // while animating, visible should be truthly
- expect(args.chart.getDatasetMeta(0).visible).toBeTruthy();
- count++;
- }
+ if (!args.chart.isDatasetVisible(0) && args.currentStep / args.numSteps < 0.9) {
+ // while animating, visible should be truthly
+ // sometimes its not, thats why we check only up to 90% of the animation
+ expect(args.chart.getDatasetMeta(0).visible).toBeTruthy();
+ count++;
}
},
onComplete: (args) => {
- if (!test) {
- test = true;
- setTimeout(() => args.chart.hide(0), 1);
+ if (args.chart.isDatasetVisible(0)) {
+ args.chart.hide(0);
} else {
// and when finished, it should be false
expect(args.chart.getDatasetMeta(0).visible).toBeFalsy();
done();
}
}
+ },
+ transitions: {
+ hide: {
+ animation: {
+ duration: 100
+ }
+ }
}
}
});
});
});
+ it('should call onResize with correct arguments and context', function() {
+ let count = 0;
+ let correctThis = false;
+ let size = {
+ width: 0,
+ height: 0
+ };
+ acquireChart({
+ options: {
+ responsive: true,
+ maintainAspectRatio: false,
+ onResize(chart, newSize) {
+ count++;
+ correctThis = this === chart;
+ size.width = newSize.width;
+ size.height = newSize.height;
+ }
+ }
+ }, {
+ canvas: {
+ style: 'width: 150px; height: 245px'
+ },
+ wrapper: {
+ style: 'width: 300px; height: 350px'
+ }
+ });
+
+ expect(count).toEqual(1);
+ expect(correctThis).toBeTrue();
+ expect(size).toEqual({width: 300, height: 350});
+ });
+
+
it('should resize the canvas when parent width changes', function(done) {
var chart = acquireChart({
options: {