"picomatch": "^2.2.2"
}
},
+ "@types/component-emitter": {
+ "version": "1.2.10",
+ "resolved": "https://registry.npmjs.org/@types/component-emitter/-/component-emitter-1.2.10.tgz",
+ "integrity": "sha512-bsjleuRKWmGqajMerkzox19aGbscQX5rmmvvXl3wlIp5gMG1HgkiwPxsN5p070fBDKTNSPgojVbuY1+HWMbFhg==",
+ "dev": true
+ },
+ "@types/cookie": {
+ "version": "0.4.0",
+ "resolved": "https://registry.npmjs.org/@types/cookie/-/cookie-0.4.0.tgz",
+ "integrity": "sha512-y7mImlc/rNkvCRmg8gC3/lj87S7pTUIJ6QGjwHR9WQJcFs+ZMTOaoPrkdFA/YdbuqVEmEbb5RdhVxMkAcgOnpg==",
+ "dev": true
+ },
+ "@types/cors": {
+ "version": "2.8.9",
+ "resolved": "https://registry.npmjs.org/@types/cors/-/cors-2.8.9.tgz",
+ "integrity": "sha512-zurD1ibz21BRlAOIKP8yhrxlqKx6L9VCwkB5kMiP6nZAhoF5MvC7qS1qPA7nRcr1GJolfkQC7/EAL4hdYejLtg==",
+ "dev": true
+ },
"@types/estree": {
"version": "0.0.39",
"resolved": "https://registry.npmjs.org/@types/estree/-/estree-0.0.39.tgz",
"dev": true
},
"chartjs-test-utils": {
- "version": "0.1.2",
- "resolved": "https://registry.npmjs.org/chartjs-test-utils/-/chartjs-test-utils-0.1.2.tgz",
- "integrity": "sha512-l56FYfquEbUfy8qV+IvPq2Z0jeG6bYmCvKvpAXMNY8c49L3e2uvJ5H3nMaDfkwBHMTwqE+Gt9Uy7TRVzqxJp8w==",
+ "version": "0.2.1",
+ "resolved": "https://registry.npmjs.org/chartjs-test-utils/-/chartjs-test-utils-0.2.1.tgz",
+ "integrity": "sha512-8UIembPlq91WBtwWhYeJ9enA+3iEPq8+YSiXwc8Li2OncjdyeXUzM4AMQfPBymjcgL4GdZNAx+qmsHHlAPN1sg==",
"dev": true,
"requires": {
- "jasmine": "^3.6.3",
- "karma": "^5.2.3",
+ "jasmine": "^3.6.4",
+ "karma": "^6.1.0",
"karma-jasmine": "^4.0.1",
"pixelmatch": "^5.2.1"
+ },
+ "dependencies": {
+ "@types/node": {
+ "version": "14.14.25",
+ "resolved": "https://registry.npmjs.org/@types/node/-/node-14.14.25.tgz",
+ "integrity": "sha512-EPpXLOVqDvisVxtlbvzfyqSsFeQxltFbluZNRndIb8tr9KiBnYNLzrc1N3pyKUCww2RNrfHDViqDWWE1LCJQtQ==",
+ "dev": true
+ },
+ "chokidar": {
+ "version": "3.5.1",
+ "resolved": "https://registry.npmjs.org/chokidar/-/chokidar-3.5.1.tgz",
+ "integrity": "sha512-9+s+Od+W0VJJzawDma/gvBNQqkTiqYTWLuZoyAsivsI4AaWTCzHG06/TMjsf1cYe9Cb97UCEhjz7HvnPk2p/tw==",
+ "dev": true,
+ "requires": {
+ "anymatch": "~3.1.1",
+ "braces": "~3.0.2",
+ "fsevents": "~2.3.1",
+ "glob-parent": "~5.1.0",
+ "is-binary-path": "~2.1.0",
+ "is-glob": "~4.0.1",
+ "normalize-path": "~3.0.0",
+ "readdirp": "~3.5.0"
+ }
+ },
+ "component-emitter": {
+ "version": "1.3.0",
+ "resolved": "https://registry.npmjs.org/component-emitter/-/component-emitter-1.3.0.tgz",
+ "integrity": "sha512-Rd3se6QB+sO1TwqZjscQrurpEPIfO0/yYnSin6Q/rD3mOutHvUrCAhJub3r90uNb+SESBuE0QYoB90YdfatsRg==",
+ "dev": true
+ },
+ "debug": {
+ "version": "4.3.1",
+ "resolved": "https://registry.npmjs.org/debug/-/debug-4.3.1.tgz",
+ "integrity": "sha512-doEwdvm4PCeK4K3RQN2ZC2BYUBaxwLARCqZmMjtF8a51J2Rb0xpVloFRnCODwqjpwnAoao4pelN8l3RJdv3gRQ==",
+ "dev": true,
+ "requires": {
+ "ms": "2.1.2"
+ }
+ },
+ "fsevents": {
+ "version": "2.3.2",
+ "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.2.tgz",
+ "integrity": "sha512-xiqMQR4xAeHTuB9uWm+fFRcIOgKBMiOBP+eXiyT7jsgVCq1bkVygt00oASowB7EdtpOHaaPgKt812P9ab+DDKA==",
+ "dev": true,
+ "optional": true
+ },
+ "jasmine": {
+ "version": "3.6.4",
+ "resolved": "https://registry.npmjs.org/jasmine/-/jasmine-3.6.4.tgz",
+ "integrity": "sha512-hIeOou6y0BgCOKYgXYveQvlY+PTHgDPajFf+vLCYbMTQ+VjAP9+EQv0nuC9+gyCAAWISRFauB1XUb9kFuOKtcQ==",
+ "dev": true,
+ "requires": {
+ "glob": "^7.1.6",
+ "jasmine-core": "~3.6.0"
+ }
+ },
+ "karma": {
+ "version": "6.1.0",
+ "resolved": "https://registry.npmjs.org/karma/-/karma-6.1.0.tgz",
+ "integrity": "sha512-QmRZ6HdKe6mHd89Az6yb85URRyDbXmn2IBo3lic7cwkkLjDWpjrMJxPAKlwNa5dFM1iHdT+kjtNJM0J5YAH90A==",
+ "dev": true,
+ "requires": {
+ "body-parser": "^1.19.0",
+ "braces": "^3.0.2",
+ "chokidar": "^3.4.2",
+ "colors": "^1.4.0",
+ "connect": "^3.7.0",
+ "di": "^0.0.1",
+ "dom-serialize": "^2.2.1",
+ "glob": "^7.1.6",
+ "graceful-fs": "^4.2.4",
+ "http-proxy": "^1.18.1",
+ "isbinaryfile": "^4.0.6",
+ "lodash": "^4.17.19",
+ "log4js": "^6.2.1",
+ "mime": "^2.4.5",
+ "minimatch": "^3.0.4",
+ "qjobs": "^1.2.0",
+ "range-parser": "^1.2.1",
+ "rimraf": "^3.0.2",
+ "socket.io": "^3.1.0",
+ "source-map": "^0.6.1",
+ "tmp": "0.2.1",
+ "ua-parser-js": "^0.7.23",
+ "yargs": "^16.1.1"
+ }
+ },
+ "readdirp": {
+ "version": "3.5.0",
+ "resolved": "https://registry.npmjs.org/readdirp/-/readdirp-3.5.0.tgz",
+ "integrity": "sha512-cMhu7c/8rdhkHXWsY+osBhfSy0JikwpHK/5+imo+LpeasTF8ouErHrlYkwT0++njiyuDvc7OFY5T3ukvZ8qmFQ==",
+ "dev": true,
+ "requires": {
+ "picomatch": "^2.2.1"
+ }
+ },
+ "socket.io": {
+ "version": "3.1.1",
+ "resolved": "https://registry.npmjs.org/socket.io/-/socket.io-3.1.1.tgz",
+ "integrity": "sha512-7cBWdsDC7bbyEF6WbBqffjizc/H4YF1wLdZoOzuYfo2uMNSFjJKuQ36t0H40o9B20DO6p+mSytEd92oP4S15bA==",
+ "dev": true,
+ "requires": {
+ "@types/cookie": "^0.4.0",
+ "@types/cors": "^2.8.8",
+ "@types/node": "^14.14.10",
+ "accepts": "~1.3.4",
+ "base64id": "~2.0.0",
+ "debug": "~4.3.1",
+ "engine.io": "~4.1.0",
+ "socket.io-adapter": "~2.1.0",
+ "socket.io-parser": "~4.0.3"
+ }
+ },
+ "socket.io-adapter": {
+ "version": "2.1.0",
+ "resolved": "https://registry.npmjs.org/socket.io-adapter/-/socket.io-adapter-2.1.0.tgz",
+ "integrity": "sha512-+vDov/aTsLjViYTwS9fPy5pEtTkrbEKsw2M+oVSoFGw6OD1IpvlV1VPhUzNbofCQ8oyMbdYJqDtGdmHQK6TdPg==",
+ "dev": true
+ },
+ "socket.io-parser": {
+ "version": "4.0.4",
+ "resolved": "https://registry.npmjs.org/socket.io-parser/-/socket.io-parser-4.0.4.tgz",
+ "integrity": "sha512-t+b0SS+IxG7Rxzda2EVvyBZbvFPBCjJoyHuE0P//7OAsN23GItzDRdWa6ALxZI/8R5ygK7jAR6t028/z+7295g==",
+ "dev": true,
+ "requires": {
+ "@types/component-emitter": "^1.2.10",
+ "component-emitter": "~1.3.0",
+ "debug": "~4.3.1"
+ }
+ },
+ "source-map": {
+ "version": "0.6.1",
+ "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.6.1.tgz",
+ "integrity": "sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==",
+ "dev": true
+ },
+ "ua-parser-js": {
+ "version": "0.7.23",
+ "resolved": "https://registry.npmjs.org/ua-parser-js/-/ua-parser-js-0.7.23.tgz",
+ "integrity": "sha512-m4hvMLxgGHXG3O3fQVAyyAQpZzDOvwnhOTjYz5Xmr7r/+LpkNy3vJXdVRWgd1TkAb7NGROZuSy96CrlNVjA7KA==",
+ "dev": true
+ }
}
},
"chokidar": {
"safe-buffer": "~5.1.1"
}
},
+ "cookie": {
+ "version": "0.4.1",
+ "resolved": "https://registry.npmjs.org/cookie/-/cookie-0.4.1.tgz",
+ "integrity": "sha512-ZwrFkGJxUR3EIoXtO+yVE69Eb7KlixbaeAWfBQB9vVsNn/o+Yw69gBWSSDK825hQNdN+wF8zELf3dFNl/kxkUA==",
+ "dev": true
+ },
"core-js": {
"version": "2.6.11",
"resolved": "https://registry.npmjs.org/core-js/-/core-js-2.6.11.tgz",
"integrity": "sha1-tf1UIgqivFq1eqtxQMlAdUUDwac=",
"dev": true
},
+ "cors": {
+ "version": "2.8.5",
+ "resolved": "https://registry.npmjs.org/cors/-/cors-2.8.5.tgz",
+ "integrity": "sha512-KIHbLJqu73RGr/hnbrO9uBeixNGuvSQjul/jdFvS/KFSIH1hWVd1ng7zOHx+YrEfInLG7q4n6GHQ9cDtxv/P6g==",
+ "dev": true,
+ "requires": {
+ "object-assign": "^4",
+ "vary": "^1"
+ }
+ },
"coveralls": {
"version": "3.1.0",
"resolved": "https://registry.npmjs.org/coveralls/-/coveralls-3.1.0.tgz",
"integrity": "sha1-rT/0yG7C0CkyL1oCw6mmBslbP1k=",
"dev": true
},
+ "engine.io": {
+ "version": "4.1.1",
+ "resolved": "https://registry.npmjs.org/engine.io/-/engine.io-4.1.1.tgz",
+ "integrity": "sha512-t2E9wLlssQjGw0nluF6aYyfX8LwYU8Jj0xct+pAhfWfv/YrBn6TSNtEYsgxHIfaMqfrLx07czcMg9bMN6di+3w==",
+ "dev": true,
+ "requires": {
+ "accepts": "~1.3.4",
+ "base64id": "2.0.0",
+ "cookie": "~0.4.1",
+ "cors": "~2.8.5",
+ "debug": "~4.3.1",
+ "engine.io-parser": "~4.0.0",
+ "ws": "~7.4.2"
+ },
+ "dependencies": {
+ "debug": {
+ "version": "4.3.1",
+ "resolved": "https://registry.npmjs.org/debug/-/debug-4.3.1.tgz",
+ "integrity": "sha512-doEwdvm4PCeK4K3RQN2ZC2BYUBaxwLARCqZmMjtF8a51J2Rb0xpVloFRnCODwqjpwnAoao4pelN8l3RJdv3gRQ==",
+ "dev": true,
+ "requires": {
+ "ms": "2.1.2"
+ }
+ },
+ "engine.io-parser": {
+ "version": "4.0.2",
+ "resolved": "https://registry.npmjs.org/engine.io-parser/-/engine.io-parser-4.0.2.tgz",
+ "integrity": "sha512-sHfEQv6nmtJrq6TKuIz5kyEKH/qSdK56H/A+7DnAuUPWosnIZAS2NHNcPLmyjtY3cGS/MqJdZbUjW97JU72iYg==",
+ "dev": true,
+ "requires": {
+ "base64-arraybuffer": "0.1.4"
+ }
+ }
+ }
+ },
"engine.io-parser": {
"version": "2.2.1",
"resolved": "https://registry.npmjs.org/engine.io-parser/-/engine.io-parser-2.2.1.tgz",
"integrity": "sha512-fexhUFFPTGV8ybAtSIGbV6gOkSv8UtRbDBnAyLQw4QPKkgNlsH2ByPGtMUqdWkos6YCRmAqViwgZrJc/mRDzZQ==",
"dev": true
},
+ "object-assign": {
+ "version": "4.1.1",
+ "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz",
+ "integrity": "sha1-IQmtx5ZYh8/AXLvUQsrIv7s2CGM=",
+ "dev": true
+ },
"on-finished": {
"version": "2.3.0",
"resolved": "https://registry.npmjs.org/on-finished/-/on-finished-2.3.0.tgz",
"integrity": "sha1-f17oI66AUgfACvLfSoTsP8+lcLQ=",
"dev": true
},
+ "tmp": {
+ "version": "0.2.1",
+ "resolved": "https://registry.npmjs.org/tmp/-/tmp-0.2.1.tgz",
+ "integrity": "sha512-76SUhtfqR2Ijn+xllcI5P1oyannHNHByD80W1q447gU3mp9G9PSpGdWmjUOHRDPiHYacIk66W7ubDTuPF3BEtQ==",
+ "dev": true,
+ "requires": {
+ "rimraf": "^3.0.0"
+ }
+ },
"to-array": {
"version": "0.1.4",
"resolved": "https://registry.npmjs.org/to-array/-/to-array-0.1.4.tgz",
"spdx-expression-parse": "^3.0.0"
}
},
+ "vary": {
+ "version": "1.1.2",
+ "resolved": "https://registry.npmjs.org/vary/-/vary-1.1.2.tgz",
+ "integrity": "sha1-IpnwLG3tMNSllhsLn3RSShj2NPw=",
+ "dev": true
+ },
"verror": {
"version": "1.10.0",
"resolved": "https://registry.npmjs.org/verror/-/verror-1.10.0.tgz",
"integrity": "sha1-tSQ9jz7BqjXxNkYFvA0QNuMKtp8=",
"dev": true
},
+ "ws": {
+ "version": "7.4.3",
+ "resolved": "https://registry.npmjs.org/ws/-/ws-7.4.3.tgz",
+ "integrity": "sha512-hr6vCR76GsossIRsr8OLR9acVVm1jyfEWvhbNjtgPOrfvAlKzvyeg/P6r8RuDjRyrcQoPQT7K0DGEPc7Ae6jzA==",
+ "dev": true
+ },
"xmlhttprequest-ssl": {
"version": "1.5.5",
"resolved": "https://registry.npmjs.org/xmlhttprequest-ssl/-/xmlhttprequest-ssl-1.5.5.tgz",
"@typescript-eslint/eslint-plugin": "^4.11.1",
"@typescript-eslint/parser": "^4.11.1",
"chartjs-adapter-moment": "^0.1.2",
- "chartjs-test-utils": "^0.1.2",
+ "chartjs-test-utils": "^0.2.1",
"concurrently": "^5.3.0",
"coveralls": "^3.1.0",
"cross-env": "^7.0.3",
-parserOptions:
- ecmaVersion: 6
-
env:
- es6: true
jasmine: true
- commonjs: true
- es2017: false
- es2020: false
globals:
acquireChart: true
moment: true
waitForResize: true
-# https://eslint.org/docs/rules/
-rules:
- # Best Practices
- complexity: 0
- max-statements: [0, 100]
- # Loosen up for tests
- no-var: 0
- prefer-arrow-callback: 0
- prefer-spread: 0
- prefer-const: 0
- object-shorthand: 0
- import/no-commonjs: 0
- no-invalid-this: 0
- array-callback-return: 0
- operator-assignment: 0
- no-empty-function: 0
- import/no-namespace: 0
- prefer-rest-params: 0
- no-unneeded-ternary: 0
});
});
- it ('should handle default hover styles', function(done) {
+ it ('should handle default hover styles', async function() {
var chart = this.chart;
var point = chart.getDatasetMeta(0).data[0];
- afterEvent(chart, 'mousemove', function() {
- expect(point.options.backgroundColor).toBe('#3187DD');
- expect(point.options.borderColor).toBe('#175A9D');
- expect(point.options.borderWidth).toBe(1);
- expect(point.options.radius).toBe(20 + 4);
-
- afterEvent(chart, 'mouseout', function() {
- expect(point.options.backgroundColor).toBe('rgb(100, 150, 200)');
- expect(point.options.borderColor).toBe('rgb(50, 100, 150)');
- expect(point.options.borderWidth).toBe(2);
- expect(point.options.radius).toBe(20);
-
- done();
- });
- jasmine.triggerMouseEvent(chart, 'mouseout', point);
- });
- jasmine.triggerMouseEvent(chart, 'mousemove', point);
+ await jasmine.triggerMouseEvent(chart, 'mousemove', point);
+ expect(point.options.backgroundColor).toBe('#3187DD');
+ expect(point.options.borderColor).toBe('#175A9D');
+ expect(point.options.borderWidth).toBe(1);
+ expect(point.options.radius).toBe(20 + 4);
+
+ await jasmine.triggerMouseEvent(chart, 'mouseout', point);
+ expect(point.options.backgroundColor).toBe('rgb(100, 150, 200)');
+ expect(point.options.borderColor).toBe('rgb(50, 100, 150)');
+ expect(point.options.borderWidth).toBe(2);
+ expect(point.options.radius).toBe(20);
});
- it ('should handle hover styles defined via dataset properties', function(done) {
+ it ('should handle hover styles defined via dataset properties', async function() {
var chart = this.chart;
var point = chart.getDatasetMeta(0).data[0];
chart.update();
- afterEvent(chart, 'mousemove', function() {
- expect(point.options.backgroundColor).toBe('rgb(200, 100, 150)');
- expect(point.options.borderColor).toBe('rgb(150, 50, 100)');
- expect(point.options.borderWidth).toBe(8.4);
- expect(point.options.radius).toBe(20 + 4.2);
-
- afterEvent(chart, 'mouseout', function() {
- expect(point.options.backgroundColor).toBe('rgb(100, 150, 200)');
- expect(point.options.borderColor).toBe('rgb(50, 100, 150)');
- expect(point.options.borderWidth).toBe(2);
- expect(point.options.radius).toBe(20);
-
- done();
- });
- jasmine.triggerMouseEvent(chart, 'mouseout', point);
-
- });
- jasmine.triggerMouseEvent(chart, 'mousemove', point);
+ await jasmine.triggerMouseEvent(chart, 'mousemove', point);
+ expect(point.options.backgroundColor).toBe('rgb(200, 100, 150)');
+ expect(point.options.borderColor).toBe('rgb(150, 50, 100)');
+ expect(point.options.borderWidth).toBe(8.4);
+ expect(point.options.radius).toBe(20 + 4.2);
+
+ await jasmine.triggerMouseEvent(chart, 'mouseout', point);
+ expect(point.options.backgroundColor).toBe('rgb(100, 150, 200)');
+ expect(point.options.borderColor).toBe('rgb(50, 100, 150)');
+ expect(point.options.borderWidth).toBe(2);
+ expect(point.options.radius).toBe(20);
});
- it ('should handle hover styles defined via element options', function(done) {
+ it ('should handle hover styles defined via element options', async function() {
var chart = this.chart;
var point = chart.getDatasetMeta(0).data[0];
chart.update();
- afterEvent(chart, 'mousemove', function() {
- expect(point.options.backgroundColor).toBe('rgb(200, 100, 150)');
- expect(point.options.borderColor).toBe('rgb(150, 50, 100)');
- expect(point.options.borderWidth).toBe(8.4);
- expect(point.options.radius).toBe(20 + 4.2);
-
- afterEvent(chart, 'mouseout', function() {
- expect(point.options.backgroundColor).toBe('rgb(100, 150, 200)');
- expect(point.options.borderColor).toBe('rgb(50, 100, 150)');
- expect(point.options.borderWidth).toBe(2);
- expect(point.options.radius).toBe(20);
-
- done();
- });
- jasmine.triggerMouseEvent(chart, 'mouseout', point);
- });
- jasmine.triggerMouseEvent(chart, 'mousemove', point);
+ await jasmine.triggerMouseEvent(chart, 'mousemove', point);
+ expect(point.options.backgroundColor).toBe('rgb(200, 100, 150)');
+ expect(point.options.borderColor).toBe('rgb(150, 50, 100)');
+ expect(point.options.borderWidth).toBe(8.4);
+ expect(point.options.radius).toBe(20 + 4.2);
+
+ await jasmine.triggerMouseEvent(chart, 'mouseout', point);
+ expect(point.options.backgroundColor).toBe('rgb(100, 150, 200)');
+ expect(point.options.borderColor).toBe('rgb(50, 100, 150)');
+ expect(point.options.borderWidth).toBe(2);
+ expect(point.options.radius).toBe(20);
});
});
});
});
});
- it ('should handle default hover styles', function(done) {
+ it ('should handle default hover styles', async function() {
var chart = this.chart;
var arc = chart.getDatasetMeta(0).data[0];
- afterEvent(chart, 'mousemove', function() {
- expect(arc.options.backgroundColor).toBe('#3187DD');
- expect(arc.options.borderColor).toBe('#175A9D');
- expect(arc.options.borderWidth).toBe(2);
+ await jasmine.triggerMouseEvent(chart, 'mousemove', arc);
+ expect(arc.options.backgroundColor).toBe('#3187DD');
+ expect(arc.options.borderColor).toBe('#175A9D');
+ expect(arc.options.borderWidth).toBe(2);
- afterEvent(chart, 'mouseout', function() {
- expect(arc.options.backgroundColor).toBe('rgb(100, 150, 200)');
- expect(arc.options.borderColor).toBe('rgb(50, 100, 150)');
- expect(arc.options.borderWidth).toBe(2);
-
- done();
- });
- jasmine.triggerMouseEvent(chart, 'mouseout', arc);
- });
- jasmine.triggerMouseEvent(chart, 'mousemove', arc);
+ await jasmine.triggerMouseEvent(chart, 'mouseout', arc);
+ expect(arc.options.backgroundColor).toBe('rgb(100, 150, 200)');
+ expect(arc.options.borderColor).toBe('rgb(50, 100, 150)');
+ expect(arc.options.borderWidth).toBe(2);
});
- it ('should handle hover styles defined via dataset properties', function(done) {
+ it ('should handle hover styles defined via dataset properties', async function() {
var chart = this.chart;
var arc = chart.getDatasetMeta(0).data[0];
chart.update();
- afterEvent(chart, 'mousemove', function() {
- expect(arc.options.backgroundColor).toBe('rgb(200, 100, 150)');
- expect(arc.options.borderColor).toBe('rgb(150, 50, 100)');
- expect(arc.options.borderWidth).toBe(8.4);
-
- afterEvent(chart, 'mouseout', function() {
- expect(arc.options.backgroundColor).toBe('rgb(100, 150, 200)');
- expect(arc.options.borderColor).toBe('rgb(50, 100, 150)');
- expect(arc.options.borderWidth).toBe(2);
+ await jasmine.triggerMouseEvent(chart, 'mousemove', arc);
+ expect(arc.options.backgroundColor).toBe('rgb(200, 100, 150)');
+ expect(arc.options.borderColor).toBe('rgb(150, 50, 100)');
+ expect(arc.options.borderWidth).toBe(8.4);
- done();
- });
- jasmine.triggerMouseEvent(chart, 'mouseout', arc);
- });
- jasmine.triggerMouseEvent(chart, 'mousemove', arc);
+ await jasmine.triggerMouseEvent(chart, 'mouseout', arc);
+ expect(arc.options.backgroundColor).toBe('rgb(100, 150, 200)');
+ expect(arc.options.borderColor).toBe('rgb(50, 100, 150)');
+ expect(arc.options.borderWidth).toBe(2);
});
- it ('should handle hover styles defined via element options', function(done) {
+ it ('should handle hover styles defined via element options', async function() {
var chart = this.chart;
var arc = chart.getDatasetMeta(0).data[0];
chart.update();
- afterEvent(chart, 'mousemove', function() {
- expect(arc.options.backgroundColor).toBe('rgb(200, 100, 150)');
- expect(arc.options.borderColor).toBe('rgb(150, 50, 100)');
- expect(arc.options.borderWidth).toBe(8.4);
-
- afterEvent(chart, 'mouseout', function() {
- expect(arc.options.backgroundColor).toBe('rgb(100, 150, 200)');
- expect(arc.options.borderColor).toBe('rgb(50, 100, 150)');
- expect(arc.options.borderWidth).toBe(2);
+ await jasmine.triggerMouseEvent(chart, 'mousemove', arc);
+ expect(arc.options.backgroundColor).toBe('rgb(200, 100, 150)');
+ expect(arc.options.borderColor).toBe('rgb(150, 50, 100)');
+ expect(arc.options.borderWidth).toBe(8.4);
- done();
- });
- jasmine.triggerMouseEvent(chart, 'mouseout', arc);
- });
- jasmine.triggerMouseEvent(chart, 'mousemove', arc);
+ await jasmine.triggerMouseEvent(chart, 'mouseout', arc);
+ expect(arc.options.backgroundColor).toBe('rgb(100, 150, 200)');
+ expect(arc.options.borderColor).toBe('rgb(50, 100, 150)');
+ expect(arc.options.borderWidth).toBe(2);
});
});
});
});
});
- it ('should handle default hover styles', function(done) {
+ it ('should handle default hover styles', async function() {
var chart = this.chart;
var point = chart.getDatasetMeta(0).data[0];
- afterEvent(chart, 'mousemove', function() {
- expect(point.options.backgroundColor).toBe('#3187DD');
- expect(point.options.borderColor).toBe('#175A9D');
- expect(point.options.borderWidth).toBe(1);
- expect(point.options.radius).toBe(4);
-
- afterEvent(chart, 'mouseout', function() {
- expect(point.options.backgroundColor).toBe('rgb(100, 150, 200)');
- expect(point.options.borderColor).toBe('rgb(50, 100, 150)');
- expect(point.options.borderWidth).toBe(2);
- expect(point.options.radius).toBe(3);
- done();
- });
-
- jasmine.triggerMouseEvent(chart, 'mouseout', point);
- });
+ await jasmine.triggerMouseEvent(chart, 'mousemove', point);
+ expect(point.options.backgroundColor).toBe('#3187DD');
+ expect(point.options.borderColor).toBe('#175A9D');
+ expect(point.options.borderWidth).toBe(1);
+ expect(point.options.radius).toBe(4);
- jasmine.triggerMouseEvent(chart, 'mousemove', point);
+ await jasmine.triggerMouseEvent(chart, 'mouseout', point);
+ expect(point.options.backgroundColor).toBe('rgb(100, 150, 200)');
+ expect(point.options.borderColor).toBe('rgb(50, 100, 150)');
+ expect(point.options.borderWidth).toBe(2);
+ expect(point.options.radius).toBe(3);
});
- it ('should handle hover styles defined via dataset properties', function(done) {
+ it ('should handle hover styles defined via dataset properties', async function() {
var chart = this.chart;
var point = chart.getDatasetMeta(0).data[0];
chart.update();
- afterEvent(chart, 'mousemove', function() {
- expect(point.options.backgroundColor).toBe('rgb(200, 100, 150)');
- expect(point.options.borderColor).toBe('rgb(150, 50, 100)');
- expect(point.options.borderWidth).toBe(8.4);
- expect(point.options.radius).toBe(4.2);
-
- afterEvent(chart, 'mouseout', function() {
- expect(point.options.backgroundColor).toBe('rgb(100, 150, 200)');
- expect(point.options.borderColor).toBe('rgb(50, 100, 150)');
- expect(point.options.borderWidth).toBe(2);
- expect(point.options.radius).toBe(3);
- done();
- });
- jasmine.triggerMouseEvent(chart, 'mouseout', point);
- });
+ await jasmine.triggerMouseEvent(chart, 'mousemove', point);
+ expect(point.options.backgroundColor).toBe('rgb(200, 100, 150)');
+ expect(point.options.borderColor).toBe('rgb(150, 50, 100)');
+ expect(point.options.borderWidth).toBe(8.4);
+ expect(point.options.radius).toBe(4.2);
- jasmine.triggerMouseEvent(chart, 'mousemove', point);
+ await jasmine.triggerMouseEvent(chart, 'mouseout', point);
+ expect(point.options.backgroundColor).toBe('rgb(100, 150, 200)');
+ expect(point.options.borderColor).toBe('rgb(50, 100, 150)');
+ expect(point.options.borderWidth).toBe(2);
+ expect(point.options.radius).toBe(3);
});
- it ('should handle hover styles defined via element options', function(done) {
+ it('should handle hover styles defined via element options', async function() {
var chart = this.chart;
var point = chart.getDatasetMeta(0).data[0];
chart.update();
- afterEvent(chart, 'mousemove', function() {
- expect(point.options.backgroundColor).toBe('rgb(200, 100, 150)');
- expect(point.options.borderColor).toBe('rgb(150, 50, 100)');
- expect(point.options.borderWidth).toBe(8.4);
- expect(point.options.radius).toBe(4.2);
-
- afterEvent(chart, 'mouseout', function() {
- expect(point.options.backgroundColor).toBe('rgb(100, 150, 200)');
- expect(point.options.borderColor).toBe('rgb(50, 100, 150)');
- expect(point.options.borderWidth).toBe(2);
- expect(point.options.radius).toBe(3);
-
- done();
- });
-
- jasmine.triggerMouseEvent(chart, 'mouseout', point);
- });
+ await jasmine.triggerMouseEvent(chart, 'mousemove', point);
+ expect(point.options.backgroundColor).toBe('rgb(200, 100, 150)');
+ expect(point.options.borderColor).toBe('rgb(150, 50, 100)');
+ expect(point.options.borderWidth).toBe(8.4);
+ expect(point.options.radius).toBe(4.2);
- jasmine.triggerMouseEvent(chart, 'mousemove', point);
+ await jasmine.triggerMouseEvent(chart, 'mouseout', point);
+ expect(point.options.backgroundColor).toBe('rgb(100, 150, 200)');
+ expect(point.options.borderColor).toBe('rgb(50, 100, 150)');
+ expect(point.options.borderWidth).toBe(2);
+ expect(point.options.radius).toBe(3);
});
- it ('should handle dataset hover styles defined via dataset properties', function(done) {
+ it('should handle dataset hover styles defined via dataset properties', async function() {
var chart = this.chart;
var point = chart.getDatasetMeta(0).data[0];
var dataset = chart.getDatasetMeta(0).dataset;
chart.options.hover = {mode: 'dataset'};
chart.update();
- afterEvent(chart, 'mousemove', function() {
- expect(dataset.options.backgroundColor).toBe('#000');
- expect(dataset.options.borderColor).toBe('#111');
- expect(dataset.options.borderWidth).toBe(12);
-
- afterEvent(chart, 'mouseout', function() {
- expect(dataset.options.backgroundColor).toBe('#AAA');
- expect(dataset.options.borderColor).toBe('#BBB');
- expect(dataset.options.borderWidth).toBe(6);
-
- done();
- });
-
- jasmine.triggerMouseEvent(chart, 'mouseout', point);
- });
+ await jasmine.triggerMouseEvent(chart, 'mousemove', point);
+ expect(dataset.options.backgroundColor).toBe('#000');
+ expect(dataset.options.borderColor).toBe('#111');
+ expect(dataset.options.borderWidth).toBe(12);
- jasmine.triggerMouseEvent(chart, 'mousemove', point);
+ await jasmine.triggerMouseEvent(chart, 'mouseout', point);
+ expect(dataset.options.backgroundColor).toBe('#AAA');
+ expect(dataset.options.borderColor).toBe('#BBB');
+ expect(dataset.options.borderWidth).toBe(6);
});
});
});
});
- it ('should handle default hover styles', function(done) {
+ it('should handle default hover styles', async function() {
var chart = this.chart;
var arc = chart.getDatasetMeta(0).data[0];
- afterEvent(chart, 'mousemove', function() {
- expect(arc.options.backgroundColor).toBe('#3187DD');
- expect(arc.options.borderColor).toBe('#175A9D');
- expect(arc.options.borderWidth).toBe(2);
+ await jasmine.triggerMouseEvent(chart, 'mousemove', arc);
+ expect(arc.options.backgroundColor).toBe('#3187DD');
+ expect(arc.options.borderColor).toBe('#175A9D');
+ expect(arc.options.borderWidth).toBe(2);
- afterEvent(chart, 'mouseout', function() {
- expect(arc.options.backgroundColor).toBe('rgb(100, 150, 200)');
- expect(arc.options.borderColor).toBe('rgb(50, 100, 150)');
- expect(arc.options.borderWidth).toBe(2);
-
- done();
- });
- jasmine.triggerMouseEvent(chart, 'mouseout', arc);
- });
- jasmine.triggerMouseEvent(chart, 'mousemove', arc);
+ await jasmine.triggerMouseEvent(chart, 'mouseout', arc);
+ expect(arc.options.backgroundColor).toBe('rgb(100, 150, 200)');
+ expect(arc.options.borderColor).toBe('rgb(50, 100, 150)');
+ expect(arc.options.borderWidth).toBe(2);
});
- it ('should handle hover styles defined via dataset properties', function(done) {
+ it('should handle hover styles defined via dataset properties', async function() {
var chart = this.chart;
var arc = chart.getDatasetMeta(0).data[0];
chart.update();
- afterEvent(chart, 'mousemove', function() {
- expect(arc.options.backgroundColor).toBe('rgb(200, 100, 150)');
- expect(arc.options.borderColor).toBe('rgb(150, 50, 100)');
- expect(arc.options.borderWidth).toBe(8.4);
-
- afterEvent(chart, 'mouseout', function() {
- expect(arc.options.backgroundColor).toBe('rgb(100, 150, 200)');
- expect(arc.options.borderColor).toBe('rgb(50, 100, 150)');
- expect(arc.options.borderWidth).toBe(2);
+ await jasmine.triggerMouseEvent(chart, 'mousemove', arc);
+ expect(arc.options.backgroundColor).toBe('rgb(200, 100, 150)');
+ expect(arc.options.borderColor).toBe('rgb(150, 50, 100)');
+ expect(arc.options.borderWidth).toBe(8.4);
- done();
- });
- jasmine.triggerMouseEvent(chart, 'mouseout', arc);
- });
- jasmine.triggerMouseEvent(chart, 'mousemove', arc);
+ await jasmine.triggerMouseEvent(chart, 'mouseout', arc);
+ expect(arc.options.backgroundColor).toBe('rgb(100, 150, 200)');
+ expect(arc.options.borderColor).toBe('rgb(50, 100, 150)');
+ expect(arc.options.borderWidth).toBe(2);
});
- it ('should handle hover styles defined via element options', function(done) {
+ it('should handle hover styles defined via element options', async function() {
var chart = this.chart;
var arc = chart.getDatasetMeta(0).data[0];
chart.update();
- afterEvent(chart, 'mousemove', function() {
- expect(arc.options.backgroundColor).toBe('rgb(200, 100, 150)');
- expect(arc.options.borderColor).toBe('rgb(150, 50, 100)');
- expect(arc.options.borderWidth).toBe(8.4);
-
- afterEvent(chart, 'mouseout', function() {
- expect(arc.options.backgroundColor).toBe('rgb(100, 150, 200)');
- expect(arc.options.borderColor).toBe('rgb(50, 100, 150)');
- expect(arc.options.borderWidth).toBe(2);
+ await jasmine.triggerMouseEvent(chart, 'mousemove', arc);
+ expect(arc.options.backgroundColor).toBe('rgb(200, 100, 150)');
+ expect(arc.options.borderColor).toBe('rgb(150, 50, 100)');
+ expect(arc.options.borderWidth).toBe(8.4);
- done();
- });
- jasmine.triggerMouseEvent(chart, 'mouseout', arc);
- });
- jasmine.triggerMouseEvent(chart, 'mousemove', arc);
+ await jasmine.triggerMouseEvent(chart, 'mouseout', arc);
+ expect(arc.options.backgroundColor).toBe('rgb(100, 150, 200)');
+ expect(arc.options.borderColor).toBe('rgb(50, 100, 150)');
+ expect(arc.options.borderWidth).toBe(2);
});
});
});
});
});
- it ('should handle default hover styles', function(done) {
+ it('should handle default hover styles', async function() {
var chart = this.chart;
var point = chart.getDatasetMeta(0).data[0];
- afterEvent(chart, 'mousemove', function() {
- expect(point.options.backgroundColor).toBe('#3187DD');
- expect(point.options.borderColor).toBe('#175A9D');
- expect(point.options.borderWidth).toBe(1);
- expect(point.options.radius).toBe(4);
-
- afterEvent(chart, 'mouseout', function() {
- expect(point.options.backgroundColor).toBe('rgb(100, 150, 200)');
- expect(point.options.borderColor).toBe('rgb(50, 100, 150)');
- expect(point.options.borderWidth).toBe(2);
- expect(point.options.radius).toBe(3);
-
- done();
- });
- jasmine.triggerMouseEvent(chart, 'mouseout', point);
- });
- jasmine.triggerMouseEvent(chart, 'mousemove', point);
+ await jasmine.triggerMouseEvent(chart, 'mousemove', point);
+ expect(point.options.backgroundColor).toBe('#3187DD');
+ expect(point.options.borderColor).toBe('#175A9D');
+ expect(point.options.borderWidth).toBe(1);
+ expect(point.options.radius).toBe(4);
+
+ await jasmine.triggerMouseEvent(chart, 'mouseout', point);
+ expect(point.options.backgroundColor).toBe('rgb(100, 150, 200)');
+ expect(point.options.borderColor).toBe('rgb(50, 100, 150)');
+ expect(point.options.borderWidth).toBe(2);
+ expect(point.options.radius).toBe(3);
});
- it ('should handle hover styles defined via dataset properties', function(done) {
+ it('should handle hover styles defined via dataset properties', async function() {
var chart = this.chart;
var point = chart.getDatasetMeta(0).data[0];
chart.update();
- afterEvent(chart, 'mousemove', function() {
- expect(point.options.backgroundColor).toBe('rgb(200, 100, 150)');
- expect(point.options.borderColor).toBe('rgb(150, 50, 100)');
- expect(point.options.borderWidth).toBe(8.4);
- expect(point.options.radius).toBe(4.2);
-
- afterEvent(chart, 'mouseout', function() {
- expect(point.options.backgroundColor).toBe('rgb(100, 150, 200)');
- expect(point.options.borderColor).toBe('rgb(50, 100, 150)');
- expect(point.options.borderWidth).toBe(2);
- expect(point.options.radius).toBe(3);
-
- done();
- });
- jasmine.triggerMouseEvent(chart, 'mouseout', point);
- });
- jasmine.triggerMouseEvent(chart, 'mousemove', point);
+ await jasmine.triggerMouseEvent(chart, 'mousemove', point);
+ expect(point.options.backgroundColor).toBe('rgb(200, 100, 150)');
+ expect(point.options.borderColor).toBe('rgb(150, 50, 100)');
+ expect(point.options.borderWidth).toBe(8.4);
+ expect(point.options.radius).toBe(4.2);
+
+ await jasmine.triggerMouseEvent(chart, 'mouseout', point);
+ expect(point.options.backgroundColor).toBe('rgb(100, 150, 200)');
+ expect(point.options.borderColor).toBe('rgb(50, 100, 150)');
+ expect(point.options.borderWidth).toBe(2);
+ expect(point.options.radius).toBe(3);
});
- it ('should handle hover styles defined via element options', function(done) {
+ it('should handle hover styles defined via element options', async function() {
var chart = this.chart;
var point = chart.getDatasetMeta(0).data[0];
chart.update();
- afterEvent(chart, 'mousemove', function() {
- expect(point.options.backgroundColor).toBe('rgb(200, 100, 150)');
- expect(point.options.borderColor).toBe('rgb(150, 50, 100)');
- expect(point.options.borderWidth).toBe(8.4);
- expect(point.options.radius).toBe(4.2);
-
- afterEvent(chart, 'mouseout', function() {
- expect(point.options.backgroundColor).toBe('rgb(100, 150, 200)');
- expect(point.options.borderColor).toBe('rgb(50, 100, 150)');
- expect(point.options.borderWidth).toBe(2);
- expect(point.options.radius).toBe(3);
-
- done();
- });
- jasmine.triggerMouseEvent(chart, 'mouseout', point);
-
- });
- jasmine.triggerMouseEvent(chart, 'mousemove', point);
+ await jasmine.triggerMouseEvent(chart, 'mousemove', point);
+ expect(point.options.backgroundColor).toBe('rgb(200, 100, 150)');
+ expect(point.options.borderColor).toBe('rgb(150, 50, 100)');
+ expect(point.options.borderWidth).toBe(8.4);
+ expect(point.options.radius).toBe(4.2);
+
+ await jasmine.triggerMouseEvent(chart, 'mouseout', point);
+ expect(point.options.backgroundColor).toBe('rgb(100, 150, 200)');
+ expect(point.options.borderColor).toBe('rgb(50, 100, 150)');
+ expect(point.options.borderWidth).toBe(2);
+ expect(point.options.radius).toBe(3);
});
});
expect(typeof Chart.controllers.scatter).toBe('function');
});
- it('should test default tooltip callbacks', function(done) {
+ it('should test default tooltip callbacks', async function() {
var chart = window.acquireChart({
type: 'scatter',
data: {
});
var point = chart.getDatasetMeta(0).data[0];
- afterEvent(chart, 'mousemove', function() {
- // Title should be empty
- expect(chart.tooltip.title.length).toBe(0);
- expect(chart.tooltip.body[0].lines).toEqual(['(10, 15)']);
-
- done();
- });
-
- jasmine.triggerMouseEvent(chart, 'mousemove', point);
+ await jasmine.triggerMouseEvent(chart, 'mousemove', point);
+ // Title should be empty
+ expect(chart.tooltip.title.length).toBe(0);
+ expect(chart.tooltip.body[0].lines).toEqual(['(10, 15)']);
});
- it('should only show a single point in the tooltip on multiple datasets', function(done) {
+ it('should only show a single point in the tooltip on multiple datasets', async function() {
var chart = window.acquireChart({
type: 'scatter',
data: {
});
var point = chart.getDatasetMeta(0).data[1];
- afterEvent(chart, 'mousemove', function() {
- expect(chart.tooltip.body.length).toEqual(1);
-
- done();
- });
-
- jasmine.triggerMouseEvent(chart, 'mousemove', point);
+ await jasmine.triggerMouseEvent(chart, 'mousemove', point);
+ expect(chart.tooltip.body.length).toEqual(1);
});
});
});
});
- it('should activate element on hover', function(done) {
+ it('should activate element on hover', async function() {
var chart = acquireChart({
type: 'line',
data: {
var point = chart.getDatasetMeta(0).data[1];
- afterEvent(chart, 'mousemove', function() {
- expect(chart.getActiveElements()).toEqual([{datasetIndex: 0, index: 1, element: point}]);
- done();
- });
- jasmine.triggerMouseEvent(chart, 'mousemove', point);
+ await jasmine.triggerMouseEvent(chart, 'mousemove', point);
+ expect(chart.getActiveElements()).toEqual([{datasetIndex: 0, index: 1, element: point}]);
});
- it('should not activate elements when hover is disabled', function(done) {
+ it('should not activate elements when hover is disabled', async function() {
var chart = acquireChart({
type: 'line',
data: {
var point = chart.getDatasetMeta(0).data[1];
- afterEvent(chart, 'mousemove', function() {
- expect(chart.getActiveElements()).toEqual([]);
- done();
- });
- jasmine.triggerMouseEvent(chart, 'mousemove', point);
+ await jasmine.triggerMouseEvent(chart, 'mousemove', point);
+ expect(chart.getActiveElements()).toEqual([]);
});
});
expect(chart.tooltip.options).toEqual(jasmine.objectContaining(newTooltipConfig));
});
- it ('should update the tooltip on update', function(done) {
+ it ('should update the tooltip on update', async function() {
var chart = acquireChart({
type: 'line',
data: {
var meta = chart.getDatasetMeta(0);
var point = meta.data[1];
- afterEvent(chart, 'mousemove', function() {
- // Check and see if tooltip was displayed
- var tooltip = chart.tooltip;
+ await jasmine.triggerMouseEvent(chart, 'mousemove', point);
+ // Check and see if tooltip was displayed
+ var tooltip = chart.tooltip;
- expect(chart._active[0].element).toEqual(point);
- expect(tooltip._active[0].element).toEqual(point);
+ expect(chart._active[0].element).toEqual(point);
+ expect(tooltip._active[0].element).toEqual(point);
- // Update and confirm tooltip is updated
- chart.update();
- expect(chart._active[0].element).toEqual(point);
- expect(tooltip._active[0].element).toEqual(point);
-
- done();
- });
- jasmine.triggerMouseEvent(chart, 'mousemove', point);
+ // Update and confirm tooltip is updated
+ chart.update();
+ expect(chart._active[0].element).toEqual(point);
+ expect(tooltip._active[0].element).toEqual(point);
});
it ('should update the metadata', function() {
});
describe('event handling', function() {
- it('should notify plugins about events', function(done) {
+ it('should notify plugins about events', async function() {
var notifiedEvent;
var plugin = {
afterEvent: function(chart, args) {
plugins: [plugin]
});
- afterEvent(chart, 'click', function() {
- // Check that notifiedEvent is correct
- expect(notifiedEvent).not.toBe(undefined);
-
- // Is type correctly translated
- expect(notifiedEvent.type).toBe('click');
-
- // Relative Position
- expect(notifiedEvent.x).toBeCloseToPixel(chart.width / 2);
- expect(notifiedEvent.y).toBeCloseToPixel(chart.height / 2);
-
- done();
- });
-
- jasmine.triggerMouseEvent(chart, 'click', {
+ await jasmine.triggerMouseEvent(chart, 'click', {
x: chart.width / 2,
y: chart.height / 2
});
+ // Check that notifiedEvent is correct
+ expect(notifiedEvent).not.toBe(undefined);
+
+ // Is type correctly translated
+ expect(notifiedEvent.type).toBe('click');
+
+ // Relative Position
+ expect(notifiedEvent.x).toBeCloseToPixel(chart.width / 2);
+ expect(notifiedEvent.y).toBeCloseToPixel(chart.height / 2);
});
});
});
describe('callbacks', function() {
- it('should call onClick, onHover and onLeave at the correct times', function(done) {
+ it('should call onClick, onHover and onLeave at the correct times', async function() {
var clickItem = null;
var hoverItem = null;
var leaveItem = null;
y: hb.top + (hb.height / 2)
};
- afterEvent(chart, 'click', function() {
- expect(clickItem).toBe(chart.legend.legendItems[0]);
+ await jasmine.triggerMouseEvent(chart, 'click', el);
+ expect(clickItem).toBe(chart.legend.legendItems[0]);
- afterEvent(chart, 'mousemove', function() {
- expect(hoverItem).toBe(chart.legend.legendItems[0]);
+ await jasmine.triggerMouseEvent(chart, 'mousemove', el);
+ expect(hoverItem).toBe(chart.legend.legendItems[0]);
- afterEvent(chart, 'mousemove', function() {
- expect(leaveItem).toBe(chart.legend.legendItems[0]);
-
- done();
- });
- jasmine.triggerMouseEvent(chart, 'mousemove', chart.getDatasetMeta(0).data[0]);
- });
- jasmine.triggerMouseEvent(chart, 'mousemove', el);
- });
- jasmine.triggerMouseEvent(chart, 'click', el);
+ await jasmine.triggerMouseEvent(chart, 'mousemove', chart.getDatasetMeta(0).data[0]);
+ expect(leaveItem).toBe(chart.legend.legendItems[0]);
});
});
});
});
describe('index mode', function() {
- it('Should only use x distance when intersect is false', function(done) {
+ it('Should only use x distance when intersect is false', async function() {
var chart = window.acquireChart({
type: 'line',
data: {
var meta = chart.getDatasetMeta(0);
var point = meta.data[1];
- afterEvent(chart, 'mousemove', function() {
- // Check and see if tooltip was displayed
- var tooltip = chart.tooltip;
- var defaults = Chart.defaults;
-
- expect(tooltip.options.xPadding).toEqual(6);
- expect(tooltip.options.yPadding).toEqual(6);
- expect(tooltip.xAlign).toEqual('left');
- expect(tooltip.yAlign).toEqual('center');
- expect(tooltip.options.bodyColor).toEqual('#fff');
-
- expect(tooltip.options.bodyFont).toEqual(jasmine.objectContaining({
- family: defaults.font.family,
- style: defaults.font.style,
- size: defaults.font.size,
- }));
-
- expect(tooltip.options).toEqual(jasmine.objectContaining({
- bodyAlign: 'left',
- bodySpacing: 2,
- }));
+ // Check and see if tooltip was displayed
+ var tooltip = chart.tooltip;
+ var defaults = Chart.defaults;
- expect(tooltip.options.titleColor).toEqual('#fff');
- expect(tooltip.options.titleFont).toEqual(jasmine.objectContaining({
- family: defaults.font.family,
- style: 'bold',
- size: defaults.font.size,
- }));
+ await jasmine.triggerMouseEvent(chart, 'mousemove', {x: point.x, y: chart.chartArea.top + 10});
- expect(tooltip.options).toEqual(jasmine.objectContaining({
- titleAlign: 'left',
- titleSpacing: 2,
- titleMarginBottom: 6,
- }));
+ expect(tooltip.options.xPadding).toEqual(6);
+ expect(tooltip.options.yPadding).toEqual(6);
+ expect(tooltip.xAlign).toEqual('left');
+ expect(tooltip.yAlign).toEqual('center');
+ expect(tooltip.options.bodyColor).toEqual('#fff');
- expect(tooltip.options.footerColor).toEqual('#fff');
- expect(tooltip.options.footerFont).toEqual(jasmine.objectContaining({
- family: defaults.font.family,
- style: 'bold',
- size: defaults.font.size,
- }));
+ expect(tooltip.options.bodyFont).toEqual(jasmine.objectContaining({
+ family: defaults.font.family,
+ style: defaults.font.style,
+ size: defaults.font.size,
+ }));
- expect(tooltip.options).toEqual(jasmine.objectContaining({
- footerAlign: 'left',
- footerSpacing: 2,
- footerMarginTop: 6,
- }));
+ expect(tooltip.options).toEqual(jasmine.objectContaining({
+ bodyAlign: 'left',
+ bodySpacing: 2,
+ }));
- expect(tooltip.options).toEqual(jasmine.objectContaining({
- // Appearance
- caretSize: 5,
- caretPadding: 2,
- cornerRadius: 6,
- backgroundColor: 'rgba(0,0,0,0.8)',
- multiKeyBackground: '#fff',
- displayColors: true
- }));
-
- expect(tooltip).toEqual(jasmine.objectContaining({
- opacity: 1,
-
- // Text
- title: ['Point 2'],
- beforeBody: [],
- body: [{
- before: [],
- lines: ['Dataset 1: 20'],
- after: []
- }, {
- before: [],
- lines: ['Dataset 2: 40'],
- after: []
- }],
- afterBody: [],
- footer: [],
- labelColors: [{
- borderColor: defaults.borderColor,
- backgroundColor: defaults.backgroundColor
- }, {
- borderColor: defaults.borderColor,
- backgroundColor: defaults.backgroundColor
- }]
- }));
+ expect(tooltip.options.titleColor).toEqual('#fff');
+ expect(tooltip.options.titleFont).toEqual(jasmine.objectContaining({
+ family: defaults.font.family,
+ style: 'bold',
+ size: defaults.font.size,
+ }));
- expect(tooltip.x).toBeCloseToPixel(267);
- expect(tooltip.y).toBeCloseToPixel(155);
+ expect(tooltip.options).toEqual(jasmine.objectContaining({
+ titleAlign: 'left',
+ titleSpacing: 2,
+ titleMarginBottom: 6,
+ }));
- done();
- });
- jasmine.triggerMouseEvent(chart, 'mousemove', {x: point.x, y: chart.chartArea.top + 10});
+ expect(tooltip.options.footerColor).toEqual('#fff');
+ expect(tooltip.options.footerFont).toEqual(jasmine.objectContaining({
+ family: defaults.font.family,
+ style: 'bold',
+ size: defaults.font.size,
+ }));
+
+ expect(tooltip.options).toEqual(jasmine.objectContaining({
+ footerAlign: 'left',
+ footerSpacing: 2,
+ footerMarginTop: 6,
+ }));
+
+ expect(tooltip.options).toEqual(jasmine.objectContaining({
+ // Appearance
+ caretSize: 5,
+ caretPadding: 2,
+ cornerRadius: 6,
+ backgroundColor: 'rgba(0,0,0,0.8)',
+ multiKeyBackground: '#fff',
+ displayColors: true
+ }));
+
+ expect(tooltip).toEqual(jasmine.objectContaining({
+ opacity: 1,
+
+ // Text
+ title: ['Point 2'],
+ beforeBody: [],
+ body: [{
+ before: [],
+ lines: ['Dataset 1: 20'],
+ after: []
+ }, {
+ before: [],
+ lines: ['Dataset 2: 40'],
+ after: []
+ }],
+ afterBody: [],
+ footer: [],
+ labelColors: [{
+ borderColor: defaults.borderColor,
+ backgroundColor: defaults.backgroundColor
+ }, {
+ borderColor: defaults.borderColor,
+ backgroundColor: defaults.backgroundColor
+ }]
+ }));
+
+ expect(tooltip.x).toBeCloseToPixel(267);
+ expect(tooltip.y).toBeCloseToPixel(155);
});
- it('Should only display if intersecting if intersect is set', function(done) {
+ it('Should only display if intersecting if intersect is set', async function() {
var chart = window.acquireChart({
type: 'line',
data: {
var meta = chart.getDatasetMeta(0);
var point = meta.data[1];
- afterEvent(chart, 'mousemove', function() {
- // Check and see if tooltip was displayed
- var tooltip = chart.tooltip;
-
- expect(tooltip).toEqual(jasmine.objectContaining({
- opacity: 0,
- }));
+ await jasmine.triggerMouseEvent(chart, 'mousemove', {x: point.x, y: 0});
+ // Check and see if tooltip was displayed
+ var tooltip = chart.tooltip;
- done();
- });
- jasmine.triggerMouseEvent(chart, 'mousemove', {x: point.x, y: 0});
+ expect(tooltip).toEqual(jasmine.objectContaining({
+ opacity: 0,
+ }));
});
});
- it('Should display in single mode', function(done) {
+ it('Should display in single mode', async function() {
var chart = window.acquireChart({
type: 'line',
data: {
var meta = chart.getDatasetMeta(0);
var point = meta.data[1];
- afterEvent(chart, 'mousemove', function() {
- // Check and see if tooltip was displayed
- var tooltip = chart.tooltip;
- var defaults = Chart.defaults;
-
- expect(tooltip.options.xPadding).toEqual(6);
- expect(tooltip.options.yPadding).toEqual(6);
- expect(tooltip.xAlign).toEqual('left');
- expect(tooltip.yAlign).toEqual('center');
-
- expect(tooltip.options.bodyFont).toEqual(jasmine.objectContaining({
- family: defaults.font.family,
- style: defaults.font.style,
- size: defaults.font.size,
- }));
-
- expect(tooltip.options).toEqual(jasmine.objectContaining({
- bodyAlign: 'left',
- bodySpacing: 2,
- }));
-
- expect(tooltip.options.titleFont).toEqual(jasmine.objectContaining({
- family: defaults.font.family,
- style: 'bold',
- size: defaults.font.size,
- }));
-
- expect(tooltip.options).toEqual(jasmine.objectContaining({
- titleAlign: 'left',
- titleSpacing: 2,
- titleMarginBottom: 6,
- }));
-
- expect(tooltip.options.footerFont).toEqual(jasmine.objectContaining({
- family: defaults.font.family,
- style: 'bold',
- size: defaults.font.size,
- }));
-
- expect(tooltip.options).toEqual(jasmine.objectContaining({
- footerAlign: 'left',
- footerSpacing: 2,
- footerMarginTop: 6,
- }));
-
- expect(tooltip.options).toEqual(jasmine.objectContaining({
- // Appearance
- caretSize: 5,
- caretPadding: 2,
- cornerRadius: 6,
- backgroundColor: 'rgba(0,0,0,0.8)',
- multiKeyBackground: '#fff',
- displayColors: true
- }));
-
- expect(tooltip.opacity).toEqual(1);
- expect(tooltip.title).toEqual(['Point 2']);
- expect(tooltip.beforeBody).toEqual([]);
- expect(tooltip.body).toEqual([{
- before: [],
- lines: ['Dataset 1: 20'],
- after: []
- }]);
- expect(tooltip.afterBody).toEqual([]);
- expect(tooltip.footer).toEqual([]);
- expect(tooltip.labelTextColors).toEqual(['#fff']);
-
- expect(tooltip.labelColors).toEqual([{
- borderColor: defaults.borderColor,
- backgroundColor: defaults.backgroundColor
- }]);
-
- expect(tooltip.x).toBeCloseToPixel(267);
- expect(tooltip.y).toBeCloseToPixel(312);
+ await jasmine.triggerMouseEvent(chart, 'mousemove', point);
+ // Check and see if tooltip was displayed
+ var tooltip = chart.tooltip;
+ var defaults = Chart.defaults;
- done();
- });
- jasmine.triggerMouseEvent(chart, 'mousemove', point);
+ expect(tooltip.options.xPadding).toEqual(6);
+ expect(tooltip.options.yPadding).toEqual(6);
+ expect(tooltip.xAlign).toEqual('left');
+ expect(tooltip.yAlign).toEqual('center');
+
+ expect(tooltip.options.bodyFont).toEqual(jasmine.objectContaining({
+ family: defaults.font.family,
+ style: defaults.font.style,
+ size: defaults.font.size,
+ }));
+
+ expect(tooltip.options).toEqual(jasmine.objectContaining({
+ bodyAlign: 'left',
+ bodySpacing: 2,
+ }));
+
+ expect(tooltip.options.titleFont).toEqual(jasmine.objectContaining({
+ family: defaults.font.family,
+ style: 'bold',
+ size: defaults.font.size,
+ }));
+
+ expect(tooltip.options).toEqual(jasmine.objectContaining({
+ titleAlign: 'left',
+ titleSpacing: 2,
+ titleMarginBottom: 6,
+ }));
+
+ expect(tooltip.options.footerFont).toEqual(jasmine.objectContaining({
+ family: defaults.font.family,
+ style: 'bold',
+ size: defaults.font.size,
+ }));
+
+ expect(tooltip.options).toEqual(jasmine.objectContaining({
+ footerAlign: 'left',
+ footerSpacing: 2,
+ footerMarginTop: 6,
+ }));
+
+ expect(tooltip.options).toEqual(jasmine.objectContaining({
+ // Appearance
+ caretSize: 5,
+ caretPadding: 2,
+ cornerRadius: 6,
+ backgroundColor: 'rgba(0,0,0,0.8)',
+ multiKeyBackground: '#fff',
+ displayColors: true
+ }));
+
+ expect(tooltip.opacity).toEqual(1);
+ expect(tooltip.title).toEqual(['Point 2']);
+ expect(tooltip.beforeBody).toEqual([]);
+ expect(tooltip.body).toEqual([{
+ before: [],
+ lines: ['Dataset 1: 20'],
+ after: []
+ }]);
+ expect(tooltip.afterBody).toEqual([]);
+ expect(tooltip.footer).toEqual([]);
+ expect(tooltip.labelTextColors).toEqual(['#fff']);
+
+ expect(tooltip.labelColors).toEqual([{
+ borderColor: defaults.borderColor,
+ backgroundColor: defaults.backgroundColor
+ }]);
+
+ expect(tooltip.x).toBeCloseToPixel(267);
+ expect(tooltip.y).toBeCloseToPixel(312);
});
- it('Should display information from user callbacks', function(done) {
+ it('Should display information from user callbacks', async function() {
var chart = window.acquireChart({
type: 'line',
data: {
var meta = chart.getDatasetMeta(0);
var point = meta.data[1];
- afterEvent(chart, 'mousemove', function() {
- // Check and see if tooltip was displayed
- var tooltip = chart.tooltip;
- var defaults = Chart.defaults;
-
- expect(tooltip.options.xPadding).toEqual(6);
- expect(tooltip.options.yPadding).toEqual(6);
- expect(tooltip.xAlign).toEqual('left');
- expect(tooltip.yAlign).toEqual('center');
-
- expect(tooltip.options.bodyFont).toEqual(jasmine.objectContaining({
- family: defaults.font.family,
- style: defaults.font.style,
- size: defaults.font.size,
- }));
-
- expect(tooltip.options).toEqual(jasmine.objectContaining({
- bodyAlign: 'left',
- bodySpacing: 2,
- }));
-
- expect(tooltip.options.titleFont).toEqual(jasmine.objectContaining({
- family: defaults.font.family,
- style: 'bold',
- size: defaults.font.size,
- }));
-
- expect(tooltip.options).toEqual(jasmine.objectContaining({
- titleSpacing: 2,
- titleMarginBottom: 6,
- }));
-
- expect(tooltip.options.footerFont).toEqual(jasmine.objectContaining({
- family: defaults.font.family,
- style: 'bold',
- size: defaults.font.size,
- }));
-
- expect(tooltip.options).toEqual(jasmine.objectContaining({
- footerAlign: 'left',
- footerSpacing: 2,
- footerMarginTop: 6,
- }));
-
- expect(tooltip.options).toEqual(jasmine.objectContaining({
- // Appearance
- caretSize: 5,
- caretPadding: 2,
- cornerRadius: 6,
- backgroundColor: 'rgba(0,0,0,0.8)',
- multiKeyBackground: '#fff',
- }));
-
- expect(tooltip).toEqual(jasmine.objectContaining({
- opacity: 1,
-
- // Text
- title: ['beforeTitle', 'title', 'afterTitle'],
- beforeBody: ['beforeBody'],
- body: [{
- before: ['beforeLabel'],
- lines: ['label'],
- after: ['afterLabel']
- }, {
- before: ['beforeLabel'],
- lines: ['label'],
- after: ['afterLabel']
- }],
- afterBody: ['afterBody'],
- footer: ['beforeFooter', 'footer', 'afterFooter'],
- labelTextColors: ['labelTextColor', 'labelTextColor'],
- labelColors: [{
- borderColor: defaults.borderColor,
- backgroundColor: defaults.backgroundColor
- }, {
- borderColor: defaults.borderColor,
- backgroundColor: defaults.backgroundColor
- }],
- labelPointStyles: [{
- pointStyle: 'labelPointStyle',
- rotation: 42
- }, {
- pointStyle: 'labelPointStyle',
- rotation: 42
- }]
- }));
-
- expect(tooltip.x).toBeCloseToPixel(267);
- expect(tooltip.y).toBeCloseToPixel(75);
+ await jasmine.triggerMouseEvent(chart, 'mousemove', point);
+ // Check and see if tooltip was displayed
+ var tooltip = chart.tooltip;
+ var defaults = Chart.defaults;
- done();
- });
- jasmine.triggerMouseEvent(chart, 'mousemove', point);
+ expect(tooltip.options.xPadding).toEqual(6);
+ expect(tooltip.options.yPadding).toEqual(6);
+ expect(tooltip.xAlign).toEqual('left');
+ expect(tooltip.yAlign).toEqual('center');
+
+ expect(tooltip.options.bodyFont).toEqual(jasmine.objectContaining({
+ family: defaults.font.family,
+ style: defaults.font.style,
+ size: defaults.font.size,
+ }));
+
+ expect(tooltip.options).toEqual(jasmine.objectContaining({
+ bodyAlign: 'left',
+ bodySpacing: 2,
+ }));
+
+ expect(tooltip.options.titleFont).toEqual(jasmine.objectContaining({
+ family: defaults.font.family,
+ style: 'bold',
+ size: defaults.font.size,
+ }));
+
+ expect(tooltip.options).toEqual(jasmine.objectContaining({
+ titleSpacing: 2,
+ titleMarginBottom: 6,
+ }));
+
+ expect(tooltip.options.footerFont).toEqual(jasmine.objectContaining({
+ family: defaults.font.family,
+ style: 'bold',
+ size: defaults.font.size,
+ }));
+
+ expect(tooltip.options).toEqual(jasmine.objectContaining({
+ footerAlign: 'left',
+ footerSpacing: 2,
+ footerMarginTop: 6,
+ }));
+
+ expect(tooltip.options).toEqual(jasmine.objectContaining({
+ // Appearance
+ caretSize: 5,
+ caretPadding: 2,
+ cornerRadius: 6,
+ backgroundColor: 'rgba(0,0,0,0.8)',
+ multiKeyBackground: '#fff',
+ }));
+
+ expect(tooltip).toEqual(jasmine.objectContaining({
+ opacity: 1,
+
+ // Text
+ title: ['beforeTitle', 'title', 'afterTitle'],
+ beforeBody: ['beforeBody'],
+ body: [{
+ before: ['beforeLabel'],
+ lines: ['label'],
+ after: ['afterLabel']
+ }, {
+ before: ['beforeLabel'],
+ lines: ['label'],
+ after: ['afterLabel']
+ }],
+ afterBody: ['afterBody'],
+ footer: ['beforeFooter', 'footer', 'afterFooter'],
+ labelTextColors: ['labelTextColor', 'labelTextColor'],
+ labelColors: [{
+ borderColor: defaults.borderColor,
+ backgroundColor: defaults.backgroundColor
+ }, {
+ borderColor: defaults.borderColor,
+ backgroundColor: defaults.backgroundColor
+ }],
+ labelPointStyles: [{
+ pointStyle: 'labelPointStyle',
+ rotation: 42
+ }, {
+ pointStyle: 'labelPointStyle',
+ rotation: 42
+ }]
+ }));
+
+ expect(tooltip.x).toBeCloseToPixel(267);
+ expect(tooltip.y).toBeCloseToPixel(75);
});
- it('Should provide context object to user callbacks', function(done) {
+ it('Should provide context object to user callbacks', async function() {
const chart = window.acquireChart({
type: 'line',
data: {
const meta = chart.getDatasetMeta(0);
const point = meta.data[1];
- afterEvent(chart, 'mousemove', function() {
- const tooltip = chart.tooltip;
-
- expect(tooltip.body[0].before).toEqual(['2,20']);
-
- done();
- });
- jasmine.triggerMouseEvent(chart, 'mousemove', point);
+ await jasmine.triggerMouseEvent(chart, 'mousemove', point);
+ expect(chart.tooltip.body[0].before).toEqual(['2,20']);
});
- it('Should allow sorting items', function(done) {
+ it('Should allow sorting items', async function() {
var chart = window.acquireChart({
type: 'line',
data: {
options: {
plugins: {
tooltip: {
- mode: 'index',
- itemSort: function(a, b) {
- return a.datasetIndex > b.datasetIndex ? -1 : 1;
- }
- }
- }
- }
- });
-
- // Trigger an event over top of the
- var meta0 = chart.getDatasetMeta(0);
- var point0 = meta0.data[1];
-
- afterEvent(chart, 'mousemove', function() {
- // Check and see if tooltip was displayed
- var tooltip = chart.tooltip;
- var defaults = Chart.defaults;
-
- expect(tooltip).toEqual(jasmine.objectContaining({
- // Positioning
- xAlign: 'left',
- yAlign: 'center',
-
- // Text
- title: ['Point 2'],
- beforeBody: [],
- body: [{
- before: [],
- lines: ['Dataset 2: 40'],
- after: []
- }, {
- before: [],
- lines: ['Dataset 1: 20'],
- after: []
- }],
- afterBody: [],
- footer: [],
- labelColors: [{
- borderColor: defaults.borderColor,
- backgroundColor: defaults.backgroundColor
- }, {
- borderColor: defaults.borderColor,
- backgroundColor: defaults.backgroundColor
- }]
- }));
+ mode: 'index',
+ itemSort: function(a, b) {
+ return a.datasetIndex > b.datasetIndex ? -1 : 1;
+ }
+ }
+ }
+ }
+ });
- expect(tooltip.x).toBeCloseToPixel(267);
- expect(tooltip.y).toBeCloseToPixel(155);
+ // Trigger an event over top of the
+ var meta0 = chart.getDatasetMeta(0);
+ var point0 = meta0.data[1];
- done();
- });
- jasmine.triggerMouseEvent(chart, 'mousemove', point0);
+ await jasmine.triggerMouseEvent(chart, 'mousemove', point0);
+ // Check and see if tooltip was displayed
+ var tooltip = chart.tooltip;
+ var defaults = Chart.defaults;
+ expect(tooltip).toEqual(jasmine.objectContaining({
+ // Positioning
+ xAlign: 'left',
+ yAlign: 'center',
+
+ // Text
+ title: ['Point 2'],
+ beforeBody: [],
+ body: [{
+ before: [],
+ lines: ['Dataset 2: 40'],
+ after: []
+ }, {
+ before: [],
+ lines: ['Dataset 1: 20'],
+ after: []
+ }],
+ afterBody: [],
+ footer: [],
+ labelColors: [{
+ borderColor: defaults.borderColor,
+ backgroundColor: defaults.backgroundColor
+ }, {
+ borderColor: defaults.borderColor,
+ backgroundColor: defaults.backgroundColor
+ }]
+ }));
+
+ expect(tooltip.x).toBeCloseToPixel(267);
+ expect(tooltip.y).toBeCloseToPixel(155);
});
- it('Should allow reversing items', function(done) {
+ it('Should allow reversing items', async function() {
var chart = window.acquireChart({
type: 'line',
data: {
var meta0 = chart.getDatasetMeta(0);
var point0 = meta0.data[1];
- afterEvent(chart, 'mousemove', function() {
- // Check and see if tooltip was displayed
- var tooltip = chart.tooltip;
- var defaults = Chart.defaults;
-
- expect(tooltip).toEqual(jasmine.objectContaining({
- // Positioning
- xAlign: 'left',
- yAlign: 'center',
-
- // Text
- title: ['Point 2'],
- beforeBody: [],
- body: [{
- before: [],
- lines: ['Dataset 2: 40'],
- after: []
- }, {
- before: [],
- lines: ['Dataset 1: 20'],
- after: []
- }],
- afterBody: [],
- footer: [],
- labelColors: [{
- borderColor: defaults.borderColor,
- backgroundColor: defaults.backgroundColor
- }, {
- borderColor: defaults.borderColor,
- backgroundColor: defaults.backgroundColor
- }]
- }));
+ await jasmine.triggerMouseEvent(chart, 'mousemove', point0);
+ // Check and see if tooltip was displayed
+ var tooltip = chart.tooltip;
+ var defaults = Chart.defaults;
- expect(tooltip.x).toBeCloseToPixel(267);
- expect(tooltip.y).toBeCloseToPixel(155);
+ expect(tooltip).toEqual(jasmine.objectContaining({
+ // Positioning
+ xAlign: 'left',
+ yAlign: 'center',
- done();
- });
+ // Text
+ title: ['Point 2'],
+ beforeBody: [],
+ body: [{
+ before: [],
+ lines: ['Dataset 2: 40'],
+ after: []
+ }, {
+ before: [],
+ lines: ['Dataset 1: 20'],
+ after: []
+ }],
+ afterBody: [],
+ footer: [],
+ labelColors: [{
+ borderColor: defaults.borderColor,
+ backgroundColor: defaults.backgroundColor
+ }, {
+ borderColor: defaults.borderColor,
+ backgroundColor: defaults.backgroundColor
+ }]
+ }));
- jasmine.triggerMouseEvent(chart, 'mousemove', point0);
+ expect(tooltip.x).toBeCloseToPixel(267);
+ expect(tooltip.y).toBeCloseToPixel(155);
});
- it('Should follow dataset order', function(done) {
+ it('Should follow dataset order', async function() {
var chart = window.acquireChart({
type: 'line',
data: {
var meta0 = chart.getDatasetMeta(0);
var point0 = meta0.data[1];
- afterEvent(chart, 'mousemove', function() {
- // Check and see if tooltip was displayed
- var tooltip = chart.tooltip;
- var defaults = Chart.defaults;
-
- expect(tooltip).toEqual(jasmine.objectContaining({
- // Positioning
- xAlign: 'left',
- yAlign: 'center',
-
- // Text
- title: ['Point 2'],
- beforeBody: [],
- body: [{
- before: [],
- lines: ['Dataset 2: 40'],
- after: []
- }, {
- before: [],
- lines: ['Dataset 1: 20'],
- after: []
- }],
- afterBody: [],
- footer: [],
- labelColors: [{
- borderColor: defaults.borderColor,
- backgroundColor: defaults.backgroundColor
- }, {
- borderColor: defaults.borderColor,
- backgroundColor: defaults.backgroundColor
- }]
- }));
+ await jasmine.triggerMouseEvent(chart, 'mousemove', point0);
+ // Check and see if tooltip was displayed
+ var tooltip = chart.tooltip;
+ var defaults = Chart.defaults;
- expect(tooltip.x).toBeCloseToPixel(267);
- expect(tooltip.y).toBeCloseToPixel(155);
+ expect(tooltip).toEqual(jasmine.objectContaining({
+ // Positioning
+ xAlign: 'left',
+ yAlign: 'center',
- done();
- });
+ // Text
+ title: ['Point 2'],
+ beforeBody: [],
+ body: [{
+ before: [],
+ lines: ['Dataset 2: 40'],
+ after: []
+ }, {
+ before: [],
+ lines: ['Dataset 1: 20'],
+ after: []
+ }],
+ afterBody: [],
+ footer: [],
+ labelColors: [{
+ borderColor: defaults.borderColor,
+ backgroundColor: defaults.backgroundColor
+ }, {
+ borderColor: defaults.borderColor,
+ backgroundColor: defaults.backgroundColor
+ }]
+ }));
- jasmine.triggerMouseEvent(chart, 'mousemove', point0);
+ expect(tooltip.x).toBeCloseToPixel(267);
+ expect(tooltip.y).toBeCloseToPixel(155);
});
- it('should filter items from the tooltip using the callback', function(done) {
+ it('should filter items from the tooltip using the callback', async function() {
var chart = window.acquireChart({
type: 'line',
data: {
var meta0 = chart.getDatasetMeta(0);
var point0 = meta0.data[1];
- afterEvent(chart, 'mousemove', function() {
- // Check and see if tooltip was displayed
- var tooltip = chart.tooltip;
- var defaults = Chart.defaults;
-
- expect(tooltip).toEqual(jasmine.objectContaining({
- // Positioning
- xAlign: 'left',
- yAlign: 'center',
-
- // Text
- title: ['Point 2'],
- beforeBody: [],
- body: [{
- before: [],
- lines: ['Dataset 2: 40'],
- after: []
- }],
- afterBody: [],
- footer: [],
- labelColors: [{
- borderColor: defaults.borderColor,
- backgroundColor: defaults.backgroundColor
- }]
- }));
+ await jasmine.triggerMouseEvent(chart, 'mousemove', point0);
+ // Check and see if tooltip was displayed
+ var tooltip = chart.tooltip;
+ var defaults = Chart.defaults;
- done();
- });
+ expect(tooltip).toEqual(jasmine.objectContaining({
+ // Positioning
+ xAlign: 'left',
+ yAlign: 'center',
- jasmine.triggerMouseEvent(chart, 'mousemove', point0);
+ // Text
+ title: ['Point 2'],
+ beforeBody: [],
+ body: [{
+ before: [],
+ lines: ['Dataset 2: 40'],
+ after: []
+ }],
+ afterBody: [],
+ footer: [],
+ labelColors: [{
+ borderColor: defaults.borderColor,
+ backgroundColor: defaults.backgroundColor
+ }]
+ }));
});
- it('should set the caretPadding based on a config setting', function(done) {
+ it('should set the caretPadding based on a config setting', async function() {
var chart = window.acquireChart({
type: 'line',
data: {
var meta0 = chart.getDatasetMeta(0);
var point0 = meta0.data[1];
- afterEvent(chart, 'mousemove', function() {
- // Check and see if tooltip was displayed
- var tooltip = chart.tooltip;
-
- expect(tooltip.options).toEqual(jasmine.objectContaining({
- // Positioning
- caretPadding: 10,
- }));
-
- done();
- });
+ await jasmine.triggerMouseEvent(chart, 'mousemove', point0);
+ // Check and see if tooltip was displayed
+ var tooltip = chart.tooltip;
- jasmine.triggerMouseEvent(chart, 'mousemove', point0);
+ expect(tooltip.options).toEqual(jasmine.objectContaining({
+ // Positioning
+ caretPadding: 10,
+ }));
});
['line', 'bar'].forEach(function(type) {
- it('Should have dataPoints in a ' + type + ' chart', function(done) {
+ it('Should have dataPoints in a ' + type + ' chart', async function() {
var chart = window.acquireChart({
type: type,
data: {
var datasetIndex = 0;
var point = chart.getDatasetMeta(datasetIndex).data[pointIndex];
- afterEvent(chart, 'mousemove', function() {
- // Check and see if tooltip was displayed
- var tooltip = chart.tooltip;
-
- expect(tooltip instanceof Object).toBe(true);
- expect(tooltip.dataPoints instanceof Array).toBe(true);
- expect(tooltip.dataPoints.length).toBe(1);
-
- var tooltipItem = tooltip.dataPoints[0];
+ await jasmine.triggerMouseEvent(chart, 'mousemove', point);
+ // Check and see if tooltip was displayed
+ var tooltip = chart.tooltip;
- expect(tooltipItem.dataIndex).toBe(pointIndex);
- expect(tooltipItem.datasetIndex).toBe(datasetIndex);
- expect(typeof tooltipItem.label).toBe('string');
- expect(tooltipItem.label).toBe(chart.data.labels[pointIndex]);
- expect(typeof tooltipItem.formattedValue).toBe('string');
- expect(tooltipItem.formattedValue).toBe('' + chart.data.datasets[datasetIndex].data[pointIndex]);
+ expect(tooltip instanceof Object).toBe(true);
+ expect(tooltip.dataPoints instanceof Array).toBe(true);
+ expect(tooltip.dataPoints.length).toBe(1);
- done();
- });
+ var tooltipItem = tooltip.dataPoints[0];
- jasmine.triggerMouseEvent(chart, 'mousemove', point);
+ expect(tooltipItem.dataIndex).toBe(pointIndex);
+ expect(tooltipItem.datasetIndex).toBe(datasetIndex);
+ expect(typeof tooltipItem.label).toBe('string');
+ expect(tooltipItem.label).toBe(chart.data.labels[pointIndex]);
+ expect(typeof tooltipItem.formattedValue).toBe('string');
+ expect(tooltipItem.formattedValue).toBe('' + chart.data.datasets[datasetIndex].data[pointIndex]);
});
});
- it('Should not update if active element has not changed', function(done) {
+ it('Should not update if active element has not changed', async function() {
var chart = window.acquireChart({
type: 'line',
data: {
var tooltip = chart.tooltip;
spyOn(tooltip, 'update').and.callThrough();
- afterEvent(chart, 'mousemove', function() {
- expect(tooltip.update).toHaveBeenCalledWith(true);
-
- // Reset calls
- tooltip.update.calls.reset();
+ // First dispatch change event, should update tooltip
+ await jasmine.triggerMouseEvent(chart, 'mousemove', firstPoint);
+ expect(tooltip.update).toHaveBeenCalledWith(true);
- afterEvent(chart, 'mousemove', function() {
- expect(tooltip.update).not.toHaveBeenCalled();
+ // Reset calls
+ tooltip.update.calls.reset();
- done();
- });
- // Second dispatch change event (same event), should not update tooltip
- jasmine.triggerMouseEvent(chart, 'mousemove', firstPoint);
- });
- // First dispatch change event, should update tooltip
- jasmine.triggerMouseEvent(chart, 'mousemove', firstPoint);
+ // Second dispatch change event (same event), should not update tooltip
+ await jasmine.triggerMouseEvent(chart, 'mousemove', firstPoint);
+ expect(tooltip.update).not.toHaveBeenCalled();
});
- it('Should update if active elements are the same, but the position has changed', function(done) {
+ it('Should update if active elements are the same, but the position has changed', async function() {
const chart = window.acquireChart({
type: 'line',
data: {
const tooltip = chart.tooltip;
spyOn(tooltip, 'update');
- afterEvent(chart, 'mousemove', function() {
- expect(tooltip.update).toHaveBeenCalledWith(true);
-
- // Reset calls
- tooltip.update.calls.reset();
+ // First dispatch change event, should update tooltip
+ await jasmine.triggerMouseEvent(chart, 'mousemove', firstPoint);
+ expect(tooltip.update).toHaveBeenCalledWith(true);
- afterEvent(chart, 'mousemove', function() {
- expect(tooltip.update).toHaveBeenCalledWith(true);
+ // Reset calls
+ tooltip.update.calls.reset();
- done();
- });
- // Second dispatch change event (same event), should update tooltip
- // because position mode is 'nearest'
- jasmine.triggerMouseEvent(chart, 'mousemove', secondPoint);
- });
- // First dispatch change event, should update tooltip
- jasmine.triggerMouseEvent(chart, 'mousemove', firstPoint);
+ // Second dispatch change event (same event), should update tooltip
+ // because position mode is 'nearest'
+ await jasmine.triggerMouseEvent(chart, 'mousemove', secondPoint);
+ expect(tooltip.update).toHaveBeenCalledWith(true);
});
describe('positioners', function() {
- it('Should call custom positioner with correct parameters and scope', function(done) {
+ it('Should call custom positioner with correct parameters and scope', async function() {
tooltipPlugin.positioners.test = function() {
return {x: 0, y: 0};
var point = meta.data[pointIndex];
var fn = tooltipPlugin.positioners.test;
- afterEvent(chart, 'mousemove', function() {
- expect(fn.calls.count()).toBe(2);
- expect(fn.calls.first().args[0] instanceof Array).toBe(true);
- expect(Object.prototype.hasOwnProperty.call(fn.calls.first().args[1], 'x')).toBe(true);
- expect(Object.prototype.hasOwnProperty.call(fn.calls.first().args[1], 'y')).toBe(true);
- expect(fn.calls.first().object instanceof Tooltip).toBe(true);
-
- done();
- });
- jasmine.triggerMouseEvent(chart, 'mousemove', point);
+ await jasmine.triggerMouseEvent(chart, 'mousemove', point);
+ expect(fn.calls.count()).toBe(2);
+ expect(fn.calls.first().args[0] instanceof Array).toBe(true);
+ expect(Object.prototype.hasOwnProperty.call(fn.calls.first().args[1], 'x')).toBe(true);
+ expect(Object.prototype.hasOwnProperty.call(fn.calls.first().args[1], 'y')).toBe(true);
+ expect(fn.calls.first().object instanceof Tooltip).toBe(true);
});
});
- it('Should avoid tooltip truncation in x axis if there is enough space to show tooltip without truncation', function(done) {
+ it('Should avoid tooltip truncation in x axis if there is enough space to show tooltip without truncation', async function() {
var chart = window.acquireChart({
type: 'pie',
data: {
}
});
- function testSlice(slice, count) {
+ async function testSlice(slice, count) {
var meta = chart.getDatasetMeta(0);
var point = meta.data[slice].getCenterPoint();
var tooltipPosition = meta.data[slice].tooltipPosition();
- function recursive(left) {
+ async function recursive(left) {
chart.config.data.labels[slice] = chart.config.data.labels[slice] + 'XX';
chart.update();
- afterEvent(chart, 'mouseout', function() {
- afterEvent(chart, 'mousemove', function() {
- var tooltip = chart.tooltip;
- expect(tooltip.dataPoints.length).toBe(1);
- expect(tooltip.x).toBeGreaterThanOrEqual(0);
- if (tooltip.width <= chart.width) {
- expect(tooltip.x + tooltip.width).toBeLessThanOrEqual(chart.width);
- }
- expect(tooltip.caretX).toBeCloseToPixel(tooltipPosition.x);
- // if tooltip is longer than chart area then all tests done
- if (tooltip.width > chart.width || left === 0) {
- done(left === 0 && new Error('max iterations reached'));
- } else {
- recursive(left - 1);
- }
- });
- jasmine.triggerMouseEvent(chart, 'mousemove', point);
- });
-
- jasmine.triggerMouseEvent(chart, 'mouseout', point);
+ await jasmine.triggerMouseEvent(chart, 'mouseout', point);
+ await jasmine.triggerMouseEvent(chart, 'mousemove', point);
+ var tooltip = chart.tooltip;
+ expect(tooltip.dataPoints.length).toBe(1);
+ expect(tooltip.x).toBeGreaterThanOrEqual(0);
+ if (tooltip.width <= chart.width) {
+ expect(tooltip.x + tooltip.width).toBeLessThanOrEqual(chart.width);
+ }
+ expect(tooltip.caretX).toBeCloseToPixel(tooltipPosition.x);
+ // if tooltip is longer than chart area then all tests done
+ if (left === 0) {
+ throw new Error('max iterations reached');
+ }
+ if (tooltip.width < chart.width) {
+ await recursive(left - 1);
+ }
}
- recursive(count);
+ await recursive(count);
}
// Trigger an event over top of the slice
for (var slice = 0; slice < 2; slice++) {
- testSlice(slice, 20);
+ await testSlice(slice, 20);
}
});
- it('Should split newlines into separate lines in user callbacks', function(done) {
+ it('Should split newlines into separate lines in user callbacks', async function() {
var chart = window.acquireChart({
type: 'line',
data: {
var meta = chart.getDatasetMeta(0);
var point = meta.data[1];
- afterEvent(chart, 'mousemove', function() {
- // Check and see if tooltip was displayed
- var tooltip = chart.tooltip;
- var defaults = Chart.defaults;
-
- expect(tooltip.options.xPadding).toEqual(6);
- expect(tooltip.options.yPadding).toEqual(6);
- expect(tooltip.xAlign).toEqual('center');
- expect(tooltip.yAlign).toEqual('top');
-
- expect(tooltip.options.bodyFont).toEqual(jasmine.objectContaining({
- family: defaults.font.family,
- style: defaults.font.style,
- size: defaults.font.size,
- }));
-
- expect(tooltip.options).toEqual(jasmine.objectContaining({
- bodyAlign: 'left',
- bodySpacing: 2,
- }));
-
- expect(tooltip.options.titleFont).toEqual(jasmine.objectContaining({
- family: defaults.font.family,
- style: 'bold',
- size: defaults.font.size,
- }));
-
- expect(tooltip.options).toEqual(jasmine.objectContaining({
- titleAlign: 'left',
- titleSpacing: 2,
- titleMarginBottom: 6,
- }));
-
- expect(tooltip.options.footerFont).toEqual(jasmine.objectContaining({
- family: defaults.font.family,
- style: 'bold',
- size: defaults.font.size,
- }));
-
- expect(tooltip.options).toEqual(jasmine.objectContaining({
- footerAlign: 'left',
- footerSpacing: 2,
- footerMarginTop: 6,
- }));
-
- expect(tooltip.options).toEqual(jasmine.objectContaining({
- // Appearance
- caretSize: 5,
- caretPadding: 2,
- cornerRadius: 6,
- backgroundColor: 'rgba(0,0,0,0.8)',
- multiKeyBackground: '#fff',
- }));
-
- expect(tooltip).toEqual(jasmine.objectContaining({
- opacity: 1,
-
- // Text
- title: ['beforeTitle', 'newline', 'title', 'newline', 'afterTitle', 'newline'],
- beforeBody: ['beforeBody', 'newline'],
- body: [{
- before: ['beforeLabel', 'newline'],
- lines: ['label'],
- after: ['afterLabel', 'newline']
- }, {
- before: ['beforeLabel', 'newline'],
- lines: ['label'],
- after: ['afterLabel', 'newline']
- }],
- afterBody: ['afterBody', 'newline'],
- footer: ['beforeFooter', 'newline', 'footer', 'newline', 'afterFooter', 'newline'],
- labelTextColors: ['labelTextColor', 'labelTextColor'],
- labelColors: [{
- borderColor: defaults.borderColor,
- backgroundColor: defaults.backgroundColor
- }, {
- borderColor: defaults.borderColor,
- backgroundColor: defaults.backgroundColor
- }]
- }));
+ await jasmine.triggerMouseEvent(chart, 'mousemove', point);
- done();
- });
+ // Check and see if tooltip was displayed
+ var tooltip = chart.tooltip;
+ var defaults = Chart.defaults;
- jasmine.triggerMouseEvent(chart, 'mousemove', point);
+ expect(tooltip.options.xPadding).toEqual(6);
+ expect(tooltip.options.yPadding).toEqual(6);
+ expect(tooltip.xAlign).toEqual('center');
+ expect(tooltip.yAlign).toEqual('top');
+
+ expect(tooltip.options.bodyFont).toEqual(jasmine.objectContaining({
+ family: defaults.font.family,
+ style: defaults.font.style,
+ size: defaults.font.size,
+ }));
+
+ expect(tooltip.options).toEqual(jasmine.objectContaining({
+ bodyAlign: 'left',
+ bodySpacing: 2,
+ }));
+
+ expect(tooltip.options.titleFont).toEqual(jasmine.objectContaining({
+ family: defaults.font.family,
+ style: 'bold',
+ size: defaults.font.size,
+ }));
+
+ expect(tooltip.options).toEqual(jasmine.objectContaining({
+ titleAlign: 'left',
+ titleSpacing: 2,
+ titleMarginBottom: 6,
+ }));
+
+ expect(tooltip.options.footerFont).toEqual(jasmine.objectContaining({
+ family: defaults.font.family,
+ style: 'bold',
+ size: defaults.font.size,
+ }));
+
+ expect(tooltip.options).toEqual(jasmine.objectContaining({
+ footerAlign: 'left',
+ footerSpacing: 2,
+ footerMarginTop: 6,
+ }));
+
+ expect(tooltip.options).toEqual(jasmine.objectContaining({
+ // Appearance
+ caretSize: 5,
+ caretPadding: 2,
+ cornerRadius: 6,
+ backgroundColor: 'rgba(0,0,0,0.8)',
+ multiKeyBackground: '#fff',
+ }));
+
+ expect(tooltip).toEqual(jasmine.objectContaining({
+ opacity: 1,
+
+ // Text
+ title: ['beforeTitle', 'newline', 'title', 'newline', 'afterTitle', 'newline'],
+ beforeBody: ['beforeBody', 'newline'],
+ body: [{
+ before: ['beforeLabel', 'newline'],
+ lines: ['label'],
+ after: ['afterLabel', 'newline']
+ }, {
+ before: ['beforeLabel', 'newline'],
+ lines: ['label'],
+ after: ['afterLabel', 'newline']
+ }],
+ afterBody: ['afterBody', 'newline'],
+ footer: ['beforeFooter', 'newline', 'footer', 'newline', 'afterFooter', 'newline'],
+ labelTextColors: ['labelTextColor', 'labelTextColor'],
+ labelColors: [{
+ borderColor: defaults.borderColor,
+ backgroundColor: defaults.backgroundColor
+ }, {
+ borderColor: defaults.borderColor,
+ backgroundColor: defaults.backgroundColor
+ }]
+ }));
});
describe('text align', function() {
projects / thirdparty / Chart.js.git / commitdiff
