diff --git a/package.json b/package.json index 3769e8957..a257d829a 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "@netdata/charts", - "version": "6.12.11", + "version": "6.12.12", "description": "Netdata frontend SDK and chart utilities", "main": "dist/index.js", "module": "dist/es6/index.js", diff --git a/src/components/hocs/withTile.js b/src/components/hocs/withTile.js index 22ab6641b..2cf8948f7 100644 --- a/src/components/hocs/withTile.js +++ b/src/components/hocs/withTile.js @@ -43,7 +43,7 @@ export const Title = () => { const chart = useChart() const title = useTitle() const units = useUnitSign({ withoutConversion: true, long: true }) - const hideUnits = useAttributeValue("hideUnits") + const hideUnits = useAttributeValue("hideUnits") ?? true const isMinimal = useIsMinimal() const onClick = event => { diff --git a/src/components/hocs/withTile.test.js b/src/components/hocs/withTile.test.js index 7144bca91..6e18081b4 100644 --- a/src/components/hocs/withTile.test.js +++ b/src/components/hocs/withTile.test.js @@ -4,21 +4,41 @@ import "@testing-library/jest-dom" import { makeHeatmapPayload, renderWithChart } from "@jest/testUtilities" import { Title } from "./withTile" +const renderTitle = async hideUnits => { + const { chart } = renderWithChart(
) + const payload = makeHeatmapPayload(["storage"], [[1024]]) + payload.view.title = "Storage change" + payload.view.chart_type = "number" + payload.view.units = "KiB" + payload.view.dimensions.units = ["KiB"] + + chart.doneFetch(payload) + await new Promise(resolve => setTimeout(resolve, 0)) + + if (hideUnits !== undefined) chart.updateAttribute("hideUnits", hideUnits) + + renderWithChart(, { chart }) +} + describe("tile title", () => { - it("shows the normalized source unit", async () => { - const { chart } = renderWithChart(<div />) - const payload = makeHeatmapPayload(["storage"], [[1024]]) - payload.view.title = "Storage change" - payload.view.chart_type = "number" - payload.view.units = "KiB" - payload.view.dimensions.units = ["KiB"] + it("hides the source unit by default, leaving the full width to the title", async () => { + await renderTitle() - chart.doneFetch(payload) - await new Promise(resolve => setTimeout(resolve, 0)) + expect(screen.getByText("Storage change")).toBeInTheDocument() + expect(screen.queryByText("• [bytes]")).not.toBeInTheDocument() + }) - renderWithChart(<Title />, { chart }) + it("shows the source unit when hideUnits is explicitly false", async () => { + await renderTitle(false) expect(screen.getByText("Storage change")).toBeInTheDocument() expect(screen.getByText("• [bytes]")).toBeInTheDocument() }) + + it("hides the source unit when hideUnits is explicitly true", async () => { + await renderTitle(true) + + expect(screen.getByText("Storage change")).toBeInTheDocument() + expect(screen.queryByText("• [bytes]")).not.toBeInTheDocument() + }) }) diff --git a/src/sdk/initialAttributes.js b/src/sdk/initialAttributes.js index e65e1038d..9c50693d0 100644 --- a/src/sdk/initialAttributes.js +++ b/src/sdk/initialAttributes.js @@ -143,7 +143,7 @@ export default { hasToolbox: true, hideTitle: false, hideName: false, - hideUnits: false, + hideUnits: null, hasHoverPopover: true, expandable: true, showAnnotations: true,