diff --git a/frontend/src/metabase/visualizations/lib/settings/graph.js b/frontend/src/metabase/visualizations/lib/settings/graph.js index 525f189af75a852aeffdf378d26de763e51dd161..9849eef475c4057368f2b6752998765517e88296 100644 --- a/frontend/src/metabase/visualizations/lib/settings/graph.js +++ b/frontend/src/metabase/visualizations/lib/settings/graph.js @@ -286,10 +286,10 @@ export const STACKABLE_SETTINGS = { isValid: (series, settings) => { if (settings["stackable.stack_type"] != null) { const displays = series.map(single => settings.series(single).display); - const hasStackable = _.any(displays, display => + const stackableDisplays = displays.filter(display => STACKABLE_DISPLAY_TYPES.has(display), ); - return hasStackable; + return stackableDisplays.length > 1; } return true; }, @@ -301,7 +301,10 @@ export const STACKABLE_SETTINGS = { : null, getHidden: (series, settings) => { const displays = series.map(single => settings.series(single).display); - return !_.any(displays, display => STACKABLE_DISPLAY_TYPES.has(display)); + const stackableDisplays = displays.filter(display => + STACKABLE_DISPLAY_TYPES.has(display), + ); + return stackableDisplays.length <= 1; }, readDependencies: ["graph.metrics", "series"], }, diff --git a/frontend/test/metabase/visualizations/components/LineAreaBarRenderer-bar.unit.spec.js b/frontend/test/metabase/visualizations/components/LineAreaBarRenderer-bar.unit.spec.js index d6710390a5aa27f0d4ede3c8384882ad32ea26d5..f4001ec630f9767144115b65414f22c8ff138e4f 100644 --- a/frontend/test/metabase/visualizations/components/LineAreaBarRenderer-bar.unit.spec.js +++ b/frontend/test/metabase/visualizations/components/LineAreaBarRenderer-bar.unit.spec.js @@ -206,29 +206,6 @@ describe("LineAreaBarRenderer-bar", () => { expect(values).toEqual(["0.1%", "99.9%"]); }); - it(`should render an bar normalized chart with just one series`, () => { - const onHoverChange = jest.fn(); - renderLineAreaBar( - element, - [ - MainSeries( - "bar", - { "stackable.stack_type": "normalized" }, - { value: 3 }, - ), - ], - { onHoverChange }, - ); - - dispatchUIEvent(qsa(".bar, .dot")[0], "mousemove"); - - const { calls } = onHoverChange.mock; - expect(getDataKeyValues(calls[0][0])).toEqual([ - { key: "Category", value: "A" }, - { key: "% Sum", value: "100%" }, - ]); - }); - it("should replace the aggregation name with the series name", () => { const onHoverChange = jest.fn(); renderLineAreaBar( diff --git a/frontend/test/metabase/visualizations/components/settings/ChartSettingStacked.unit.spec.js b/frontend/test/metabase/visualizations/components/settings/ChartSettingStacked.unit.spec.js new file mode 100644 index 0000000000000000000000000000000000000000..4717c4a56710ea8c7256a068a31a97bf85000c9f --- /dev/null +++ b/frontend/test/metabase/visualizations/components/settings/ChartSettingStacked.unit.spec.js @@ -0,0 +1,110 @@ +import React from "react"; +import { renderWithProviders } from "__support__/ui"; + +// these tests use ChartSettings directly, but logic we're testing lives in ChartNestedSettingSeries +import ChartSettings from "metabase/visualizations/components/ChartSettings"; + +function getSeries(metrics) { + return [ + { + card: { + dataset_query: { + type: "native", + native: { + query: + "select 'dogs' as pets, 50 as male, 45 as female union all select 'cats', 45, 20", + "template-tags": {}, + }, + database: 1, + }, + display: "bar", + displayIsLocked: true, + parameters: [], + visualization_settings: { + "graph.dimensions": ["PETS"], + "graph.metrics": metrics, + }, + }, + data: { + rows: [ + ["dogs", 50, 45], + ["cats", 45, 20], + ], + cols: [ + { + display_name: "PETS", + source: "native", + field_ref: [ + "field", + "PETS", + { + "base-type": "type/Text", + }, + ], + name: "PETS", + base_type: "type/Text", + effective_type: "type/Text", + }, + { + display_name: "MALE", + source: "native", + field_ref: [ + "field", + "MALE", + { + "base-type": "type/Integer", + }, + ], + name: "MALE", + base_type: "type/Integer", + effective_type: "type/Integer", + }, + { + display_name: "FEMALE", + source: "native", + field_ref: [ + "field", + "FEMALE", + { + "base-type": "type/Integer", + }, + ], + name: "FEMALE", + base_type: "type/Integer", + effective_type: "type/Integer", + }, + ], + }, + }, + ]; +} + +const setup = seriesMetrics => { + return renderWithProviders( + <ChartSettings + series={getSeries(seriesMetrics)} + initial={{ section: "Display" }} + />, + { + withSettings: true, + withEmbedSettings: true, + }, + ); +}; + +describe("ChartSettingsStacked", () => { + it("should not show stacking options when there is only 1 series", () => { + const { queryByText } = setup(["MALE"]); + + expect(queryByText(/Stacking/)).not.toBeInTheDocument(); + }); + + it("should show stacking options when there is more than 1 series", () => { + const { queryByText, queryByLabelText } = setup(["MALE", "FEMALE"]); + + expect(queryByText(/Stacking/)).toBeInTheDocument(); + expect(queryByLabelText("Don't stack")).toBeInTheDocument(); + expect(queryByLabelText("Stack")).toBeInTheDocument(); + expect(queryByLabelText("Stack - 100%")).toBeInTheDocument(); + }); +});