fix(axis): left axis sizing based on title padding (#762)

* fix(axis): left axis sizing based on title padding * test: fix broken unit tests * test: update broken screenshots
elastic · Jul 23, 2020 · 3990589 · 3990589
1 parent 71b49f8
commit 3990589
Show file tree

Hide file tree

Showing 12 changed files with 3 additions and 3 deletions.
diff --git a/...s-area-chart-test-stacked-with-missing-values-visually-looks-correct-1-snap.png b/...s-area-chart-test-stacked-with-missing-values-visually-looks-correct-1-snap.png
diff --git a/...-tests-for-all-stories-area-chart-with-4-axes-visually-looks-correct-1-snap.png b/...-tests-for-all-stories-area-chart-with-4-axes-visually-looks-correct-1-snap.png
diff --git a/...all-stories-interactions-cursor-update-action-visually-looks-correct-1-snap.png b/...all-stories-interactions-cursor-update-action-visually-looks-correct-1-snap.png
diff --git a/...or-all-stories-interactions-png-export-action-visually-looks-correct-1-snap.png b/...or-all-stories-interactions-png-export-action-visually-looks-correct-1-snap.png
diff --git a/...-for-all-stories-scales-remove-duplicate-axis-visually-looks-correct-1-snap.png b/...-for-all-stories-scales-remove-duplicate-axis-visually-looks-correct-1-snap.png
diff --git a/...sts-for-all-stories-scales-specified-timezone-visually-looks-correct-1-snap.png b/...sts-for-all-stories-scales-specified-timezone-visually-looks-correct-1-snap.png
diff --git a/...for-all-stories-scales-timezone-configuration-visually-looks-correct-1-snap.png b/...for-all-stories-scales-timezone-configuration-visually-looks-correct-1-snap.png
diff --git a/...-all-stories-scales-tooltip-in-local-timezone-visually-looks-correct-1-snap.png b/...-all-stories-scales-tooltip-in-local-timezone-visually-looks-correct-1-snap.png
diff --git a/...l-tests-for-all-stories-scales-tooltip-in-utc-visually-looks-correct-1-snap.png b/...l-tests-for-all-stories-scales-tooltip-in-utc-visually-looks-correct-1-snap.png
diff --git a/.../interactions-test-ts-interactions-tooltip-sync-show-synced-tooltips-1-snap.png b/.../interactions-test-ts-interactions-tooltip-sync-show-synced-tooltips-1-snap.png
diff --git a/src/chart_types/xy_chart/utils/axis_utils.test.ts b/src/chart_types/xy_chart/utils/axis_utils.test.ts
@@ -938,7 +938,7 @@ describe('Axis computational utils', () => {
     expect(axisTicksPosition.axisPositions.get(verticalAxisSpecWTitle.id)).toEqual({
       top: 0,
       left: 10,
-      width: 18,
+      width: 10,
       height: 100,
     });
   });
@@ -1201,7 +1201,7 @@ describe('Axis computational utils', () => {
 
     const expectedPositionWithTopLegend = {
       height: 100,
-      width: 18,
+      width: 10,
       left: 100,
       top: 0,
     };

diff --git a/src/chart_types/xy_chart/utils/axis_utils.ts b/src/chart_types/xy_chart/utils/axis_utils.ts
@@ -616,7 +616,7 @@ export function getAxisPosition(
   showLabels: boolean,
 ) {
   const titlePadding = getSimplePadding(axisTitleStyle.padding);
-  const titleDimension = axisTitleStyle.visible ? titlePadding.inner + axisTitleHeight + titlePadding.outer : 0;
+  const titleDimension = axisTitleStyle.visible && axisTitleHeight > 0 ? titlePadding.inner + axisTitleHeight + titlePadding.outer : 0;
   const { position } = axisSpec;
   const { maxLabelBboxHeight, maxLabelBboxWidth } = axisDim;
   const { top, left, height, width } = chartDimensions;