fix: 🐛 set selected attribute on option to draw it (#280)

bubkoo · Aug 10, 2022 · caf97c8 · caf97c8
1 parent ff6f73f
commit caf97c8
Showing 1 changed file with 14 additions and 0 deletions.
diff --git a/src/cloneNode.ts b/src/cloneNode.ts
@@ -101,6 +101,19 @@ function cloneInputValue<T extends HTMLElement>(nativeNode: T, clonedNode: T) {
   }
 }
 
+function cloneSelectValue<T extends HTMLElement>(nativeNode: T, clonedNode: T) {
+  if (nativeNode instanceof HTMLSelectElement) {
+    const clonedSelect = clonedNode as any as HTMLSelectElement
+    const selectedOption = Array.from(clonedSelect.children).find(
+      (child) => nativeNode.value === child.getAttribute('value'),
+    )
+
+    if (selectedOption) {
+      selectedOption.setAttribute('selected', '')
+    }
+  }
+}
+
 async function decorate<T extends HTMLElement>(
   nativeNode: T,
   clonedNode: T,
@@ -113,6 +126,7 @@ async function decorate<T extends HTMLElement>(
     .then(() => cloneCSSStyle(nativeNode, clonedNode))
     .then(() => clonePseudoElements(nativeNode, clonedNode))
     .then(() => cloneInputValue(nativeNode, clonedNode))
+    .then(() => cloneSelectValue(nativeNode, clonedNode))
     .then(() => clonedNode)
 }