Merge branch 'master' into breaking

packages/web/src/dom.rs

@@ -25,6 +25,8 @@ pub struct WebsysDom {
     pub(crate) interpreter: Channel,
     #[cfg(feature = "mounted")]
     pub(crate) event_channel: mpsc::UnboundedSender<UiEvent>,
+    #[cfg(feature = "mounted")]
+    pub(crate) queued_mounted_events: Vec<ElementId>,
 }
 
 pub struct UiEvent {
@@ -109,6 +111,8 @@ impl WebsysDom {
             max_template_id: 0,
             #[cfg(feature = "mounted")]
             event_channel,
+            #[cfg(feature = "mounted")]
+            queued_mounted_events: Default::default(),
         }
     }
 

packages/web/src/eval.rs

@@ -86,7 +86,7 @@ impl WebEvaluator {
 
         Ok(Self {
             dioxus,
-            channel_receiver: channel_receiver,
+            channel_receiver,
             result: RefCell::new(Some(result)),
         })
     }

packages/web/src/event.rs

@@ -410,6 +410,12 @@ impl HasFormData for WebFormData {
             }
         }
 
+        // try to fill in select element values
+        if let Some(select) = self.element.dyn_ref::<web_sys::HtmlSelectElement>() {
+            let options = get_select_data(select);
+            values.insert("options".to_string(), FormValue::VecText(options));
+        }
+
         values
     }
 
@@ -530,16 +536,17 @@ export function get_form_data(form) {
     const formData = new FormData(form);
 
     for (let name of formData.keys()) {
-        const fieldType = target.elements[name].type;
+        const fieldType = form.elements[name].type;
+        console.log(fieldType);
 
         switch (fieldType) {
             case "select-multiple":
-                contents.values[name] = formData.getAll(name);
+                values.set(name, formData.getAll(name));
                 break;
 
             // add cases for fieldTypes that can hold multiple values here
             default:
-                contents.values[name] = formData.get(name);
+                values.set(name, formData.get(name));
                 break;
         }
     }
@@ -550,3 +557,21 @@ export function get_form_data(form) {
 extern "C" {
     fn get_form_data(form: &web_sys::HtmlFormElement) -> js_sys::Map;
 }
+
+// web-sys does not expose the keys api for select data, so we need to manually bind to it
+#[wasm_bindgen(inline_js = r#"
+export function get_select_data(select) {
+    let values = [];
+    for (let i = 0; i < select.options.length; i++) {
+      let option = select.options[i];
+      if (option.selected) {
+        values.push(option.value.toString());
+      }
+    }
+
+    return values;
+}
+"#)]
+extern "C" {
+    fn get_select_data(select: &web_sys::HtmlSelectElement) -> Vec<String>;
+}

packages/web/src/mutations.rs

@@ -4,7 +4,6 @@ use dioxus_core::prelude::*;
 use dioxus_core::WriteMutations;
 use dioxus_core::{AttributeValue, ElementId};
 use dioxus_html::event_bubbles;
-use dioxus_html::MountedData;
 use dioxus_html::PlatformEventData;
 use dioxus_interpreter_js::get_node;
 use dioxus_interpreter_js::minimal_bindings;
@@ -58,22 +57,27 @@ impl WebsysDom {
     }
 
     pub fn flush_edits(&mut self) {
-        self.interpreter.flush()
+        self.interpreter.flush();
+        #[cfg(feature = "mounted")]
+        // Now that we've flushed the edits and the dom nodes exist, we can send the mounted events.
+        {
+            for id in self.queued_mounted_events.drain(..) {
+                let node = get_node(id.0 as u32);
+                if let Some(element) = node.dyn_ref::<web_sys::Element>() {
+                    let _ = self.event_channel.unbounded_send(UiEvent {
+                        name: "mounted".to_string(),
+                        bubbles: false,
+                        element: id,
+                        data: PlatformEventData::new(Box::new(element.clone())),
+                    });
+                }
+            }
+        }
     }
 
     #[cfg(feature = "mounted")]
-    pub(crate) fn send_mount_event(&self, id: ElementId) {
-        let node = get_node(id.0 as u32);
-        if let Some(element) = node.dyn_ref::<web_sys::Element>() {
-            let data: MountedData = element.into();
-            let data = Box::new(data);
-            let _ = self.event_channel.unbounded_send(UiEvent {
-                name: "mounted".to_string(),
-                bubbles: false,
-                element: id,
-                data: PlatformEventData::new(data),
-            });
-        }
+    pub(crate) fn send_mount_event(&mut self, id: ElementId) {
+        self.queued_mounted_events.push(id);
     }
 }