[Lens] Fix Metric visualization scale (elastic#113956)

* 🐛 Fix metric rescale * 📸 Restored old snapshots * 🐛 Extend the fix to all scenarios * 📸 Refresh snapshots for new fix Co-authored-by: Kibana Machine <42973632+kibanamachine@users.noreply.github.com>
stephmilovic · Oct 12, 2021 · fa69602 · fa69602
1 parent 435404e
commit fa69602
Show file tree

Hide file tree

Showing 2 changed files with 16 additions and 6 deletions.
diff --git a/x-pack/plugins/lens/public/metric_visualization/expression.test.tsx b/x-pack/plugins/lens/public/metric_visualization/expression.test.tsx
@@ -90,7 +90,9 @@ describe('metric_expression', () => {
           reportDescription="Fancy chart description"
           reportTitle="My fanci metric chart"
         >
-          <AutoScale>
+          <AutoScale
+            key="3"
+          >
             <div
               data-test-subj="lns_metric_value"
               style={
@@ -135,7 +137,9 @@ describe('metric_expression', () => {
           reportDescription="Fancy chart description"
           reportTitle="My fanci metric chart"
         >
-          <AutoScale>
+          <AutoScale
+            key="last"
+          >
             <div
               data-test-subj="lns_metric_value"
               style={
@@ -179,7 +183,9 @@ describe('metric_expression', () => {
           reportDescription=""
           reportTitle=""
         >
-          <AutoScale>
+          <AutoScale
+            key="3"
+          >
             <div
               data-test-subj="lns_metric_value"
               style={
@@ -223,7 +229,9 @@ describe('metric_expression', () => {
           reportDescription=""
           reportTitle=""
         >
-          <AutoScale>
+          <AutoScale
+            key="3"
+          >
             <div
               data-test-subj="lns_metric_value"
               style={
@@ -309,7 +317,9 @@ describe('metric_expression', () => {
           reportDescription=""
           reportTitle=""
         >
-          <AutoScale>
+          <AutoScale
+            key="0"
+          >
             <div
               data-test-subj="lns_metric_value"
               style={

diff --git a/x-pack/plugins/lens/public/metric_visualization/expression.tsx b/x-pack/plugins/lens/public/metric_visualization/expression.tsx
@@ -89,7 +89,7 @@ export function MetricChart({
       reportDescription={description}
       className="lnsMetricExpression__container"
     >
-      <AutoScale>
+      <AutoScale key={value}>
         <div data-test-subj="lns_metric_value" style={{ fontSize: '60pt', fontWeight: 600 }}>
           {value}
         </div>