fix: sort routes in create_asgi_app (#1067)

* fix: sort routes in create_asgi_app

* Update marimo/_server/asgi.py

Co-authored-by: Akshay Agrawal <akshay@marimo.io>

---------

Co-authored-by: Akshay Agrawal <akshay@marimo.io>

marimo/_server/asgi.py

@@ -1,6 +1,6 @@
 # Copyright 2024 Marimo. All rights reserved.
 import abc
-from typing import TYPE_CHECKING
+from typing import TYPE_CHECKING, List, Tuple
 
 if TYPE_CHECKING:
     from starlette.types import ASGIApp
@@ -34,9 +34,9 @@ def create_asgi_app(
     import uvicorn
     builder = (
         create_asgi_app()
-        .with_app(path="/", root="home.py")
         .with_app(path="/app", root="app.py")
         .with_app(path="/app2", root="app2.py")
+        .with_app(path="/", root="home.py")
     )
     app = builder.build()
 
@@ -101,7 +101,14 @@ async def root():
     # We call the entrypoint `root` instead of `filename` incase we want to
     # support directories or code in the future
     class Builder(ASGIAppBuilder):
+        def __init__(self) -> None:
+            self._mount_configs: List[Tuple[str, str]] = []
+
         def with_app(self, *, path: str, root: str) -> "ASGIAppBuilder":
+            self._mount_configs.append((path, root))
+            return self
+
+        def _build_app(self, path: str, root: str) -> "ASGIAppBuilder":
             session_manager = SessionManager(
                 filename=root,
                 mode=SessionMode.RUN,
@@ -143,6 +150,15 @@ def with_app(self, *, path: str, root: str) -> "ASGIAppBuilder":
             return self
 
         def build(self) -> "ASGIApp":
+            # First sort the mount configs by path length
+            # This is to ensure that the root app is mounted last
+            self._mount_configs = sorted(
+                self._mount_configs, key=lambda x: -len(x[0])
+            )
+
+            for path, root in self._mount_configs:
+                self._build_app(path, root)
+
             return base_app
 
     initialize_asyncio()

marimo/_smoke_tests/bugs/1064.py

@@ -0,0 +1,54 @@
+import marimo
+
+__generated_with = "0.3.8"
+app = marimo.App(width="full")
+
+
+@app.cell
+def __():
+    import marimo as mo
+    import plotly.express as px
+    return mo, px
+
+
+@app.cell
+def __(mo):
+    mo.md("# Issue 1064")
+    return
+
+
+@app.cell
+def __(px):
+    plot1 = px.scatter(x=[0, 1, 4, 9, 16], y=[0, 1, 2, 3, 4])
+    plot2 = px.scatter(x=[2, 3, 6, 11, 18], y=[2, 3, 4, 5, 6])
+    return plot1, plot2
+
+
+@app.cell
+def __(mo):
+    tabs = mo.ui.tabs(
+        {
+            "💾 Tab 1": "",
+            "💾 Tab 2": "",
+        }
+    )
+    return tabs,
+
+
+@app.cell
+def __(mo, plot1, plot2, tabs):
+    def render_tab_content():
+        if tabs.value == "💾 Tab 1":
+            return plot1
+        elif tabs.value == "💾 Tab 2":
+            return plot2
+        else:
+            return ""
+
+
+    mo.vstack([tabs.center(), render_tab_content()])
+    return render_tab_content,
+
+
+if __name__ == "__main__":
+    app.run()

tests/_server/test_asgi.py

@@ -86,6 +86,32 @@ def test_multiple_apps(self):
         response = client.get("/app3")
         assert response.status_code == 404, response.text
 
+    def test_root_doesnt_conflict_when_root_is_last(self):
+        builder = create_asgi_app(quiet=True, include_code=True)
+        builder = builder.with_app(path="/app1", root=self.app1)
+        builder = builder.with_app(path="/", root=self.app2)
+        app = builder.build()
+        client = TestClient(app)
+        response = client.get("/app1")
+        assert response.status_code == 200, response.text
+        assert "app1.py" in response.text
+        response = client.get("/")
+        assert response.status_code == 200, response.text
+        assert "app2.py" in response.text
+
+    def test_root_doesnt_conflict_when_root_is_first(self):
+        builder = create_asgi_app(quiet=True, include_code=True)
+        builder = builder.with_app(path="/", root=self.app2)
+        builder = builder.with_app(path="/app1", root=self.app1)
+        app = builder.build()
+        client = TestClient(app)
+        response = client.get("/app1")
+        assert response.status_code == 200, response.text
+        assert "app1.py" in response.text
+        response = client.get("/")
+        assert response.status_code == 200, response.text
+        assert "app2.py" in response.text
+
     def test_can_include_code(self):
         builder = create_asgi_app(quiet=True, include_code=True)
         builder = builder.with_app(path="/app1", root=self.app1)