From 0d68d1dcf19ca55f18bb2cfdb167db0c5d00bbc7 Mon Sep 17 00:00:00 2001
From: Kyle Doherty <kdoh@users.noreply.github.com>
Date: Mon, 24 Apr 2017 17:21:24 -0600
Subject: [PATCH] use proper viz settings key for goal tooltip (#4842)
* use proper viz settings key for goal tooltip
* add tests
---
.../visualizations/lib/LineAreaBarRenderer.js | 7 +--
.../lib/LineAreaBarRenderer.spec.js | 48 ++++++++++++++++++-
2 files changed, 50 insertions(+), 5 deletions(-)
diff --git a/frontend/src/metabase/visualizations/lib/LineAreaBarRenderer.js b/frontend/src/metabase/visualizations/lib/LineAreaBarRenderer.js
index e2e681c57aa..b5dc4bd92fb 100644
--- a/frontend/src/metabase/visualizations/lib/LineAreaBarRenderer.js
+++ b/frontend/src/metabase/visualizations/lib/LineAreaBarRenderer.js
@@ -1071,7 +1071,8 @@ export default function lineAreaBar(element, { series, onHoverChange, onVisualiz
let onGoalHover = () => {};
if (settings["graph.show_goal"]) {
- const goalData = [[xDomain[0], settings["graph.goal_value"]], [xDomain[1], settings["graph.goal_value"]]];
+ const goalValue = settings["graph.goal_value"];
+ const goalData = [[xDomain[0], goalValue], [xDomain[1], goalValue]];
const goalDimension = crossfilter(goalData).dimension(d => d[0]);
const goalGroup = goalDimension.group().reduceSum(d => d[1]);
const goalIndex = charts.length;
@@ -1088,8 +1089,8 @@ export default function lineAreaBar(element, { series, onHoverChange, onVisualiz
onGoalHover = (element) => {
onHoverChange(element && {
- element: element,
- data: [{ key: "Goal", value: settings["graph.goal"] }]
+ element,
+ data: [{ key: "Goal", value: goalValue }]
});
}
}
diff --git a/frontend/test/unit/visualizations/lib/LineAreaBarRenderer.spec.js b/frontend/test/unit/visualizations/lib/LineAreaBarRenderer.spec.js
index fe7c0ca2881..1da75bcb676 100644
--- a/frontend/test/unit/visualizations/lib/LineAreaBarRenderer.spec.js
+++ b/frontend/test/unit/visualizations/lib/LineAreaBarRenderer.spec.js
@@ -180,6 +180,49 @@ describe("LineAreaBarRenderer", () => {
});
})
+ describe('goals', () => {
+ it('should render a goal line', () => {
+ let rows = [
+ ["2016", 1],
+ ["2017", 2],
+ ];
+
+ renderTimeseriesLine({
+ rowsOfSeries: [rows],
+ settings: {
+ "graph.show_goal": true,
+ "graph.goal_value": 30
+ }
+ })
+
+ expect(qs('svg .goal .line')).not.toBe(null)
+ expect(qs('svg .goal text')).not.toBe(null)
+ expect(qs('svg .goal text').textContent).toEqual('Goal')
+ })
+
+ it('should render a goal tooltip with the proper value', (done) => {
+ let rows = [
+ ["2016", 1],
+ ["2017", 2],
+ ];
+
+ const goalValue = 30
+ renderTimeseriesLine({
+ rowsOfSeries: [rows],
+ settings: {
+ "graph.show_goal": true,
+ "graph.goal_value": goalValue
+ },
+ onHoverChange: (hover) => {
+ expect(hover.data[0].value).toEqual(goalValue)
+ done();
+ }
+ })
+ dispatchUIEvent(qs("svg .goal text"), "mouseenter");
+ })
+
+ })
+
// querySelector shortcut
const qs = (selector) => element.querySelector(selector);
@@ -187,7 +230,7 @@ describe("LineAreaBarRenderer", () => {
const qsa = (selector) => [...element.querySelectorAll(selector)];
// helper for timeseries line charts
- const renderTimeseriesLine = ({ rowsOfSeries, onHoverChange, unit }) => {
+ const renderTimeseriesLine = ({ rowsOfSeries, onHoverChange, unit, settings }) => {
lineAreaBarRenderer(element, {
chartType: "line",
series: rowsOfSeries.map((rows) => ({
@@ -199,7 +242,8 @@ describe("LineAreaBarRenderer", () => {
settings: {
"graph.x_axis.scale": "timeseries",
"graph.x_axis.axis_enabled": true,
- "graph.colors": ["#000000"]
+ "graph.colors": ["#000000"],
+ ...settings,
},
onHoverChange
});
--
GitLab