fix: incorrect :invalid state in shadow DOM

Uncovered a bug where empty `pattern`, `min`, `max` and `autocomplete` were included in the shadow DOM.
nl-design-system · Sep 8, 2021 · 8f00377 · 8f00377
1 parent 91e5dbd
commit 8f00377
Show file tree

Hide file tree

Showing 2 changed files with 8 additions and 8 deletions.
diff --git a/components/form-field-textbox/stencil.tsx b/components/form-field-textbox/stencil.tsx
@@ -43,11 +43,11 @@ export class FormFieldTextbox {
             readOnly && "utrecht-textbox--readonly"
           )}
           type={type || "text"}
-          autoComplete={autoComplete}
+          autoComplete={autoComplete ? autoComplete : null}
           disabled={disabled}
-          min={min}
-          max={max}
-          pattern={pattern}
+          min={min ? min : null}
+          max={max ? max : null}
+          pattern={pattern ? pattern : null}
           placeholder={placeholder || null}
           readonly={readOnly}
           required={required}

diff --git a/components/textbox/stencil.tsx b/components/textbox/stencil.tsx
@@ -41,11 +41,11 @@ export class Textbox {
           readOnly && "utrecht-textbox--readonly"
         )}
         type={type || "text"}
-        autoComplete={autoComplete}
+        autoComplete={autoComplete ? autoComplete : null}
         disabled={disabled}
-        min={min}
-        max={max}
-        pattern={pattern}
+        min={min ? min : null}
+        max={max ? max : null}
+        pattern={pattern ? pattern : null}
         placeholder={placeholder || null}
         readonly={readOnly}
         required={required}