From 46b19b373122eea2f8737f32bca8f76a192f0a29 Mon Sep 17 00:00:00 2001 From: Christopher Fraser Date: Thu, 15 Aug 2024 12:41:10 +1000 Subject: [PATCH 1/3] Insert root document element to dioxus integration --- .../src/documents/dioxus_document.rs | 29 +++++++++++++++++-- 1 file changed, 27 insertions(+), 2 deletions(-) diff --git a/packages/dioxus-blitz/src/documents/dioxus_document.rs b/packages/dioxus-blitz/src/documents/dioxus_document.rs index 5ebfa32c..f6ccf2fd 100644 --- a/packages/dioxus-blitz/src/documents/dioxus_document.rs +++ b/packages/dioxus-blitz/src/documents/dioxus_document.rs @@ -12,10 +12,14 @@ use dioxus::{ AttributeValue, ElementId, Template, TemplateAttribute, TemplateNode, VirtualDom, WriteMutations, }, - prelude::{set_event_converter, PlatformEventData}, + prelude::{set_event_converter, Element, PlatformEventData}, }; use futures_util::{pin_mut, FutureExt}; use rustc_hash::FxHashMap; +use style::{ + data::{ElementData, ElementStyles}, + properties::{style_structs::Font, ComputedValues}, +}; use super::event_handler::{NativeClickData, NativeConverter}; @@ -134,7 +138,28 @@ impl DioxusDocument { let viewport = Viewport::new(0, 0, 1.0); let mut doc = Document::new(viewport); - // doc.add_element() + //Create a virtual "dioxus:document" element to act as the root element, as we won't have + //a single root otherwise + let document_element_id = doc.create_node(NodeData::Element(ElementNodeData::new( + qual_name("document", Some("dioxus")), + Vec::new(), + ))); + let root_node_id = doc.root_node().id; + let document_element = doc.get_node_mut(document_element_id).unwrap(); + document_element.parent = Some(root_node_id); + let root_node = doc.get_node_mut(root_node_id).unwrap(); + let stylo_element_data = ElementData { + styles: ElementStyles { + primary: Some( + ComputedValues::initial_values_with_font_override(Font::initial_values()) + .to_arc(), + ), + ..Default::default() + }, + ..Default::default() + }; + *root_node.stylo_element_data.borrow_mut() = Some(stylo_element_data); + root_node.children.push(document_element_id); // Include default and user-specified stylesheets doc.add_stylesheet(DEFAULT_CSS); From 18e7353bb474bd0fab210fed4438e7fe0fb26ba0 Mon Sep 17 00:00:00 2001 From: Christopher Fraser Date: Thu, 15 Aug 2024 12:57:26 +1000 Subject: [PATCH 2/3] Render root element instead of root node in DioxusState --- packages/dioxus-blitz/src/documents/dioxus_document.rs | 9 +++++---- 1 file changed, 5 insertions(+), 4 deletions(-) diff --git a/packages/dioxus-blitz/src/documents/dioxus_document.rs b/packages/dioxus-blitz/src/documents/dioxus_document.rs index f6ccf2fd..d36bc315 100644 --- a/packages/dioxus-blitz/src/documents/dioxus_document.rs +++ b/packages/dioxus-blitz/src/documents/dioxus_document.rs @@ -12,7 +12,7 @@ use dioxus::{ AttributeValue, ElementId, Template, TemplateAttribute, TemplateNode, VirtualDom, WriteMutations, }, - prelude::{set_event_converter, Element, PlatformEventData}, + prelude::{set_event_converter, PlatformEventData}, }; use futures_util::{pin_mut, FutureExt}; use rustc_hash::FxHashMap; @@ -138,8 +138,8 @@ impl DioxusDocument { let viewport = Viewport::new(0, 0, 1.0); let mut doc = Document::new(viewport); - //Create a virtual "dioxus:document" element to act as the root element, as we won't have - //a single root otherwise + // Create a virtual "dioxus:document" element to act as the root element, as we won't necessarily + // have a single root otherwise, while the rest of blitz requires that we do let document_element_id = doc.create_node(NodeData::Element(ElementNodeData::new( qual_name("document", Some("dioxus")), Vec::new(), @@ -148,6 +148,7 @@ impl DioxusDocument { let document_element = doc.get_node_mut(document_element_id).unwrap(); document_element.parent = Some(root_node_id); let root_node = doc.get_node_mut(root_node_id).unwrap(); + // Stylo data on the root node container is needed to render the element let stylo_element_data = ElementData { styles: ElementStyles { primary: Some( @@ -225,7 +226,7 @@ pub struct MutationWriter<'a> { impl DioxusState { /// Initialize the DioxusState in the RealDom pub fn create(doc: &mut Document) -> Self { - let root = doc.root_node(); + let root = doc.root_element(); let root_id = root.id; Self { From 9c25f33a73500da329f4682b7279dac400ea74fa Mon Sep 17 00:00:00 2001 From: Christopher Fraser Date: Thu, 15 Aug 2024 15:28:03 +1000 Subject: [PATCH 3/3] Change document to html element --- .../dioxus-blitz/src/documents/dioxus_document.rs | 12 ++++++------ 1 file changed, 6 insertions(+), 6 deletions(-) diff --git a/packages/dioxus-blitz/src/documents/dioxus_document.rs b/packages/dioxus-blitz/src/documents/dioxus_document.rs index d36bc315..94433fe3 100644 --- a/packages/dioxus-blitz/src/documents/dioxus_document.rs +++ b/packages/dioxus-blitz/src/documents/dioxus_document.rs @@ -138,15 +138,15 @@ impl DioxusDocument { let viewport = Viewport::new(0, 0, 1.0); let mut doc = Document::new(viewport); - // Create a virtual "dioxus:document" element to act as the root element, as we won't necessarily + // Create a virtual "html" element to act as the root element, as we won't necessarily // have a single root otherwise, while the rest of blitz requires that we do - let document_element_id = doc.create_node(NodeData::Element(ElementNodeData::new( - qual_name("document", Some("dioxus")), + let html_element_id = doc.create_node(NodeData::Element(ElementNodeData::new( + qual_name("html", None), Vec::new(), ))); let root_node_id = doc.root_node().id; - let document_element = doc.get_node_mut(document_element_id).unwrap(); - document_element.parent = Some(root_node_id); + let html_element = doc.get_node_mut(html_element_id).unwrap(); + html_element.parent = Some(root_node_id); let root_node = doc.get_node_mut(root_node_id).unwrap(); // Stylo data on the root node container is needed to render the element let stylo_element_data = ElementData { @@ -160,7 +160,7 @@ impl DioxusDocument { ..Default::default() }; *root_node.stylo_element_data.borrow_mut() = Some(stylo_element_data); - root_node.children.push(document_element_id); + root_node.children.push(html_element_id); // Include default and user-specified stylesheets doc.add_stylesheet(DEFAULT_CSS);