Fix layouts in child routers (#4994)

* fix layouts in child routers

* test child route layouts

Author: ealmloff

packages/router/src/components/child_router.rs

@@ -1,8 +1,8 @@
 /// Components that allow the macro to add child routers. This component provides a context
 /// to the child router that maps child routes to root routes and vice versa.
-use crate::Routable;
+use crate::{Outlet, OutletContext, Routable};
 use dioxus_core::{provide_context, try_consume_context, use_hook, Element};
-use dioxus_core_macro::{component, Props};
+use dioxus_core_macro::{component, rsx, Props};
 
 /// Maps a child route into the root router and vice versa
 // NOTE: Currently child routers only support simple static prefixes, but this
@@ -61,8 +61,9 @@ pub fn ChildRouter<R: Routable>(props: ChildRouterProps<R>) -> Element {
         provide_context(ChildRouteMapping {
             format_route_as_root_route: props.format_route_as_root_route,
             parse_route_from_root_route: props.parse_route_from_root_route,
-        })
+        });
+        provide_context(OutletContext::<R>::new());
     });
 
-    props.route.render(0)
+    rsx! { Outlet::<R> {} }
 }

packages/router/tests/via_ssr/child_outlet.rs

@@ -0,0 +1,77 @@
+#![allow(unused)]
+
+use std::rc::Rc;
+
+use dioxus::prelude::*;
+use dioxus_history::{History, MemoryHistory};
+use dioxus_router::components::HistoryProvider;
+
+fn prepare(path: impl Into<String>) -> VirtualDom {
+    let mut vdom = VirtualDom::new_with_props(
+        App,
+        AppProps {
+            path: path.into().parse().unwrap(),
+        },
+    );
+    vdom.rebuild_in_place();
+    return vdom;
+
+    #[derive(Routable, Clone, PartialEq)]
+    #[rustfmt::skip]
+    enum Route {
+        #[layout(Layout)]
+            #[child("/")]
+            Child { child: ChildRoute },
+    }
+
+    #[derive(Routable, Clone, PartialEq)]
+    #[rustfmt::skip]
+    enum ChildRoute{
+        #[layout(ChildLayout)]
+            #[route("/")]
+            RootIndex {}
+    }
+
+    #[component]
+    fn App(path: Route) -> Element {
+        rsx! {
+            h1 { "App" }
+            HistoryProvider {
+                history:  move |_| Rc::new(MemoryHistory::with_initial_path(path.clone())) as Rc<dyn History>,
+                Router::<Route> {}
+            }
+        }
+    }
+
+    #[component]
+    fn RootIndex() -> Element {
+        rsx! { h2 { "Root Index" } }
+    }
+
+    #[component]
+    fn Layout() -> Element {
+        rsx! {
+            h2 { "parent layout" }
+            Outlet::<Route> { }
+        }
+    }
+
+    #[component]
+    fn ChildLayout() -> Element {
+        rsx! {
+            h2 { "child layout" }
+            Outlet::<ChildRoute> { }
+        }
+    }
+}
+
+#[test]
+fn root_index() {
+    let vdom = prepare("/");
+    let html = dioxus_ssr::render(&vdom);
+
+    assert_eq!(
+        html,
+        "<h1>App</h1><h2>parent layout</h2><h2>child layout</h2><h2>Root Index</h2>"
+    );
+}

packages/router/tests/via_ssr/main.rs

@@ -1,3 +1,4 @@
+mod child_outlet;
 mod link;
 mod navigation;
 mod outlet;