diff --git a/src/Plugin/stanford/index.ts b/src/Plugin/stanford/index.ts index 1eccf98fc..f74222340 100644 --- a/src/Plugin/stanford/index.ts +++ b/src/Plugin/stanford/index.ts @@ -12,7 +12,7 @@ import Plugin from "../Plugin"; import Options from "./Options"; import Elements from "./Elements"; import ColorScale from "./ColorScale"; -import {compareEpochs, isEmpty, isFunction, isString, parseDate, pointInRegion} from "./util"; +import {compareEpochs, isEmpty, isFunction, pointInRegion} from "./util"; /** * Stanford diagram plugin @@ -173,29 +173,6 @@ export default class Stanford extends Plugin { }); } - xvCustom(d, xyValue): number { - const $$ = this; - const {axis, config} = $$; - let value = xyValue ? d[xyValue] : $$.getBaseValue(d); - - if (axis.isTimeSeries()) { - value = parseDate.call($$, value); - } else if (axis.isCategorized() && isString(value)) { - value = config.axis_x_categories.indexOf(d.value); - } - - return Math.ceil($$.scale.x(value)); - } - - yvCustom(d, xyValue): number { - const $$ = this; - const {scale} = $$; - const yScale = d.axis && d.axis === "y2" ? scale.y2 : scale.y; - const value = xyValue ? d[xyValue] : $$.getBaseValue(d); - - return Math.ceil(yScale(value)); - } - initStanfordData(): void { const {config} = this; const target = this.$$.data.targets[0]; diff --git a/test/internals/text-spec.ts b/test/internals/text-spec.ts index b6619ceda..0ab515a7c 100644 --- a/test/internals/text-spec.ts +++ b/test/internals/text-spec.ts @@ -19,10 +19,6 @@ describe("TEXT", () => { chart = util.generate(args); }); - afterEach(() => { - chart.destroy(); - }); - const checkXY = function(x, y, prefix = "c", delta: any = {x: 1, y: 1}) { if (isNumber(delta)) { delta = {x: delta, y: delta}; @@ -1238,6 +1234,9 @@ describe("TEXT", () => { ["data2", 130, 100, 140] ], labels: true + }, + transition: { + duration: 200 } }; }); @@ -1247,30 +1246,34 @@ describe("TEXT", () => { const pos: number[] = []; let text; let interval; + let cnt = 0; + + chart.load({ + columns: [ + ["data2", 44, 134, 98, 170] + ], + done: function () { + setTimeout(() => { + interval && clearInterval(interval); + const currPos = +text.attr("x"); + + expect(Math.round(pos[0])).to.not.equal(0); + expect(pos.every(v => v === currPos)).to.be.true; + + done(); + }, 500); + } + }); - setTimeout(() => { - interval = setInterval(() => { - text = main.select(`.${$TEXT.texts}-data2 .${$TEXT.text}-3`); - pos.push(+text.attr("x")); - }, 100); + interval = setInterval(() => { + text = main.select(`.${$TEXT.texts}-data2 .${$TEXT.text}-3`); - chart.load({ - columns: [ - ["data2", 44, 134, 98, 170] - ], - done: function () { - setTimeout(() => { - clearInterval(interval); - const currPos = +text.attr("x"); - - expect(Math.round(pos[0])).to.not.equal(0); - expect(pos.every(v => v === currPos)).to.be.true; + if (text.size()) { + pos.push(+text.attr("x")); + clearInterval(interval); + } + }, 80); - done(); - }, 500); - } - }); - }, 500); }); }); diff --git a/test/plugin/sparkline/sparkline-spec.ts b/test/plugin/sparkline/sparkline-spec.ts index 73652482f..6e7c18b7b 100644 --- a/test/plugin/sparkline/sparkline-spec.ts +++ b/test/plugin/sparkline/sparkline-spec.ts @@ -10,7 +10,7 @@ import util from "../../assets/util"; describe("PLUGIN: SPARKLINE", () => { let chart; - const selector = ".sparkline"; + let selector = ".sparkline"; let args: any = { size: { width: 150, @@ -30,6 +30,11 @@ describe("PLUGIN: SPARKLINE", () => { tooltip: { show: true }, + point: { + focus: { + only: true + } + }, plugins: [ new Sparkline({ selector @@ -60,10 +65,22 @@ describe("PLUGIN: SPARKLINE", () => { }); it("check for tooltip interaction", () => { + const {state: {eventReceiver}} = chart.internal; const el = chart.plugins[0].element[0]; const {tooltip} = chart.$; const svg = el.querySelector("svg"); + const eventWidth = eventReceiver.rect.width; + + // when + util.fireEvent(svg, "mouseover", { + clientX: 10, + clientY: 10 + }, chart); + + expect(eventReceiver !== eventReceiver.rect.width).to.be.true; + + // hover 1st chart element util.fireEvent(svg, "mousemove", { clientX: 10, @@ -105,6 +122,119 @@ describe("PLUGIN: SPARKLINE", () => { // tooltip element shouldn't be added to the DOM expect(chart.$.tooltip).to.be.null; }); + + it("set options: axis padding", () => { + args = { + data: { + columns: [ + ["data1", 30, 20, 50], + ["data2", 200, 130, 90], + ["data3", 300, 200, 160] + ], + types: { + data2: "bar", + data3: "area" + } + }, + padding: {}, + tooltip: { + show: true + }, + point: { + focus: { + only: true + } + }, + axis: { + x: { + padding: { + left: 10, + right: 20 + } + }, + y: { + padding: { + top: 10 + } + } + }, + plugins: [ + new Sparkline({ + selector + }) + ] + } + }); + + it("padding value should be overriden", () => { + expect(chart.config("axis.x.padding")).to.be.deep.equal({ + left: 15, + right: 15, + unit: "px" + }); + + expect(chart.config("axis.y.padding")).to.be.deep.equal(5); + }); + }); + + describe("check initialization", () => { + it("when wrong holder selector is given", () => { + try { + util.generate({ + data: { + columns: [ + ["data1", 30, 20, 50], + ["data2", 200, 130, 90], + ["data3", 300, 200, 160] + ], + types: { + data3: "area" + } + }, + padding: {}, + tooltip: { + show: true + }, + plugins: [ + new Sparkline({ + selector: "#no-chart" + }) + ] + }); + } catch(e) { + expect(e.message.indexOf("No holder elements found") >-1).to.be.true; + } + }); + + it("when scatter type is found", () => { + try { + util.generate({ + data: { + columns: [ + ["data1", 30, 20, 50], + ["data2", 200, 130, 90], + ["data3", 300, 200, 160] + ], + types: { + data2: "bar", + data3: "scatter" + } + }, + padding: {}, + tooltip: { + show: true + }, + plugins: [ + new Sparkline({ + selector + }) + ] + }); + } catch(e) { + expect(e.message.indexOf("Contains non supported chart types") >-1).to.be.true; + } + }); + }); describe("point option", () => { diff --git a/test/plugin/stanford/stanford-spec.ts b/test/plugin/stanford/stanford-spec.ts index fd41fc133..e85ff3748 100644 --- a/test/plugin/stanford/stanford-spec.ts +++ b/test/plugin/stanford/stanford-spec.ts @@ -13,23 +13,27 @@ import {compareEpochs, getCentroid, getRegionArea, pointInRegion} from "../../.. describe("PLUGIN: STANFORD", () => { let chart; let stanford = new Stanford({ epochs: [30, 35] }); - let args: any = { - data: { - x: "x", - columns: [ - ["x", 25, 35], - ["y", 25, 33] - ], - type: "scatter" - }, - plugins: [stanford] - }; + let args; beforeEach(() => { chart = util.generate(args); }); describe("countEpochsInRegion", () => { + before(() => { + args = { + data: { + x: "x", + columns: [ + ["x", 25, 35], + ["y", 25, 33] + ], + type: "scatter" + }, + plugins: [stanford] + }; + }) + it("should return 0 if the region has no epochs", () => { const region = [ {x: 0, y: 0}, @@ -287,4 +291,242 @@ describe("PLUGIN: STANFORD", () => { }); }); }); + + describe("check options", () => { + before(() => { + args = { + data: { + x: "HPE", + columns: [ + ["HPE", 2.5, 2.5, 3.5, 3.5, 4, 4, 4.5, 5], + ["HPL", 24.5, 24, 67.5, 56.5, 26.5, 26, 30, 28] + ], + type: "scatter" + }, + plugins: [ + new Stanford({ + epochs: [ + 1, + 12, + 32, + 103, + 200, + 124, + 234, + 300 + ], + scale: { + min: 1, + max: 10000, + format: "pow10" + }, + padding: { + top: 15, + right: 0, + bottom: 0, + left: 0 + }, + regions: [ + { + points: [ + { + x: 0, + y: 0 + }, + { + x: 40, + y: 40 + }, + { + x: 0, + y: 40 + } + ], + text: function (value, percentage) { + return "Normal Operations: "+ value +" "+ percentage +"%"; + }, + opacity: 0.2, + class: "test-polygon1" + }, + { + points: [ + { + x: 0, + y: 0 + }, + { + x: 40, + y: 0 + }, + { + x: 40, + y: 40 + } + ], + text: function (value, percentage) { + return "MI: "+ value +" "+ percentage +"%"; + }, + opacity: 0.2, + class: "test-polygon2" + }, + { + points: [ + { + x: 40, + y: 0 + }, + { + x: 65, + y: 0 + }, + { + x: 65, + y: 40 + }, + { + x: 40, + y: 40 + } + ], + text: function (value, percentage) { + return "HMI: "+ value +" "+ percentage +"%"; + }, + opacity: 0.2, + class: "test-polygon3" + }, + { + points: [ + { + x: 0, + y: 40 + }, + { + x: 40, + y: 40 + }, + { + x: 65, + y: 65 + }, + { + x: 0, + y: 65 + } + ], + text: function (value, percentage) { + return "Unavailable Epochs: "+ value +" "+ percentage +"%"; + }, + opacity: 0.2, + class: "test-polygon4" + }, + { + points: [ + { + x: 40, + y: 40 + }, + { + x: 65, + y: 40 + }, + { + x: 65, + y: 65 + } + ], + text: function (value, percentage) { + return "MI: "+ value +" "+ percentage +"%"; + }, + opacity: 0.2, + class: "test-polygon5" + } + ], + lines: [ + { + x1: 0, + y1: 0, + x2: 65, + y2: 65, + class: "line" + }, + { + x1: 0, + x2: 65, + y1: 40, + y2: 40, + class: "line" + }, + { + x1: 40, + x2: 40, + y1: 0, + y2: 40, + class: "line" + } + ] + }), + ], + legend: { + show: false + }, + axis: { + x: { + label: { + text: "HPE", + position: "outer-center" + }, + min: 0, + max: 60, + padding: { + left: 0 + }, + tick: { + values: [ + 0, + 10, + 20, + 30, + 40, + 50, + 60 + ] + } + }, + y: { + label: { + text: "HPL", + position: "outer-middle" + }, + min: 0, + max: 60, + tick: { + values: [ + 0, + 10, + 20, + 30, + 40, + 50, + 60 + ] + }, + padding: { + top: 5, + bottom: 0 + } + } + }, + point: { + r: 1.5, + type: "rectangle" + } + }; + }); + + it("lines should be generated", () => { + const lines = chart.$.main.selectAll(".bb-stanford-lines line"); + + expect(lines.size()).to.be.equal(3); + }) + }); }); diff --git a/test/plugin/tableview/tableview-spec.ts b/test/plugin/tableview/tableview-spec.ts index d932f775b..c08c8ecb2 100644 --- a/test/plugin/tableview/tableview-spec.ts +++ b/test/plugin/tableview/tableview-spec.ts @@ -27,10 +27,6 @@ describe("PLUGIN: TABLE-VIEW", () => { chart = util.generate(args); }); - after(() => { - util.destroyAll(); - }); - describe("default style", () => { let spy; @@ -262,5 +258,11 @@ describe("PLUGIN: TABLE-VIEW", () => { expect(th.textContent).to.be.equal(dates[i]); }); }); + + it("when chart is destroyed, table also should destroyed.", () => { + chart.destroy(); + + expect(document.querySelector(".bb-tableview")).to.be.null; + }); }); });