fix(xy): consider useDefaultGroupDomain on scale config (#1119)

The #1087 PR introduced a regression where the useDefaultGroupDomain was not considered when
computing the scale configs.

Author: markov00

integration/tests/__image_snapshots__/all-test-ts-baseline-visual-tests-for-all-stories-bar-chart-test-use-default-group-domain-visually-looks-correct-1-snap.png

@@ -0,0 +1,94 @@
+/*
+ * Licensed to Elasticsearch B.V. under one or more contributor
+ * license agreements. See the NOTICE file distributed with
+ * this work for additional information regarding copyright
+ * ownership. Elasticsearch B.V. licenses this file to you under
+ * the Apache License, Version 2.0 (the "License"); you may
+ * not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied.  See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+
+import { MockGlobalSpec, MockSeriesSpec } from '../../../../mocks/specs/specs';
+import { MockStore } from '../../../../mocks/store/store';
+import { DEFAULT_GLOBAL_ID } from '../../utils/specs';
+import { computeSeriesGeometriesSelector } from './compute_series_geometries';
+import { getScaleConfigsFromSpecsSelector } from './get_api_scale_configs';
+
+describe('GroupIds and useDefaultGroupId', () => {
+  it('use the specified useDefaultGroupId to compute scale configs', () => {
+    const store = MockStore.default();
+    MockStore.addSpecs(
+      [
+        MockSeriesSpec.bar({
+          groupId: 'other',
+          useDefaultGroupDomain: 'a different one',
+        }),
+      ],
+      store,
+    );
+    const scaleConfigs = getScaleConfigsFromSpecsSelector(store.getState());
+    expect(scaleConfigs.y['a different one']).toBeDefined();
+  });
+
+  it('have 2 different y domains with 2 groups', () => {
+    const store = MockStore.default();
+    MockStore.addSpecs(
+      [
+        MockSeriesSpec.bar({ id: 'one' }),
+        MockSeriesSpec.bar({
+          id: 'two',
+          groupId: 'other',
+          useDefaultGroupDomain: 'a different one',
+        }),
+      ],
+      store,
+    );
+    const scaleConfigs = getScaleConfigsFromSpecsSelector(store.getState());
+    expect(Object.keys(scaleConfigs.y)).toHaveLength(2);
+    expect(scaleConfigs.y['a different one']).toBeDefined();
+    expect(scaleConfigs.y[DEFAULT_GLOBAL_ID]).toBeDefined();
+  });
+
+  it('have 2 different y domains with 3 groups', () => {
+    const store = MockStore.default({ width: 120, height: 100, left: 0, top: 0 });
+    MockStore.addSpecs(
+      [
+        MockGlobalSpec.settingsNoMargins(),
+        MockSeriesSpec.bar({ id: 'one', data: [{ x: 1, y: 10 }] }),
+        MockSeriesSpec.bar({
+          id: 'two',
+          groupId: 'other',
+          useDefaultGroupDomain: 'a different one',
+          data: [{ x: 1, y: 10 }],
+        }),
+        MockSeriesSpec.bar({
+          id: 'three',
+          groupId: 'another again',
+          useDefaultGroupDomain: 'a different one',
+          data: [{ x: 1, y: 10 }],
+        }),
+      ],
+      store,
+    );
+    const scaleConfigs = getScaleConfigsFromSpecsSelector(store.getState());
+    expect(Object.keys(scaleConfigs.y)).toHaveLength(2);
+    expect(scaleConfigs.y['a different one']).toBeDefined();
+    expect(scaleConfigs.y[DEFAULT_GLOBAL_ID]).toBeDefined();
+
+    const geoms = computeSeriesGeometriesSelector(store.getState());
+    const { bars } = geoms.geometries;
+    expect(bars).toHaveLength(3);
+    expect(bars[0].value[0].width).toBe(40);
+    expect(bars[1].value[0].width).toBe(40);
+    expect(bars[2].value[0].width).toBe(40);
+  });
+});

src/chart_types/xy_chart/state/selectors/get_api_scale_configs.test.ts

@@ -33,6 +33,7 @@ import { isHorizontalAxis, isVerticalAxis } from '../../utils/axis_type_utils';
 import { groupBy } from '../../utils/group_data_series';
 import { AxisSpec, BasicSeriesSpec, CustomXDomain, XScaleType, YDomainRange } from '../../utils/specs';
 import { isHorizontalRotation } from '../utils/common';
+import { getSpecDomainGroupId } from '../utils/spec';
 import { getAxisSpecsSelector, getSeriesSpecsSelector } from './get_specs';
 import { mergeYCustomDomainsByGroupId } from './merge_y_custom_domains';
 
@@ -83,14 +84,15 @@ export function getScaleConfigsFromSpecs(
   };
 
   // y axes
-  const scaleConfigsByGroupId = groupBy(seriesSpecs, ['groupId'], true).reduce<
+  const scaleConfigsByGroupId = groupBy(seriesSpecs, getSpecDomainGroupId, true).reduce<
     Record<GroupId, { nice: boolean; type: ScaleContinuousType }>
   >((acc, series) => {
     const yScaleTypes = series.map(({ yScaleType, yNice }) => ({
       nice: getYNiceFromSpec(yNice),
       type: getYScaleTypeFromSpec(yScaleType),
     }));
-    acc[series[0].groupId] = coerceYScaleTypes(yScaleTypes);
+    const groupId = getSpecDomainGroupId(series[0]);
+    acc[groupId] = coerceYScaleTypes(yScaleTypes);
     return acc;
   }, {});
 

src/chart_types/xy_chart/state/selectors/get_api_scale_configs.ts

@@ -0,0 +1,52 @@
+/*
+ * Licensed to Elasticsearch B.V. under one or more contributor
+ * license agreements. See the NOTICE file distributed with
+ * this work for additional information regarding copyright
+ * ownership. Elasticsearch B.V. licenses this file to you under
+ * the Apache License, Version 2.0 (the "License"); you may
+ * not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied.  See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+
+import React from 'react';
+
+import { Axis, BarSeries, Chart, Position, ScaleType } from '../../src';
+
+export const Example = () => {
+  return (
+    <Chart className="story-chart">
+      <Axis id="bottom" position={Position.Bottom} />
+      <Axis id="right" groupId="mainGroup" position={Position.Left} ticks={5} />
+
+      <BarSeries
+        id="groupB"
+        groupId="other"
+        useDefaultGroupDomain="mainGroup"
+        xScaleType={ScaleType.Ordinal}
+        yScaleType={ScaleType.Linear}
+        yNice
+        xAccessor="x"
+        yAccessors={['y']}
+        splitSeriesAccessors={['g']}
+        stackAccessors={['g']}
+        data={[
+          { x: 'A', y: 10, g: 'ga' },
+          { x: 'A', y: 10, g: 'gb' },
+          { x: 'A', y: 10, g: 'gc' },
+          { x: 'B', y: 10, g: 'ga' },
+          { x: 'B', y: 10, g: 'gb' },
+          { x: 'B', y: 10, g: 'gc' },
+        ]}
+      />
+    </Chart>
+  );
+};

stories/bar/56_test_use_dfl_gdomain.tsx

@@ -85,3 +85,4 @@ export { Example as testMinHeightPositiveAndNegativeValues } from './46_test_min
 export { Example as testTooltipAndRotation } from './48_test_tooltip';
 export { Example as tooltipBoundary } from './55_tooltip_boundary';
 export { Example as testDualYAxis } from './49_test_dual_axis';
+export { Example as testUseDefaultGroupDomain } from './56_test_use_dfl_gdomain';