// (C) 2020 GoodData Corporation import { ISeparators } from "@gooddata/numberjs"; import { getTooltipHtml, shouldShowTooltip } from "../geoChartTooltip"; import { TOOLTIP_MAX_WIDTH } from "../../../visualizations/chart/tooltip"; describe("geoChartTooltip", () => { describe("getTooltipHtml", () => { it("should show tooltip html", () => { const geoProperties: GeoJSON.GeoJsonProperties = { locationName: { title: "State", value: "Florida", }, size: { title: "Population", value: 111, format: "#,##0.00", }, color: { title: "Area", value: 222, format: "#,##0.00", }, segment: { title: "Age", value: "20-30", }, }; const tooltipHtml = getTooltipHtml(geoProperties, "rgb(0,0,0)", TOOLTIP_MAX_WIDTH); expect(tooltipHtml).toBe(`
State
Florida
Population
111.00
Area
222.00
Age
20-30
`); }); it("should show tooltip html with empty and null value", () => { const geoProperties: GeoJSON.GeoJsonProperties = { locationName: { title: "State", value: "", }, size: { title: "Population", value: NaN, format: "#,##0.00", }, color: { title: "Area", value: null, format: "#,##0.00", }, }; const tooltipHtml = getTooltipHtml(geoProperties, "rgb(0,0,0)", TOOLTIP_MAX_WIDTH); expect(tooltipHtml).toBe(`
State
-
Population
-
Area
-
`); }); it("should return escaped tooltip html", () => { const geoProperties: GeoJSON.GeoJsonProperties = { locationName: { title: "", value: "Florida", }, color: { title: "population [Sum]", value: 105555562.33, format: "#,##0.00", }, size: { title: '', value: 111, format: "[>=24][red]#,##0.00R", }, }; const separators: ISeparators = { decimal: ",", thousand: "'", }; const tooltipHtml = getTooltipHtml(geoProperties, "rgb(0,0,0)", TOOLTIP_MAX_WIDTH, separators); expect(tooltipHtml).toBe(`
<button>State</button>
<span>Florida</span>
<script>alert("Population")</script>
'111,00R
population [Sum]
'105'555'562,33
`); }); }); describe("shouldShowTooltip", () => { it("should not show tooltip", () => { expect(shouldShowTooltip(undefined)).toBe(false); }); it("should not show tooltip with empty geo props", () => { expect(shouldShowTooltip({})).toBe(false); }); it("should show tooltip with location text ", () => { const geoProperties: GeoJSON.GeoJsonProperties = { locationName: { title: "State", value: "Florida", }, }; expect(shouldShowTooltip(geoProperties)).toBe(true); }); it("should show tooltip with size and color measures", () => { const geoProperties: GeoJSON.GeoJsonProperties = { size: { title: "Population", value: 111, }, color: { title: "Age", value: 222, }, }; expect(shouldShowTooltip(geoProperties)).toBe(true); }); }); });