From: Jukka Kurkela Date: Tue, 12 Nov 2019 18:59:29 +0000 (+0200) Subject: Convert element.line mock tests to fixtures (#6730) X-Git-Tag: v3.0.0-alpha~246 X-Git-Url: http://git.ipfire.org/cgi-bin/gitweb.cgi?a=commitdiff_plain;h=30cbdc6a4d47e06b20f70534b2bccc46118d1401;p=thirdparty%2FChart.js.git Convert element.line mock tests to fixtures (#6730) --- diff --git a/test/fixtures/element.line/default.js b/test/fixtures/element.line/default.js new file mode 100644 index 000000000..718faa9cc --- /dev/null +++ b/test/fixtures/element.line/default.js @@ -0,0 +1,26 @@ +module.exports = { + config: { + type: 'line', + data: { + datasets: [ + { + data: [{x: 1, y: 10}, {x: 5, y: 0}, {x: 15, y: -10}, {x: 19, y: -5}], + } + ] + }, + options: { + legend: false, + title: false, + scales: { + xAxes: [{type: 'linear', display: false, ticks: {min: 0, max: 20}}], + yAxes: [{display: false, ticks: {min: -15, max: 15}}] + } + } + }, + options: { + canvas: { + height: 256, + width: 512 + } + } +}; diff --git a/test/fixtures/element.line/default.png b/test/fixtures/element.line/default.png new file mode 100644 index 000000000..b686f4d49 Binary files /dev/null and b/test/fixtures/element.line/default.png differ diff --git a/test/fixtures/element.line/skip/all.js b/test/fixtures/element.line/skip/all.js new file mode 100644 index 000000000..1e65f6337 --- /dev/null +++ b/test/fixtures/element.line/skip/all.js @@ -0,0 +1,29 @@ +module.exports = { + config: { + type: 'line', + data: { + datasets: [ + { + data: [{x: 0, y: NaN}, {x: NaN, y: 0}, {x: NaN, y: -10}, {x: 19, y: NaN}], + borderColor: 'red', + fill: true, + lineTension: 0 + } + ] + }, + options: { + legend: false, + title: false, + scales: { + xAxes: [{type: 'linear', display: false, ticks: {min: 0, max: 20}}], + yAxes: [{display: false, ticks: {min: -15, max: 15}}] + } + } + }, + options: { + canvas: { + height: 256, + width: 512 + } + } +}; diff --git a/test/fixtures/element.line/skip/all.png b/test/fixtures/element.line/skip/all.png new file mode 100644 index 000000000..5031ab9bb Binary files /dev/null and b/test/fixtures/element.line/skip/all.png differ diff --git a/test/fixtures/element.line/skip/first-span.js b/test/fixtures/element.line/skip/first-span.js new file mode 100644 index 000000000..4e29d2828 --- /dev/null +++ b/test/fixtures/element.line/skip/first-span.js @@ -0,0 +1,30 @@ +module.exports = { + config: { + type: 'line', + data: { + datasets: [ + { + data: [{x: NaN, y: 10}, {x: 5, y: 0}, {x: 15, y: -10}, {x: 19, y: -5}], + borderColor: 'red', + fill: true, + spanGaps: true, + lineTension: 0 + } + ] + }, + options: { + legend: false, + title: false, + scales: { + xAxes: [{type: 'linear', display: false, ticks: {min: 0, max: 20}}], + yAxes: [{display: false, ticks: {min: -15, max: 15}}] + } + } + }, + options: { + canvas: { + height: 256, + width: 512 + } + } +}; diff --git a/test/fixtures/element.line/skip/first-span.png b/test/fixtures/element.line/skip/first-span.png new file mode 100644 index 000000000..1c2d454ca Binary files /dev/null and b/test/fixtures/element.line/skip/first-span.png differ diff --git a/test/fixtures/element.line/skip/first.js b/test/fixtures/element.line/skip/first.js new file mode 100644 index 000000000..5637cb526 --- /dev/null +++ b/test/fixtures/element.line/skip/first.js @@ -0,0 +1,29 @@ +module.exports = { + config: { + type: 'line', + data: { + datasets: [ + { + data: [{x: NaN, y: 10}, {x: 5, y: 0}, {x: 15, y: -10}, {x: 19, y: -5}], + borderColor: 'red', + fill: true, + lineTension: 0 + } + ] + }, + options: { + legend: false, + title: false, + scales: { + xAxes: [{type: 'linear', display: false, ticks: {min: 0, max: 20}}], + yAxes: [{display: false, ticks: {min: -15, max: 15}}] + } + } + }, + options: { + canvas: { + height: 256, + width: 512 + } + } +}; diff --git a/test/fixtures/element.line/skip/first.png b/test/fixtures/element.line/skip/first.png new file mode 100644 index 000000000..1c2d454ca Binary files /dev/null and b/test/fixtures/element.line/skip/first.png differ diff --git a/test/fixtures/element.line/skip/last-span.js b/test/fixtures/element.line/skip/last-span.js new file mode 100644 index 000000000..f479ea079 --- /dev/null +++ b/test/fixtures/element.line/skip/last-span.js @@ -0,0 +1,30 @@ +module.exports = { + config: { + type: 'line', + data: { + datasets: [ + { + data: [{x: 0, y: 10}, {x: 5, y: 0}, {x: 15, y: -10}, {x: NaN, y: -5}], + borderColor: 'red', + fill: true, + spanGaps: true, + lineTension: 0 + } + ] + }, + options: { + legend: false, + title: false, + scales: { + xAxes: [{type: 'linear', display: false, ticks: {min: 0, max: 20}}], + yAxes: [{display: false, ticks: {min: -15, max: 15}}] + } + } + }, + options: { + canvas: { + height: 256, + width: 512 + } + } +}; diff --git a/test/fixtures/element.line/skip/last-span.png b/test/fixtures/element.line/skip/last-span.png new file mode 100644 index 000000000..23990d1ef Binary files /dev/null and b/test/fixtures/element.line/skip/last-span.png differ diff --git a/test/fixtures/element.line/skip/last.js b/test/fixtures/element.line/skip/last.js new file mode 100644 index 000000000..cb294564f --- /dev/null +++ b/test/fixtures/element.line/skip/last.js @@ -0,0 +1,29 @@ +module.exports = { + config: { + type: 'line', + data: { + datasets: [ + { + data: [{x: 0, y: 10}, {x: 5, y: 0}, {x: 15, y: -10}, {x: NaN, y: -5}], + borderColor: 'red', + fill: true, + lineTension: 0 + } + ] + }, + options: { + legend: false, + title: false, + scales: { + xAxes: [{type: 'linear', display: false, ticks: {min: 0, max: 20}}], + yAxes: [{display: false, ticks: {min: -15, max: 15}}] + } + } + }, + options: { + canvas: { + height: 256, + width: 512 + } + } +}; diff --git a/test/fixtures/element.line/skip/last.png b/test/fixtures/element.line/skip/last.png new file mode 100644 index 000000000..23990d1ef Binary files /dev/null and b/test/fixtures/element.line/skip/last.png differ diff --git a/test/fixtures/element.line/skip/middle-span.js b/test/fixtures/element.line/skip/middle-span.js new file mode 100644 index 000000000..75a3c155f --- /dev/null +++ b/test/fixtures/element.line/skip/middle-span.js @@ -0,0 +1,30 @@ +module.exports = { + config: { + type: 'line', + data: { + datasets: [ + { + data: [{x: 0, y: 10}, {x: 5, y: 0}, {x: NaN, y: -10}, {x: 19, y: -5}], + borderColor: 'red', + fill: true, + spanGaps: true, + lineTension: 0 + } + ] + }, + options: { + legend: false, + title: false, + scales: { + xAxes: [{type: 'linear', display: false, ticks: {min: 0, max: 20}}], + yAxes: [{display: false, ticks: {min: -15, max: 15}}] + } + } + }, + options: { + canvas: { + height: 256, + width: 512 + } + } +}; diff --git a/test/fixtures/element.line/skip/middle-span.png b/test/fixtures/element.line/skip/middle-span.png new file mode 100644 index 000000000..604a0a354 Binary files /dev/null and b/test/fixtures/element.line/skip/middle-span.png differ diff --git a/test/fixtures/element.line/skip/middle.js b/test/fixtures/element.line/skip/middle.js new file mode 100644 index 000000000..80411e9c8 --- /dev/null +++ b/test/fixtures/element.line/skip/middle.js @@ -0,0 +1,29 @@ +module.exports = { + config: { + type: 'line', + data: { + datasets: [ + { + data: [{x: 0, y: 10}, {x: 5, y: 0}, {x: NaN, y: -10}, {x: 19, y: -5}], + borderColor: 'red', + fill: true, + lineTension: 0 + } + ] + }, + options: { + legend: false, + title: false, + scales: { + xAxes: [{type: 'linear', display: false, ticks: {min: 0, max: 20}}], + yAxes: [{display: false, ticks: {min: -15, max: 15}}] + } + } + }, + options: { + canvas: { + height: 256, + width: 512 + } + } +}; diff --git a/test/fixtures/element.line/skip/middle.png b/test/fixtures/element.line/skip/middle.png new file mode 100644 index 000000000..9dc65f8e0 Binary files /dev/null and b/test/fixtures/element.line/skip/middle.png differ diff --git a/test/fixtures/element.line/stepped/after.js b/test/fixtures/element.line/stepped/after.js new file mode 100644 index 000000000..43e5668dc --- /dev/null +++ b/test/fixtures/element.line/stepped/after.js @@ -0,0 +1,30 @@ +module.exports = { + config: { + type: 'line', + data: { + datasets: [ + { + data: [{x: 1, y: 10}, {x: 5, y: 0}, {x: 15, y: -10}, {x: 19, y: -5}], + borderColor: 'red', + fill: false, + lineTension: 0, + steppedLine: 'after' + } + ] + }, + options: { + legend: false, + title: false, + scales: { + xAxes: [{type: 'linear', display: false, ticks: {min: 0, max: 20}}], + yAxes: [{display: false, ticks: {min: -15, max: 15}}] + } + } + }, + options: { + canvas: { + height: 256, + width: 512 + } + } +}; diff --git a/test/fixtures/element.line/stepped/after.png b/test/fixtures/element.line/stepped/after.png new file mode 100644 index 000000000..1fda475d1 Binary files /dev/null and b/test/fixtures/element.line/stepped/after.png differ diff --git a/test/fixtures/element.line/stepped/before.js b/test/fixtures/element.line/stepped/before.js new file mode 100644 index 000000000..e30447365 --- /dev/null +++ b/test/fixtures/element.line/stepped/before.js @@ -0,0 +1,30 @@ +module.exports = { + config: { + type: 'line', + data: { + datasets: [ + { + data: [{x: 1, y: 10}, {x: 5, y: 0}, {x: 15, y: -10}, {x: 19, y: -5}], + borderColor: 'red', + fill: false, + lineTension: 0, + steppedLine: 'before' + } + ] + }, + options: { + legend: false, + title: false, + scales: { + xAxes: [{type: 'linear', display: false, ticks: {min: 0, max: 20}}], + yAxes: [{display: false, ticks: {min: -15, max: 15}}] + } + } + }, + options: { + canvas: { + height: 256, + width: 512 + } + } +}; diff --git a/test/fixtures/element.line/stepped/before.png b/test/fixtures/element.line/stepped/before.png new file mode 100644 index 000000000..d7e464072 Binary files /dev/null and b/test/fixtures/element.line/stepped/before.png differ diff --git a/test/fixtures/element.line/stepped/default.js b/test/fixtures/element.line/stepped/default.js new file mode 100644 index 000000000..88b286ffa --- /dev/null +++ b/test/fixtures/element.line/stepped/default.js @@ -0,0 +1,30 @@ +module.exports = { + config: { + type: 'line', + data: { + datasets: [ + { + data: [{x: 1, y: 10}, {x: 5, y: 0}, {x: 15, y: -10}, {x: 19, y: -5}], + borderColor: 'red', + fill: false, + lineTension: 0, + steppedLine: true + } + ] + }, + options: { + legend: false, + title: false, + scales: { + xAxes: [{type: 'linear', display: false, ticks: {min: 0, max: 20}}], + yAxes: [{display: false, ticks: {min: -15, max: 15}}] + } + } + }, + options: { + canvas: { + height: 256, + width: 512 + } + } +}; diff --git a/test/fixtures/element.line/stepped/default.png b/test/fixtures/element.line/stepped/default.png new file mode 100644 index 000000000..d7e464072 Binary files /dev/null and b/test/fixtures/element.line/stepped/default.png differ diff --git a/test/fixtures/element.line/stepped/middle.js b/test/fixtures/element.line/stepped/middle.js new file mode 100644 index 000000000..3008aef6e --- /dev/null +++ b/test/fixtures/element.line/stepped/middle.js @@ -0,0 +1,30 @@ +module.exports = { + config: { + type: 'line', + data: { + datasets: [ + { + data: [{x: 1, y: 10}, {x: 5, y: 0}, {x: 15, y: -10}, {x: 19, y: -5}], + borderColor: 'red', + fill: false, + lineTension: 0, + steppedLine: 'middle' + } + ] + }, + options: { + legend: false, + title: false, + scales: { + xAxes: [{type: 'linear', display: false, ticks: {min: 0, max: 20}}], + yAxes: [{display: false, ticks: {min: -15, max: 15}}] + } + } + }, + options: { + canvas: { + height: 256, + width: 512 + } + } +}; diff --git a/test/fixtures/element.line/stepped/middle.png b/test/fixtures/element.line/stepped/middle.png new file mode 100644 index 000000000..d60561702 Binary files /dev/null and b/test/fixtures/element.line/stepped/middle.png differ diff --git a/test/fixtures/element.line/tension/default.js b/test/fixtures/element.line/tension/default.js new file mode 100644 index 000000000..c12485925 --- /dev/null +++ b/test/fixtures/element.line/tension/default.js @@ -0,0 +1,28 @@ +module.exports = { + config: { + type: 'line', + data: { + datasets: [ + { + data: [{x: 1, y: 10}, {x: 5, y: 0}, {x: 15, y: -10}, {x: 19, y: -5}], + borderColor: 'red', + fill: false + } + ] + }, + options: { + legend: false, + title: false, + scales: { + xAxes: [{type: 'linear', display: false, ticks: {min: 0, max: 20}}], + yAxes: [{display: false, ticks: {min: -15, max: 15}}] + } + } + }, + options: { + canvas: { + height: 256, + width: 512 + } + } +}; diff --git a/test/fixtures/element.line/tension/default.png b/test/fixtures/element.line/tension/default.png new file mode 100644 index 000000000..d8aeba911 Binary files /dev/null and b/test/fixtures/element.line/tension/default.png differ diff --git a/test/fixtures/element.line/tension/one.js b/test/fixtures/element.line/tension/one.js new file mode 100644 index 000000000..7210a7d6b --- /dev/null +++ b/test/fixtures/element.line/tension/one.js @@ -0,0 +1,29 @@ +module.exports = { + config: { + type: 'line', + data: { + datasets: [ + { + data: [{x: 1, y: 10}, {x: 5, y: 0}, {x: 15, y: -10}, {x: 19, y: -5}], + borderColor: 'red', + fill: false, + lineTension: 1 + } + ] + }, + options: { + legend: false, + title: false, + scales: { + xAxes: [{type: 'linear', display: false, ticks: {min: 0, max: 20}}], + yAxes: [{display: false, ticks: {min: -15, max: 15}}] + } + } + }, + options: { + canvas: { + height: 256, + width: 512 + } + } +}; diff --git a/test/fixtures/element.line/tension/one.png b/test/fixtures/element.line/tension/one.png new file mode 100644 index 000000000..d1773c5f4 Binary files /dev/null and b/test/fixtures/element.line/tension/one.png differ diff --git a/test/fixtures/element.line/tension/zero.js b/test/fixtures/element.line/tension/zero.js new file mode 100644 index 000000000..63fd548e2 --- /dev/null +++ b/test/fixtures/element.line/tension/zero.js @@ -0,0 +1,29 @@ +module.exports = { + config: { + type: 'line', + data: { + datasets: [ + { + data: [{x: 1, y: 10}, {x: 5, y: 0}, {x: 15, y: -10}, {x: 19, y: -5}], + borderColor: 'red', + fill: false, + lineTension: 0 + } + ] + }, + options: { + legend: false, + title: false, + scales: { + xAxes: [{type: 'linear', display: false, ticks: {min: 0, max: 20}}], + yAxes: [{display: false, ticks: {min: -15, max: 15}}] + } + } + }, + options: { + canvas: { + height: 256, + width: 512 + } + } +}; diff --git a/test/fixtures/element.line/tension/zero.png b/test/fixtures/element.line/tension/zero.png new file mode 100644 index 000000000..1b1515894 Binary files /dev/null and b/test/fixtures/element.line/tension/zero.png differ diff --git a/test/specs/element.line.tests.js b/test/specs/element.line.tests.js index e509bbfc9..5697c481a 100644 --- a/test/specs/element.line.tests.js +++ b/test/specs/element.line.tests.js @@ -1,5 +1,7 @@ // Tests for the line element describe('Chart.elements.Line', function() { + describe('auto', jasmine.fixture.specs('element.line')); + it('should be constructed', function() { var line = new Chart.elements.Line({ _datasetindex: 2, @@ -10,1520 +12,4 @@ describe('Chart.elements.Line', function() { expect(line._datasetindex).toBe(2); expect(line._points).toEqual([1, 2, 3, 4]); }); - - it('should draw with default settings', function() { - var mockContext = window.createMockContext(); - - // Create our points - var points = []; - points.push(new Chart.elements.Point({ - _datasetindex: 2, - _index: 0, - _view: { - x: 0, - y: 10, - controlPointNextX: 0, - controlPointNextY: 10 - } - })); - points.push(new Chart.elements.Point({ - _datasetindex: 2, - _index: 1, - _view: { - x: 5, - y: 0, - controlPointPreviousX: 5, - controlPointPreviousY: 0, - controlPointNextX: 5, - controlPointNextY: 0 - } - })); - points.push(new Chart.elements.Point({ - _datasetindex: 2, - _index: 2, - _view: { - x: 15, - y: -10, - controlPointPreviousX: 15, - controlPointPreviousY: -10, - controlPointNextX: 15, - controlPointNextY: -10 - } - })); - points.push(new Chart.elements.Point({ - _datasetindex: 2, - _index: 3, - _view: { - x: 19, - y: -5, - controlPointPreviousX: 19, - controlPointPreviousY: -5, - controlPointNextX: 19, - controlPointNextY: -5 - } - })); - - var line = new Chart.elements.Line({ - _datasetindex: 2, - _ctx: mockContext, - _children: points, - // Need to provide some settings - _view: { - fill: false, // don't want to fill - tension: 0, // no bezier curve for now - } - }); - - line.draw(); - - expect(mockContext.getCalls()).toEqual([{ - name: 'save', - args: [], - }, { - name: 'setLineCap', - args: ['butt'] - }, { - name: 'setLineDash', - args: [ - [] - ] - }, { - name: 'setLineDashOffset', - args: [0.0] - }, { - name: 'setLineJoin', - args: ['miter'] - }, { - name: 'setLineWidth', - args: [3] - }, { - name: 'setStrokeStyle', - args: ['rgba(0,0,0,0.1)'] - }, { - name: 'beginPath', - args: [] - }, { - name: 'moveTo', - args: [0, 10] - }, { - name: 'lineTo', - args: [5, 0] - }, { - name: 'lineTo', - args: [15, -10] - }, { - name: 'lineTo', - args: [19, -5] - }, { - name: 'stroke', - args: [], - }, { - name: 'restore', - args: [] - }]); - }); - - it('should draw with straight lines for a tension of 0', function() { - var mockContext = window.createMockContext(); - - // Create our points - var points = []; - points.push(new Chart.elements.Point({ - _datasetindex: 2, - _index: 0, - _view: { - x: 0, - y: 10, - controlPointNextX: 0, - controlPointNextY: 10, - tension: 0 - } - })); - points.push(new Chart.elements.Point({ - _datasetindex: 2, - _index: 1, - _view: { - x: 5, - y: 0, - controlPointPreviousX: 5, - controlPointPreviousY: 0, - controlPointNextX: 5, - controlPointNextY: 0, - tension: 0 - } - })); - points.push(new Chart.elements.Point({ - _datasetindex: 2, - _index: 2, - _view: { - x: 15, - y: -10, - controlPointPreviousX: 15, - controlPointPreviousY: -10, - controlPointNextX: 15, - controlPointNextY: -10, - tension: 0 - } - })); - points.push(new Chart.elements.Point({ - _datasetindex: 2, - _index: 3, - _view: { - x: 19, - y: -5, - controlPointPreviousX: 19, - controlPointPreviousY: -5, - controlPointNextX: 19, - controlPointNextY: -5, - tension: 0 - } - })); - - var line = new Chart.elements.Line({ - _datasetindex: 2, - _ctx: mockContext, - _children: points, - // Need to provide some settings - _view: { - fill: false, // don't want to fill - tension: 0, // no bezier curve for now - } - }); - - line.draw(); - - expect(mockContext.getCalls()).toEqual([{ - name: 'save', - args: [], - }, { - name: 'setLineCap', - args: ['butt'] - }, { - name: 'setLineDash', - args: [ - [] - ] - }, { - name: 'setLineDashOffset', - args: [0.0] - }, { - name: 'setLineJoin', - args: ['miter'] - }, { - name: 'setLineWidth', - args: [3] - }, { - name: 'setStrokeStyle', - args: ['rgba(0,0,0,0.1)'] - }, { - name: 'beginPath', - args: [] - }, { - name: 'moveTo', - args: [0, 10] - }, { - name: 'lineTo', - args: [5, 0] - }, { - name: 'lineTo', - args: [15, -10] - }, { - name: 'lineTo', - args: [19, -5] - }, { - name: 'stroke', - args: [], - }, { - name: 'restore', - args: [] - }]); - }); - - it('should draw stepped lines, with "before" interpolation', function() { - - // Both `true` and `'before'` should draw the same steppedLine - var beforeInterpolations = [true, 'before']; - - beforeInterpolations.forEach(function(mode) { - var mockContext = window.createMockContext(); - - // Create our points - var points = []; - points.push(new Chart.elements.Point({ - _datasetindex: 2, - _index: 0, - _view: { - x: 0, - y: 10, - controlPointNextX: 0, - controlPointNextY: 10, - steppedLine: mode - } - })); - points.push(new Chart.elements.Point({ - _datasetindex: 2, - _index: 1, - _view: { - x: 5, - y: 0, - controlPointPreviousX: 5, - controlPointPreviousY: 0, - controlPointNextX: 5, - controlPointNextY: 0, - steppedLine: mode - } - })); - points.push(new Chart.elements.Point({ - _datasetindex: 2, - _index: 2, - _view: { - x: 15, - y: -10, - controlPointPreviousX: 15, - controlPointPreviousY: -10, - controlPointNextX: 15, - controlPointNextY: -10, - steppedLine: mode - } - })); - points.push(new Chart.elements.Point({ - _datasetindex: 2, - _index: 3, - _view: { - x: 19, - y: -5, - controlPointPreviousX: 19, - controlPointPreviousY: -5, - controlPointNextX: 19, - controlPointNextY: -5, - steppedLine: mode - } - })); - - var line = new Chart.elements.Line({ - _datasetindex: 2, - _ctx: mockContext, - _children: points, - // Need to provide some settings - _view: { - fill: false, // don't want to fill - tension: 0, // no bezier curve for now - } - }); - - line.draw(); - - expect(mockContext.getCalls()).toEqual([{ - name: 'save', - args: [], - }, { - name: 'setLineCap', - args: ['butt'] - }, { - name: 'setLineDash', - args: [ - [] - ] - }, { - name: 'setLineDashOffset', - args: [0.0] - }, { - name: 'setLineJoin', - args: ['miter'] - }, { - name: 'setLineWidth', - args: [3] - }, { - name: 'setStrokeStyle', - args: ['rgba(0,0,0,0.1)'] - }, { - name: 'beginPath', - args: [] - }, { - name: 'moveTo', - args: [0, 10] - }, { - name: 'lineTo', - args: [5, 10] - }, { - name: 'lineTo', - args: [5, 0] - }, { - name: 'lineTo', - args: [15, 0] - }, { - name: 'lineTo', - args: [15, -10] - }, { - name: 'lineTo', - args: [19, -10] - }, { - name: 'lineTo', - args: [19, -5] - }, { - name: 'stroke', - args: [], - }, { - name: 'restore', - args: [] - }]); - }); - }); - - it('should draw stepped lines, with "middle" interpolation', function() { - - var mockContext = window.createMockContext(); - - // Create our points - var points = []; - points.push(new Chart.elements.Point({ - _datasetindex: 2, - _index: 0, - _view: { - x: 0, - y: 10, - controlPointNextX: 0, - controlPointNextY: 10, - steppedLine: 'middle' - } - })); - points.push(new Chart.elements.Point({ - _datasetindex: 2, - _index: 1, - _view: { - x: 5, - y: 0, - controlPointPreviousX: 5, - controlPointPreviousY: 0, - controlPointNextX: 5, - controlPointNextY: 0, - steppedLine: 'middle' - } - })); - points.push(new Chart.elements.Point({ - _datasetindex: 2, - _index: 2, - _view: { - x: 15, - y: -10, - controlPointPreviousX: 15, - controlPointPreviousY: -10, - controlPointNextX: 15, - controlPointNextY: -10, - steppedLine: 'middle' - } - })); - points.push(new Chart.elements.Point({ - _datasetindex: 2, - _index: 3, - _view: { - x: 19, - y: -5, - controlPointPreviousX: 19, - controlPointPreviousY: -5, - controlPointNextX: 19, - controlPointNextY: -5, - steppedLine: 'middle' - } - })); - - var line = new Chart.elements.Line({ - _datasetindex: 2, - _ctx: mockContext, - _children: points, - // Need to provide some settings - _view: { - fill: false, // don't want to fill - tension: 0, // no bezier curve for now - } - }); - - line.draw(); - - expect(mockContext.getCalls()).toEqual([{ - name: 'save', - args: [], - }, { - name: 'setLineCap', - args: ['butt'] - }, { - name: 'setLineDash', - args: [ - [] - ] - }, { - name: 'setLineDashOffset', - args: [0.0] - }, { - name: 'setLineJoin', - args: ['miter'] - }, { - name: 'setLineWidth', - args: [3] - }, { - name: 'setStrokeStyle', - args: ['rgba(0,0,0,0.1)'] - }, { - name: 'beginPath', - args: [] - }, { - name: 'moveTo', - args: [0, 10] - }, { - name: 'lineTo', - args: [2.5, 10] - }, { - name: 'lineTo', - args: [2.5, 0] - }, { - name: 'lineTo', - args: [5, 0] - }, { - name: 'lineTo', - args: [10, 0] - }, { - name: 'lineTo', - args: [10, -10] - }, { - name: 'lineTo', - args: [15, -10] - }, { - name: 'lineTo', - args: [17, -10] - }, { - name: 'lineTo', - args: [17, -5] - }, { - name: 'lineTo', - args: [19, -5] - }, { - name: 'stroke', - args: [], - }, { - name: 'restore', - args: [] - }]); - }); - - it('should draw stepped lines, with "after" interpolation', function() { - - var mockContext = window.createMockContext(); - - // Create our points - var points = []; - points.push(new Chart.elements.Point({ - _datasetindex: 2, - _index: 0, - _view: { - x: 0, - y: 10, - controlPointNextX: 0, - controlPointNextY: 10, - steppedLine: 'after' - } - })); - points.push(new Chart.elements.Point({ - _datasetindex: 2, - _index: 1, - _view: { - x: 5, - y: 0, - controlPointPreviousX: 5, - controlPointPreviousY: 0, - controlPointNextX: 5, - controlPointNextY: 0, - steppedLine: 'after' - } - })); - points.push(new Chart.elements.Point({ - _datasetindex: 2, - _index: 2, - _view: { - x: 15, - y: -10, - controlPointPreviousX: 15, - controlPointPreviousY: -10, - controlPointNextX: 15, - controlPointNextY: -10, - steppedLine: 'after' - } - })); - points.push(new Chart.elements.Point({ - _datasetindex: 2, - _index: 3, - _view: { - x: 19, - y: -5, - controlPointPreviousX: 19, - controlPointPreviousY: -5, - controlPointNextX: 19, - controlPointNextY: -5, - steppedLine: 'after' - } - })); - - var line = new Chart.elements.Line({ - _datasetindex: 2, - _ctx: mockContext, - _children: points, - // Need to provide some settings - _view: { - fill: false, // don't want to fill - tension: 0, // no bezier curve for now - } - }); - - line.draw(); - - expect(mockContext.getCalls()).toEqual([{ - name: 'save', - args: [], - }, { - name: 'setLineCap', - args: ['butt'] - }, { - name: 'setLineDash', - args: [ - [] - ] - }, { - name: 'setLineDashOffset', - args: [0.0] - }, { - name: 'setLineJoin', - args: ['miter'] - }, { - name: 'setLineWidth', - args: [3] - }, { - name: 'setStrokeStyle', - args: ['rgba(0,0,0,0.1)'] - }, { - name: 'beginPath', - args: [] - }, { - name: 'moveTo', - args: [0, 10] - }, { - name: 'lineTo', - args: [0, 0] - }, { - name: 'lineTo', - args: [5, 0] - }, { - name: 'lineTo', - args: [5, -10] - }, { - name: 'lineTo', - args: [15, -10] - }, { - name: 'lineTo', - args: [15, -5] - }, { - name: 'lineTo', - args: [19, -5] - }, { - name: 'stroke', - args: [], - }, { - name: 'restore', - args: [] - }]); - }); - - it('should draw with custom settings', function() { - var mockContext = window.createMockContext(); - - // Create our points - var points = []; - points.push(new Chart.elements.Point({ - _datasetindex: 2, - _index: 0, - _view: { - x: 0, - y: 10, - controlPointNextX: 0, - controlPointNextY: 10 - } - })); - points.push(new Chart.elements.Point({ - _datasetindex: 2, - _index: 1, - _view: { - x: 5, - y: 0, - controlPointPreviousX: 5, - controlPointPreviousY: 0, - controlPointNextX: 5, - controlPointNextY: 0 - } - })); - points.push(new Chart.elements.Point({ - _datasetindex: 2, - _index: 2, - _view: { - x: 15, - y: -10, - controlPointPreviousX: 15, - controlPointPreviousY: -10, - controlPointNextX: 15, - controlPointNextY: -10 - } - })); - points.push(new Chart.elements.Point({ - _datasetindex: 2, - _index: 3, - _view: { - x: 19, - y: -5, - controlPointPreviousX: 19, - controlPointPreviousY: -5, - controlPointNextX: 19, - controlPointNextY: -5 - } - })); - - var line = new Chart.elements.Line({ - _datasetindex: 2, - _ctx: mockContext, - _children: points, - // Need to provide some settings - _view: { - fill: true, - tension: 0, // no bezier curve for now - - borderCapStyle: 'round', - borderColor: 'rgb(255, 255, 0)', - borderDash: [2, 2], - borderDashOffset: 1.5, - borderJoinStyle: 'bevel', - borderWidth: 4, - backgroundColor: 'rgb(0, 0, 0)' - } - }); - - line.draw(); - - var expected = [{ - name: 'save', - args: [] - }, { - name: 'setLineCap', - args: ['round'] - }, { - name: 'setLineDash', - args: [ - [2, 2] - ] - }, { - name: 'setLineDashOffset', - args: [1.5] - }, { - name: 'setLineJoin', - args: ['bevel'] - }, { - name: 'setLineWidth', - args: [4] - }, { - name: 'setStrokeStyle', - args: ['rgb(255, 255, 0)'] - }, { - name: 'beginPath', - args: [] - }, { - name: 'moveTo', - args: [0, 10] - }, { - name: 'lineTo', - args: [5, 0] - }, { - name: 'lineTo', - args: [15, -10] - }, { - name: 'lineTo', - args: [19, -5] - }, { - name: 'stroke', - args: [] - }, { - name: 'restore', - args: [] - }]; - expect(mockContext.getCalls()).toEqual(expected); - }); - - it('should skip points correctly', function() { - var mockContext = window.createMockContext(); - - // Create our points - var points = []; - points.push(new Chart.elements.Point({ - _datasetindex: 2, - _index: 0, - _view: { - x: 0, - y: 10, - controlPointNextX: 0, - controlPointNextY: 10 - } - })); - points.push(new Chart.elements.Point({ - _datasetindex: 2, - _index: 1, - _view: { - x: 5, - y: 0, - controlPointPreviousX: 5, - controlPointPreviousY: 0, - controlPointNextX: 5, - controlPointNextY: 0 - } - })); - points.push(new Chart.elements.Point({ - _datasetindex: 2, - _index: 2, - _view: { - x: 15, - y: -10, - controlPointPreviousX: 15, - controlPointPreviousY: -10, - controlPointNextX: 15, - controlPointNextY: -10, - skip: true - } - })); - points.push(new Chart.elements.Point({ - _datasetindex: 2, - _index: 3, - _view: { - x: 19, - y: -5, - controlPointPreviousX: 19, - controlPointPreviousY: -5, - controlPointNextX: 19, - controlPointNextY: -5 - } - })); - - var line = new Chart.elements.Line({ - _datasetindex: 2, - _ctx: mockContext, - _children: points, - // Need to provide some settings - _view: { - fill: true, - tension: 0, // no bezier curve for now - } - }); - - line.draw(); - - var expected = [{ - name: 'save', - args: [] - }, { - name: 'setLineCap', - args: ['butt'] - }, { - name: 'setLineDash', - args: [ - [] - ] - }, { - name: 'setLineDashOffset', - args: [0] - }, { - name: 'setLineJoin', - args: ['miter'] - }, { - name: 'setLineWidth', - args: [3] - }, { - name: 'setStrokeStyle', - args: ['rgba(0,0,0,0.1)'] - }, { - name: 'beginPath', - args: [] - }, { - name: 'moveTo', - args: [0, 10] - }, { - name: 'lineTo', - args: [5, 0] - }, { - name: 'moveTo', - args: [19, -5] - }, { - name: 'stroke', - args: [] - }, { - name: 'restore', - args: [] - }]; - expect(mockContext.getCalls()).toEqual(expected); - }); - - it('should skip points correctly when spanGaps is true', function() { - var mockContext = window.createMockContext(); - - // Create our points - var points = []; - points.push(new Chart.elements.Point({ - _datasetindex: 2, - _index: 0, - _view: { - x: 0, - y: 10, - controlPointNextX: 0, - controlPointNextY: 10 - } - })); - points.push(new Chart.elements.Point({ - _datasetindex: 2, - _index: 1, - _view: { - x: 5, - y: 0, - controlPointPreviousX: 5, - controlPointPreviousY: 0, - controlPointNextX: 5, - controlPointNextY: 0 - } - })); - points.push(new Chart.elements.Point({ - _datasetindex: 2, - _index: 2, - _view: { - x: 15, - y: -10, - controlPointPreviousX: 15, - controlPointPreviousY: -10, - controlPointNextX: 15, - controlPointNextY: -10, - skip: true - } - })); - points.push(new Chart.elements.Point({ - _datasetindex: 2, - _index: 3, - _view: { - x: 19, - y: -5, - controlPointPreviousX: 19, - controlPointPreviousY: -5, - controlPointNextX: 19, - controlPointNextY: -5 - } - })); - - var line = new Chart.elements.Line({ - _datasetindex: 2, - _ctx: mockContext, - _children: points, - // Need to provide some settings - _view: { - fill: true, - tension: 0, // no bezier curve for now - spanGaps: true - } - }); - - line.draw(); - - var expected = [{ - name: 'save', - args: [] - }, { - name: 'setLineCap', - args: ['butt'] - }, { - name: 'setLineDash', - args: [ - [] - ] - }, { - name: 'setLineDashOffset', - args: [0] - }, { - name: 'setLineJoin', - args: ['miter'] - }, { - name: 'setLineWidth', - args: [3] - }, { - name: 'setStrokeStyle', - args: ['rgba(0,0,0,0.1)'] - }, { - name: 'beginPath', - args: [] - }, { - name: 'moveTo', - args: [0, 10] - }, { - name: 'lineTo', - args: [5, 0] - }, { - name: 'lineTo', - args: [19, -5] - }, { - name: 'stroke', - args: [] - }, { - name: 'restore', - args: [] - }]; - expect(mockContext.getCalls()).toEqual(expected); - }); - - it('should skip points correctly when all points are skipped', function() { - var mockContext = window.createMockContext(); - - // Create our points - var points = []; - points.push(new Chart.elements.Point({ - _datasetindex: 2, - _index: 0, - _view: { - x: 0, - y: 10, - controlPointNextX: 0, - controlPointNextY: 10, - skip: true - } - })); - points.push(new Chart.elements.Point({ - _datasetindex: 2, - _index: 1, - _view: { - x: 5, - y: 0, - controlPointPreviousX: 5, - controlPointPreviousY: 0, - controlPointNextX: 5, - controlPointNextY: 0, - skip: true - } - })); - points.push(new Chart.elements.Point({ - _datasetindex: 2, - _index: 2, - _view: { - x: 15, - y: -10, - controlPointPreviousX: 15, - controlPointPreviousY: -10, - controlPointNextX: 15, - controlPointNextY: -10, - skip: true - } - })); - points.push(new Chart.elements.Point({ - _datasetindex: 2, - _index: 3, - _view: { - x: 19, - y: -5, - controlPointPreviousX: 19, - controlPointPreviousY: -5, - controlPointNextX: 19, - controlPointNextY: -5, - skip: true - } - })); - - var line = new Chart.elements.Line({ - _datasetindex: 2, - _ctx: mockContext, - _children: points, - // Need to provide some settings - _view: { - fill: true, - tension: 0, // no bezier curve for now - spanGaps: true - } - }); - - line.draw(); - - var expected = [{ - name: 'save', - args: [] - }, { - name: 'setLineCap', - args: ['butt'] - }, { - name: 'setLineDash', - args: [ - [] - ] - }, { - name: 'setLineDashOffset', - args: [0] - }, { - name: 'setLineJoin', - args: ['miter'] - }, { - name: 'setLineWidth', - args: [3] - }, { - name: 'setStrokeStyle', - args: ['rgba(0,0,0,0.1)'] - }, { - name: 'beginPath', - args: [] - }, { - name: 'stroke', - args: [] - }, { - name: 'restore', - args: [] - }]; - expect(mockContext.getCalls()).toEqual(expected); - }); - - it('should skip the first point correctly', function() { - var mockContext = window.createMockContext(); - - // Create our points - var points = []; - points.push(new Chart.elements.Point({ - _datasetindex: 2, - _index: 0, - _view: { - x: 0, - y: 10, - controlPointNextX: 0, - controlPointNextY: 10, - skip: true - } - })); - points.push(new Chart.elements.Point({ - _datasetindex: 2, - _index: 1, - _view: { - x: 5, - y: 0, - controlPointPreviousX: 5, - controlPointPreviousY: 0, - controlPointNextX: 5, - controlPointNextY: 0 - } - })); - points.push(new Chart.elements.Point({ - _datasetindex: 2, - _index: 2, - _view: { - x: 15, - y: -10, - controlPointPreviousX: 15, - controlPointPreviousY: -10, - controlPointNextX: 15, - controlPointNextY: -10 - } - })); - points.push(new Chart.elements.Point({ - _datasetindex: 2, - _index: 3, - _view: { - x: 19, - y: -5, - controlPointPreviousX: 19, - controlPointPreviousY: -5, - controlPointNextX: 19, - controlPointNextY: -5 - } - })); - - var line = new Chart.elements.Line({ - _datasetindex: 2, - _ctx: mockContext, - _children: points, - // Need to provide some settings - _view: { - fill: true, - tension: 0, // no bezier curve for now - } - }); - - line.draw(); - - var expected = [{ - name: 'save', - args: [] - }, { - name: 'setLineCap', - args: ['butt'] - }, { - name: 'setLineDash', - args: [ - [] - ] - }, { - name: 'setLineDashOffset', - args: [0] - }, { - name: 'setLineJoin', - args: ['miter'] - }, { - name: 'setLineWidth', - args: [3] - }, { - name: 'setStrokeStyle', - args: ['rgba(0,0,0,0.1)'] - }, { - name: 'beginPath', - args: [] - }, { - name: 'moveTo', - args: [5, 0] - }, { - name: 'lineTo', - args: [15, -10] - }, { - name: 'lineTo', - args: [19, -5] - }, { - name: 'stroke', - args: [] - }, { - name: 'restore', - args: [] - }]; - expect(mockContext.getCalls()).toEqual(expected); - }); - - it('should skip the first point correctly when spanGaps is true', function() { - var mockContext = window.createMockContext(); - - // Create our points - var points = []; - points.push(new Chart.elements.Point({ - _datasetindex: 2, - _index: 0, - _view: { - x: 0, - y: 10, - controlPointNextX: 0, - controlPointNextY: 10, - skip: true - } - })); - points.push(new Chart.elements.Point({ - _datasetindex: 2, - _index: 1, - _view: { - x: 5, - y: 0, - controlPointPreviousX: 5, - controlPointPreviousY: 0, - controlPointNextX: 5, - controlPointNextY: 0 - } - })); - points.push(new Chart.elements.Point({ - _datasetindex: 2, - _index: 2, - _view: { - x: 15, - y: -10, - controlPointPreviousX: 15, - controlPointPreviousY: -10, - controlPointNextX: 15, - controlPointNextY: -10 - } - })); - points.push(new Chart.elements.Point({ - _datasetindex: 2, - _index: 3, - _view: { - x: 19, - y: -5, - controlPointPreviousX: 19, - controlPointPreviousY: -5, - controlPointNextX: 19, - controlPointNextY: -5 - } - })); - - var line = new Chart.elements.Line({ - _datasetindex: 2, - _ctx: mockContext, - _children: points, - // Need to provide some settings - _view: { - fill: true, - tension: 0, // no bezier curve for now - spanGaps: true - } - }); - - line.draw(); - - var expected = [{ - name: 'save', - args: [] - }, { - name: 'setLineCap', - args: ['butt'] - }, { - name: 'setLineDash', - args: [ - [] - ] - }, { - name: 'setLineDashOffset', - args: [0] - }, { - name: 'setLineJoin', - args: ['miter'] - }, { - name: 'setLineWidth', - args: [3] - }, { - name: 'setStrokeStyle', - args: ['rgba(0,0,0,0.1)'] - }, { - name: 'beginPath', - args: [] - }, { - name: 'moveTo', - args: [5, 0] - }, { - name: 'lineTo', - args: [15, -10] - }, { - name: 'lineTo', - args: [19, -5] - }, { - name: 'stroke', - args: [] - }, { - name: 'restore', - args: [] - }]; - expect(mockContext.getCalls()).toEqual(expected); - }); - - it('should skip the last point correctly', function() { - var mockContext = window.createMockContext(); - - // Create our points - var points = []; - points.push(new Chart.elements.Point({ - _datasetindex: 2, - _index: 0, - _view: { - x: 0, - y: 10, - controlPointNextX: 0, - controlPointNextY: 10 - } - })); - points.push(new Chart.elements.Point({ - _datasetindex: 2, - _index: 1, - _view: { - x: 5, - y: 0, - controlPointPreviousX: 5, - controlPointPreviousY: 0, - controlPointNextX: 5, - controlPointNextY: 0 - } - })); - points.push(new Chart.elements.Point({ - _datasetindex: 2, - _index: 2, - _view: { - x: 15, - y: -10, - controlPointPreviousX: 15, - controlPointPreviousY: -10, - controlPointNextX: 15, - controlPointNextY: -10 - } - })); - points.push(new Chart.elements.Point({ - _datasetindex: 2, - _index: 3, - _view: { - x: 19, - y: -5, - controlPointPreviousX: 19, - controlPointPreviousY: -5, - controlPointNextX: 19, - controlPointNextY: -5, - skip: true - } - })); - - var line = new Chart.elements.Line({ - _datasetindex: 2, - _ctx: mockContext, - _children: points, - // Need to provide some settings - _view: { - fill: true, - tension: 0, // no bezier curve for now - } - }); - - line.draw(); - - var expected = [{ - name: 'save', - args: [] - }, { - name: 'setLineCap', - args: ['butt'] - }, { - name: 'setLineDash', - args: [ - [] - ] - }, { - name: 'setLineDashOffset', - args: [0] - }, { - name: 'setLineJoin', - args: ['miter'] - }, { - name: 'setLineWidth', - args: [3] - }, { - name: 'setStrokeStyle', - args: ['rgba(0,0,0,0.1)'] - }, { - name: 'beginPath', - args: [] - }, { - name: 'moveTo', - args: [0, 10] - }, { - name: 'lineTo', - args: [5, 0] - }, { - name: 'lineTo', - args: [15, -10] - }, { - name: 'stroke', - args: [] - }, { - name: 'restore', - args: [] - }]; - expect(mockContext.getCalls()).toEqual(expected); - }); - - it('should skip the last point correctly when spanGaps is true', function() { - var mockContext = window.createMockContext(); - - // Create our points - var points = []; - points.push(new Chart.elements.Point({ - _datasetindex: 2, - _index: 0, - _view: { - x: 0, - y: 10, - controlPointNextX: 0, - controlPointNextY: 10 - } - })); - points.push(new Chart.elements.Point({ - _datasetindex: 2, - _index: 1, - _view: { - x: 5, - y: 0, - controlPointPreviousX: 5, - controlPointPreviousY: 0, - controlPointNextX: 5, - controlPointNextY: 0 - } - })); - points.push(new Chart.elements.Point({ - _datasetindex: 2, - _index: 2, - _view: { - x: 15, - y: -10, - controlPointPreviousX: 15, - controlPointPreviousY: -10, - controlPointNextX: 15, - controlPointNextY: -10 - } - })); - points.push(new Chart.elements.Point({ - _datasetindex: 2, - _index: 3, - _view: { - x: 19, - y: -5, - controlPointPreviousX: 19, - controlPointPreviousY: -5, - controlPointNextX: 19, - controlPointNextY: -5, - skip: true - } - })); - - var line = new Chart.elements.Line({ - _datasetindex: 2, - _ctx: mockContext, - _children: points, - // Need to provide some settings - _view: { - fill: true, - tension: 0, // no bezier curve for now - spanGaps: true - } - }); - - line.draw(); - - var expected = [{ - name: 'save', - args: [] - }, { - name: 'setLineCap', - args: ['butt'] - }, { - name: 'setLineDash', - args: [ - [] - ] - }, { - name: 'setLineDashOffset', - args: [0] - }, { - name: 'setLineJoin', - args: ['miter'] - }, { - name: 'setLineWidth', - args: [3] - }, { - name: 'setStrokeStyle', - args: ['rgba(0,0,0,0.1)'] - }, { - name: 'beginPath', - args: [] - }, { - name: 'moveTo', - args: [0, 10] - }, { - name: 'lineTo', - args: [5, 0] - }, { - name: 'lineTo', - args: [15, -10] - }, { - name: 'stroke', - args: [] - }, { - name: 'restore', - args: [] - }]; - expect(mockContext.getCalls()).toEqual(expected); - }); });