chore: add extra check for error message

textkernel · Sep 4, 2024 · c5f23ff · c5f23ff
1 parent 8323db4
commit c5f23ff
Show file tree

Hide file tree

Showing 3 changed files with 5 additions and 66 deletions.
diff --git a/src/components/FieldWithValidation/__tests__/__snapshots__/FieldWithValidation.spec.tsx.snap b/src/components/FieldWithValidation/__tests__/__snapshots__/FieldWithValidation.spec.tsx.snap
@@ -30,17 +30,6 @@ exports[`FieldWithValidation when using tooltip when error message is defined sh
     type="text"
     value=""
   />
-  <div
-    class="Input__errorMessageWrapper"
-  >
-    <test-file-stub
-      classname="Input__icon"
-      viewbox="0 0 24 24"
-    />
-    <p
-      class="Input__errorMessage"
-    />
-  </div>
   <p
     class="Text--context_critical Text--size_small FieldWithValidation"
   >
@@ -63,17 +52,6 @@ exports[`FieldWithValidation when using tooltip when error message is defined sh
     type="text"
     value=""
   />
-  <div
-    class="Input__errorMessageWrapper"
-  >
-    <test-file-stub
-      classname="Input__icon"
-      viewbox="0 0 24 24"
-    />
-    <p
-      class="Input__errorMessage"
-    />
-  </div>
   <p
     class="Text--context_critical Text--size_small FieldWithValidation"
   >
@@ -96,17 +74,6 @@ exports[`FieldWithValidation when using tooltip when error message is defined sh
     type="text"
     value=""
   />
-  <div
-    class="Input__errorMessageWrapper"
-  >
-    <test-file-stub
-      classname="Input__icon"
-      viewbox="0 0 24 24"
-    />
-    <p
-      class="Input__errorMessage"
-    />
-  </div>
   <p
     class="Text--context_critical Text--size_small FieldWithValidation"
   >
@@ -145,17 +112,6 @@ exports[`FieldWithValidation with error message passed should render the message
     type="text"
     value=""
   />
-  <div
-    class="Input__errorMessageWrapper"
-  >
-    <test-file-stub
-      classname="Input__icon"
-      viewbox="0 0 24 24"
-    />
-    <p
-      class="Input__errorMessage"
-    />
-  </div>
   <p
     class="Text--context_critical Text--size_small FieldWithValidation"
   >
@@ -178,17 +134,6 @@ exports[`FieldWithValidation with error message passed should set context to bad
     type="text"
     value=""
   />
-  <div
-    class="Input__errorMessageWrapper"
-  >
-    <test-file-stub
-      classname="Input__icon"
-      viewbox="0 0 24 24"
-    />
-    <p
-      class="Input__errorMessage"
-    />
-  </div>
   <p
     class="Text--context_critical Text--size_small FieldWithValidation"
   >

diff --git a/src/components/Input/Input.tsx b/src/components/Input/Input.tsx
@@ -85,7 +85,7 @@ export const Input = React.forwardRef<HTMLInputElement, Props>(
                     aria-invalid={context === 'critical' ? 'true' : undefined}
                     data-lpignore={isLastPassDisabled}
                 />
-                {context === 'critical' ? (
+                {context === 'critical' && errorMessage ? (
                     <div {...elem('errorMessageWrapper')}>
                         <Error viewBox="0 0 24 24" {...elem('icon')} />
                         <p {...elem('errorMessage', { context })}>{errorMessage}</p>

diff --git a/src/components/Input/__tests__/__snapshots__/Input.spec.tsx.snap b/src/components/Input/__tests__/__snapshots__/Input.spec.tsx.snap
@@ -17,17 +17,11 @@ exports[`<Input> that renders an input field should add classes when props are c
     type="text"
     value=""
   />
-  <div
-    class="Input__errorMessageWrapper"
+  <p
+    class="Input__helperText"
   >
-    <test-file-stub
-      classname="Input__icon"
-      viewbox="0 0 24 24"
-    />
-    <p
-      class="Input__errorMessage"
-    />
-  </div>
+    This is a helper text
+  </p>
 </div>
 `;