jsdom workaround

- NOTE: EuiDualRange snapshots will just be slightly incorrect until we're on jsdom 15+ 🤷
elastic · Oct 26, 2023 · e588aa3 · e588aa3
1 parent cd3a9e2
commit e588aa3
Show file tree

Hide file tree

Showing 3 changed files with 55 additions and 7 deletions.
diff --git a/src/components/form/field_number/__snapshots__/field_number.test.tsx.snap b/src/components/form/field_number/__snapshots__/field_number.test.tsx.snap
@@ -17,7 +17,7 @@ exports[`EuiFieldNumber is rendered 1`] = `
       max="8"
       min="1"
       name="elastic"
-      step="1"
+      step="any"
       type="number"
       value="1"
     />

diff --git a/src/components/form/field_number/field_number.test.tsx b/src/components/form/field_number/field_number.test.tsx
@@ -32,7 +32,10 @@ describe('EuiFieldNumber', () => {
         name="elastic"
         min={1}
         max={8}
-        step={1}
+        // TODO: Restore this once we upgrade Jest/jsdom to v15+. Right now passing
+        // a `step` prop always leads to jsdom thinking that validity.valid is false
+        // @see https://github.com/jsdom/jsdom/issues/2288
+        // step={1}
         value={1}
         icon="warning"
         onChange={() => {}}

diff --git a/src/components/form/range/__snapshots__/dual_range.test.tsx.snap b/src/components/form/range/__snapshots__/dual_range.test.tsx.snap
@@ -224,7 +224,8 @@ exports[`EuiDualRange props maxInputProps allows overriding default props 1`] =
       class="euiFormControlLayout__childrenWrapper"
     >
       <input
-        class="euiFieldNumber euiRangeInput euiRangeInput--max emotion-euiRangeInput"
+        aria-invalid="true"
+        class="euiFieldNumber euiRangeInput euiRangeInput--max emotion-euiRangeInput euiFormControlLayout--1icons"
         max="100"
         min="1"
         name="undefined-maxValue"
@@ -233,6 +234,14 @@ exports[`EuiDualRange props maxInputProps allows overriding default props 1`] =
         type="number"
         value="123"
       />
+      <div
+        class="euiFormControlLayoutIcons euiFormControlLayoutIcons--right euiFormControlLayoutIcons--absolute"
+      >
+        <span
+          color="danger"
+          data-euiicon-type="warning"
+        />
+      </div>
     </div>
   </div>
 </div>
@@ -318,8 +327,9 @@ exports[`EuiDualRange props maxInputProps applies passed props to max input 1`]
       class="euiFormControlLayout__childrenWrapper"
     >
       <input
+        aria-invalid="true"
         aria-label="Max value"
-        class="euiFieldNumber euiRangeInput euiRangeInput--max emotion-euiRangeInput"
+        class="euiFieldNumber euiRangeInput euiRangeInput--max emotion-euiRangeInput euiFormControlLayout--1icons"
         max="100"
         min="1"
         name="undefined-maxValue"
@@ -328,6 +338,14 @@ exports[`EuiDualRange props maxInputProps applies passed props to max input 1`]
         type="number"
         value="8"
       />
+      <div
+        class="euiFormControlLayoutIcons euiFormControlLayoutIcons--right euiFormControlLayoutIcons--absolute"
+      >
+        <span
+          color="danger"
+          data-euiicon-type="warning"
+        />
+      </div>
     </div>
   </div>
 </div>
@@ -344,7 +362,8 @@ exports[`EuiDualRange props minInputProps allows overriding default props 1`] =
       class="euiFormControlLayout__childrenWrapper"
     >
       <input
-        class="euiFieldNumber euiRangeInput euiRangeInput--min emotion-euiRangeInput"
+        aria-invalid="true"
+        class="euiFieldNumber euiRangeInput euiRangeInput--min emotion-euiRangeInput euiFormControlLayout--1icons"
         max="8"
         min="0"
         name="undefined-minValue"
@@ -353,6 +372,14 @@ exports[`EuiDualRange props minInputProps allows overriding default props 1`] =
         type="number"
         value="123"
       />
+      <div
+        class="euiFormControlLayoutIcons euiFormControlLayoutIcons--right euiFormControlLayoutIcons--absolute"
+      >
+        <span
+          color="danger"
+          data-euiicon-type="warning"
+        />
+      </div>
     </div>
   </div>
   <div
@@ -413,7 +440,8 @@ exports[`EuiDualRange props minInputProps allows overriding default props 1`] =
       class="euiFormControlLayout__childrenWrapper"
     >
       <input
-        class="euiFieldNumber euiRangeInput euiRangeInput--max emotion-euiRangeInput"
+        aria-invalid="true"
+        class="euiFieldNumber euiRangeInput euiRangeInput--max emotion-euiRangeInput euiFormControlLayout--1icons"
         max="100"
         min="1"
         name="undefined-maxValue"
@@ -422,6 +450,14 @@ exports[`EuiDualRange props minInputProps allows overriding default props 1`] =
         type="number"
         value="8"
       />
+      <div
+        class="euiFormControlLayoutIcons euiFormControlLayoutIcons--right euiFormControlLayoutIcons--absolute"
+      >
+        <span
+          color="danger"
+          data-euiicon-type="warning"
+        />
+      </div>
     </div>
   </div>
 </div>
@@ -508,7 +544,8 @@ exports[`EuiDualRange props minInputProps applies passed props to min input 1`]
       class="euiFormControlLayout__childrenWrapper"
     >
       <input
-        class="euiFieldNumber euiRangeInput euiRangeInput--max emotion-euiRangeInput"
+        aria-invalid="true"
+        class="euiFieldNumber euiRangeInput euiRangeInput--max emotion-euiRangeInput euiFormControlLayout--1icons"
         max="100"
         min="1"
         name="undefined-maxValue"
@@ -517,6 +554,14 @@ exports[`EuiDualRange props minInputProps applies passed props to min input 1`]
         type="number"
         value="8"
       />
+      <div
+        class="euiFormControlLayoutIcons euiFormControlLayoutIcons--right euiFormControlLayoutIcons--absolute"
+      >
+        <span
+          color="danger"
+          data-euiicon-type="warning"
+        />
+      </div>
     </div>
   </div>
 </div>