Merge branch 'master' into fix-event-bubbling

packages/hooks/src/lib.rs

@@ -57,32 +57,32 @@ pub mod computed;
 mod use_on_unmount;
 pub use use_on_unmount::*;
 
-mod usecontext;
-pub use usecontext::*;
+mod use_context;
+pub use use_context::*;
 
-mod usestate;
-pub use usestate::{use_state, UseState};
+mod use_state;
+pub use use_state::{use_state, UseState};
 
-mod useref;
-pub use useref::*;
+mod use_ref;
+pub use use_ref::*;
 
 mod use_shared_state;
 pub use use_shared_state::*;
 
-mod usecoroutine;
-pub use usecoroutine::*;
+mod use_coroutine;
+pub use use_coroutine::*;
 
-mod usefuture;
-pub use usefuture::*;
+mod use_future;
+pub use use_future::*;
 
-mod useeffect;
-pub use useeffect::*;
+mod use_effect;
+pub use use_effect::*;
 
-mod usecallback;
-pub use usecallback::*;
+mod use_callback;
+pub use use_callback::*;
 
-mod usememo;
-pub use usememo::*;
+mod use_memo;
+pub use use_memo::*;
 
-mod userootcontext;
-pub use userootcontext::*;
+mod use_root_context;
+pub use use_root_context::*;

packages/liveview/examples/axum.rs

@@ -19,32 +19,43 @@ async fn main() {
     let addr: std::net::SocketAddr = ([127, 0, 0, 1], 3030).into();
 
     let view = dioxus_liveview::LiveViewPool::new();
+    let index_page_with_glue = |glue: &str| {
+        Html(format!(
+            r#"
+        <!DOCTYPE html>
+        <html>
+            <head> <title>Dioxus LiveView with axum</title>  </head>
+            <body> <div id="main"></div> </body>
+            {glue}
+        </html>
+        "#,
+        ))
+    };
 
-    let app = Router::new()
-        .route(
-            "/",
-            get(move || async move {
-                Html(format!(
-                    r#"
-            <!DOCTYPE html>
-            <html>
-                <head> <title>Dioxus LiveView with axum</title>  </head>
-                <body> <div id="main"></div> </body>
-                {glue}
-            </html>
-            "#,
-                    glue = dioxus_liveview::interpreter_glue(&format!("ws://{addr}/ws"))
-                ))
-            }),
-        )
-        .route(
-            "/ws",
-            get(move |ws: WebSocketUpgrade| async move {
-                ws.on_upgrade(move |socket| async move {
-                    _ = view.launch(dioxus_liveview::axum_socket(socket), app).await;
-                })
-            }),
-        );
+    let app =
+        Router::new()
+            .route(
+                "/",
+                get(move || async move {
+                    index_page_with_glue(&dioxus_liveview::interpreter_glue(&format!(
+                        "ws://{addr}/ws"
+                    )))
+                }),
+            )
+            .route(
+                "/as-path",
+                get(move || async move {
+                    index_page_with_glue(&dioxus_liveview::interpreter_glue("/ws"))
+                }),
+            )
+            .route(
+                "/ws",
+                get(move |ws: WebSocketUpgrade| async move {
+                    ws.on_upgrade(move |socket| async move {
+                        _ = view.launch(dioxus_liveview::axum_socket(socket), app).await;
+                    })
+                }),
+            );
 
     println!("Listening on http://{addr}");
 

packages/liveview/src/lib.rs

@@ -93,14 +93,49 @@ static MAIN_JS: &str = include_str!("./main.js");
 /// This script that gets injected into your app connects this page to the websocket endpoint
 ///
 /// Once the endpoint is connected, it will send the initial state of the app, and then start
-/// processing user events and returning edits to the liveview instance
-pub fn interpreter_glue(url: &str) -> String {
+/// processing user events and returning edits to the liveview instance.
+///
+/// You can pass a relative path prefixed with "/", or enter a full URL including the protocol
+/// (`ws:` or `wss:`) as an argument.
+///
+/// If you enter a relative path, the web client automatically prefixes the host address in
+/// `window.location` when creating a web socket to LiveView.
+///
+/// ```
+/// // Creates websocket connection to same host as current page
+/// interpreter_glue("/api/liveview");
+///
+/// // Creates websocket connection to specified url
+/// interpreter_glue("ws://localhost:8080/api/liveview");
+/// ```
+pub fn interpreter_glue(url_or_path: &str) -> String {
+    // If the url starts with a `/`, generate glue which reuses current host
+    let get_ws_url = if url_or_path.starts_with('/') {
+        r#"
+  let loc = window.location; 
+  let new_url = "";
+  if (loc.protocol === "https:") {{
+      new_url = "wss:";
+  }} else {{
+      new_url = "ws:";
+  }}
+  new_url += "//" + loc.host + path;
+  return new_url;
+      "#
+    } else {
+        "return path;"
+    };
+
     let js = &*INTERPRETER_JS;
     let common = &*COMMON_JS;
     format!(
         r#"
 <script>
-    var WS_ADDR = "{url}";
+    function __dioxusGetWsUrl(path) {{
+      {get_ws_url}
+    }}
+    
+    var WS_ADDR = __dioxusGetWsUrl("{url_or_path}");
     {js}
     {common}
     {MAIN_JS}

packages/server-macro/src/lib.rs

@@ -8,7 +8,7 @@ use syn::{
     Ident, ItemFn, Token,
 };
 
-/// Declares that a function is a [server function](dioxus_fullstack). This means that
+/// Declares that a function is a [server function](https://dioxuslabs.com/learn/0.4/reference/fullstack/server_functions). This means that
 /// its body will only run on the server, i.e., when the `ssr` feature is enabled.
 ///
 /// If you call a server function from the client (i.e., when the `csr` or `hydrate` features

playwright-tests/playwright.config.js

@@ -90,7 +90,7 @@ module.exports = defineConfig({
     },
     {
       cwd: path.join(process.cwd(), 'fullstack'),
-      command: 'cargo run --package dioxus-cli -- build --features web --release\ncargo run --release --features ssr',
+      command: 'cargo run --package dioxus-cli -- build --features web --release && cargo run --release --features ssr',
       port: 3333,
       timeout: 10 * 60 * 1000,
       reuseExistingServer: !process.env.CI,