fixed portal compilation error and started on example e2e test

leptos-rs · Oct 1, 2023 · 686828a · 686828a
1 parent b7e8567
commit 686828a
Show file tree

Hide file tree

Showing 3 changed files with 14 additions and 51 deletions.
diff --git a/examples/portal/src/lib.rs b/examples/portal/src/lib.rs
@@ -7,7 +7,7 @@ pub fn App() -> impl IntoView {
 
     view! {
         <div>
-            <button on:click=move |_| set_show_overlay(true)>
+            <button id="btn-show" on:click=move |_| set_show_overlay(true)>
                 Show Overlay
             </button>
 
@@ -16,10 +16,10 @@ pub fn App() -> impl IntoView {
                 <Portal>
                     <div style="position: fixed; z-index: 10; width: 100vw; height: 100vh; top: 0; left: 0; background: rgba(0, 0, 0, 0.8); color: white;">
                         <p>This is in the body element</p>
-                        <button on:click=move |_| set_show_overlay(false)>
+                        <button id="btn-hide" on:click=move |_| set_show_overlay(false)>
                             Close Overlay
                         </button>
-                        <button on:click=move |_| set_show_inside_overlay(!show_inside_overlay())>
+                        <button id="btn-toggle" on:click=move |_| set_show_inside_overlay(!show_inside_overlay())>
                             Toggle inner
                         </button>
 

diff --git a/examples/portal/tests/web.rs b/examples/portal/tests/web.rs
@@ -2,26 +2,19 @@ use wasm_bindgen::JsCast;
 use wasm_bindgen_test::*;
 
 wasm_bindgen_test_configure!(run_in_browser);
-use counters::Counters;
 use leptos::*;
+use portal::App;
 use web_sys::HtmlElement;
 
 #[wasm_bindgen_test]
 fn inc() {
-    mount_to_body(|| view! { <Counters/> });
+    mount_to_body(|| view! { <App/> });
 
     let document = leptos::document();
     let div = document.query_selector("div").unwrap().unwrap();
-    let add_counter = div
-        .first_child()
-        .unwrap()
-        .dyn_into::<HtmlElement>()
-        .unwrap();
+    let show_button = document.get_element_by_id("btn-show").unwrap();
 
-    // add 3 counters
-    add_counter.click();
-    add_counter.click();
-    add_counter.click();
+    show_button.click();
 
     // check HTML
     assert_eq!(
@@ -45,31 +38,8 @@ fn inc() {
          --><!-- </EachItem> --><!-- </Each> --></ul>"
     );
 
-    let counters = div
-        .query_selector("ul")
-        .unwrap()
-        .unwrap()
-        .unchecked_into::<HtmlElement>()
-        .children();
-
-    // click first counter once, second counter twice, etc.
-    // `NodeList` isn't a `Vec` so we iterate over it in this slightly awkward way
-    for idx in 0..counters.length() {
-        let counter = counters.item(idx).unwrap();
-        let inc_button = counter
-            .first_child()
-            .unwrap()
-            .next_sibling()
-            .unwrap()
-            .next_sibling()
-            .unwrap()
-            .next_sibling()
-            .unwrap()
-            .unchecked_into::<HtmlElement>();
-        for _ in 0..=idx {
-            inc_button.click();
-        }
-    }
+    let toggle_button = document.get_element_by_id("btn-toggle").unwrap();
+    toggle_button.click();
 
     assert_eq!(
         div.inner_html(),
@@ -92,14 +62,8 @@ fn inc() {
          --><!-- </EachItem> --><!-- </Each> --></ul>"
     );
 
-    // remove the first counter
-    counters
-        .item(0)
-        .unwrap()
-        .last_child()
-        .unwrap()
-        .unchecked_into::<HtmlElement>()
-        .click();
+    let hide_button = document.get_element_by_id("btn-hide").unwrap();
+    hide_button.click();
 
     assert_eq!(
         div.inner_html(),

diff --git a/leptos/src/portal.rs b/leptos/src/portal.rs
@@ -1,8 +1,7 @@
 use crate::ChildrenFn;
 use cfg_if::cfg_if;
-use leptos_dom::{log, IntoView};
+use leptos_dom::IntoView;
 use leptos_macro::component;
-use leptos_reactive::create_render_effect;
 
 /// Renders components somewhere else in the DOM.
 ///
@@ -28,9 +27,9 @@ pub fn Portal(
     /// The children to teleport into the `mount` element
     children: ChildrenFn,
 ) -> impl IntoView {
-    cfg_if! { if #[cfg(any(feature = "hydrate", feature = "csr"))] {
+    cfg_if! { if #[cfg(all(target_arch = "wasm32", any(feature = "hydrate", feature = "csr")))] {
         use leptos_dom::{document, Mountable};
-        use leptos_reactive::on_cleanup;
+        use leptos_reactive::{create_render_effect, on_cleanup};
         use wasm_bindgen::JsCast;
 
         let mount = mount