support taking in a component object

Author: JamesHutchison

src/reactpy/executors/asgi/pyscript.py

@@ -17,8 +17,8 @@
     pyscript_component_html,
     pyscript_setup_html,
 )
-from reactpy.executors.utils import html_noscript_path_to_html, vdom_head_to_html
-from reactpy.types import ReactPyConfig, VdomDict
+from reactpy.executors.utils import html_noscript_to_html, vdom_head_to_html
+from reactpy.types import ReactPyConfig, RootComponentConstructor, VdomDict
 
 
 class ReactPyCsr(ReactPy):
@@ -32,8 +32,9 @@ def __init__(
         initial: str | VdomDict = "",
         http_headers: dict[str, str] | None = None,
         html_head: VdomDict | None = None,
-        html_noscript_str_or_path: str
+        html_noscript: str
         | Path
+        | RootComponentConstructor
         | None = "Enable JavaScript to view this site.",
         html_lang: str = "en",
         **settings: Unpack[ReactPyConfig],
@@ -62,8 +63,9 @@ def __init__(
                 commonly used to render a loading animation.
             http_headers: Additional headers to include in the HTTP response for the base HTML document.
             html_head: Additional head elements to include in the HTML response.
-            html_noscript_str_or_path: String or Path to an HTML file whose contents are rendered within a
-                `<noscript>` tag in the HTML body. If None, then noscript is not rendered.
+            html_noscript: String, Path to an HTML file, or component rendered to HTML
+                inside a `<noscript>` tag in the HTML body.
+                If None, then noscript is not rendered.
             html_lang: The language of the HTML document.
             settings:
                 Global ReactPy configuration settings that affect behavior and performance. Most settings
@@ -83,7 +85,7 @@ def __init__(
         self.extra_headers = http_headers or {}
         self.dispatcher_pattern = re.compile(f"^{self.dispatcher_path}?")
         self.html_head = html_head or html.head()
-        self.html_noscript_str_or_path = html_noscript_str_or_path
+        self.html_noscript = html_noscript
         self.html_lang = html_lang
 
     def match_dispatch_path(self, scope: AsgiWebsocketScope) -> bool:  # nocov
@@ -103,7 +105,7 @@ class ReactPyPyscriptApp(ReactPyApp):
     def render_index_html(self) -> None:
         """Process the index.html and store the results in this class."""
         head_content = vdom_head_to_html(self.parent.html_head)
-        noscript = html_noscript_path_to_html(self.parent.html_noscript_str_or_path)
+        noscript = html_noscript_to_html(self.parent.html_noscript)
         pyscript_setup = pyscript_setup_html(
             extra_py=self.parent.extra_py,
             extra_js=self.parent.extra_js,

src/reactpy/executors/asgi/standalone.py

@@ -26,7 +26,7 @@
 )
 from reactpy.executors.pyscript.utils import pyscript_setup_html
 from reactpy.executors.utils import (
-    html_noscript_path_to_html,
+    html_noscript_to_html,
     server_side_component_html,
     vdom_head_to_html,
 )
@@ -50,8 +50,9 @@ def __init__(
         *,
         http_headers: dict[str, str] | None = None,
         html_head: VdomDict | None = None,
-        html_noscript_str_or_path: str
+        html_noscript: str
         | Path
+        | RootComponentConstructor
         | None = "Enable JavaScript to view this site.",
         html_lang: str = "en",
         pyscript_setup: bool = False,
@@ -64,8 +65,8 @@ def __init__(
             root_component: The root component to render. This app is typically a single page application.
             http_headers: Additional headers to include in the HTTP response for the base HTML document.
             html_head: Additional head elements to include in the HTML response.
-            html_noscript_str_or_path: String or Path to an HTML file whose contents are rendered within a
-                `<noscript>` tag in the HTML body.
+            html_noscript: String, Path to an HTML file, or component rendered to HTML
+                inside a `<noscript>` tag in the HTML body.
             html_lang: The language of the HTML document.
             pyscript_setup: Whether to automatically load PyScript within your HTML head.
             pyscript_options: Options to configure PyScript behavior.
@@ -76,7 +77,7 @@ def __init__(
         self.extra_headers = http_headers or {}
         self.dispatcher_pattern = re.compile(f"^{self.dispatcher_path}?")
         self.html_head = html_head or html.head()
-        self.html_noscript_str_or_path = html_noscript_str_or_path
+        self.html_noscript = html_noscript
         self.html_lang = html_lang
 
         if pyscript_setup:
@@ -240,7 +241,7 @@ async def __call__(
 
     def render_index_html(self) -> None:
         """Process the index.html and store the results in this class."""
-        noscript = html_noscript_path_to_html(self.parent.html_noscript_str_or_path)
+        noscript = html_noscript_to_html(self.parent.html_noscript)
         self._index_html = (
             "<!doctype html>"
             f'<html lang="{self.parent.html_lang}">'

src/reactpy/executors/utils.py

@@ -13,7 +13,7 @@
     REACTPY_RECONNECT_MAX_INTERVAL,
     REACTPY_RECONNECT_MAX_RETRIES,
 )
-from reactpy.types import ReactPyConfig, VdomDict
+from reactpy.types import ReactPyConfig, RootComponentConstructor, VdomDict
 from reactpy.utils import import_dotted_path, reactpy_to_string
 
 logger = logging.getLogger(__name__)
@@ -47,12 +47,16 @@ def vdom_head_to_html(head: VdomDict) -> str:
     raise ValueError("Head element must be constructed with `html.head`.")
 
 
-def html_noscript_path_to_html(path_or_body: str | Path | None) -> str:
-    if path_or_body is None:
+def html_noscript_to_html(
+    html_noscript: str | Path | RootComponentConstructor | None,
+) -> str:
+    if html_noscript is None:
         return ""
-    if isinstance(path_or_body, Path):
-        return f"<noscript>{path_or_body.read_text()}</noscript>"
-    return f"<noscript>{path_or_body}</noscript>"
+    if isinstance(html_noscript, Path):
+        html_noscript = html_noscript.read_text()
+    elif callable(html_noscript):
+        html_noscript = reactpy_to_string(html_noscript())
+    return f"<noscript>{html_noscript}</noscript>"
 
 
 def process_settings(settings: ReactPyConfig) -> None:

tests/test_asgi/test_pyscript.py

@@ -111,7 +111,7 @@ async def test_customized_noscript(tmp_path: Path):
 
     app = ReactPyCsr(
         Path(__file__).parent / "pyscript_components" / "root.py",
-        html_noscript_str_or_path=noscript_file,
+        html_noscript=noscript_file,
     )
 
     async with BackendFixture(app) as server:
@@ -130,7 +130,7 @@ async def test_customized_noscript(tmp_path: Path):
 async def test_customized_noscript_string():
     app = ReactPyCsr(
         Path(__file__).parent / "pyscript_components" / "root.py",
-        html_noscript_str_or_path='<p id="noscript-message">Please enable JavaScript.</p>',
+        html_noscript='<p id="noscript-message">Please enable JavaScript.</p>',
     )
 
     async with BackendFixture(app) as server:
@@ -154,7 +154,7 @@ async def test_customized_noscript_from_file(tmp_path: Path):
 
     app = ReactPyCsr(
         Path(__file__).parent / "pyscript_components" / "root.py",
-        html_noscript_str_or_path=noscript_file,
+        html_noscript=noscript_file,
     )
 
     async with BackendFixture(app) as server:
@@ -172,7 +172,29 @@ async def test_customized_noscript_from_file(tmp_path: Path):
 async def test_customized_noscript_from_string():
     app = ReactPyCsr(
         Path(__file__).parent / "pyscript_components" / "root.py",
-        html_noscript_str_or_path='<p id="noscript-message">Please enable JavaScript.</p>',
+        html_noscript='<p id="noscript-message">Please enable JavaScript.</p>',
+    )
+
+    async with BackendFixture(app) as server:
+        url = f"http://{server.host}:{server.port}"
+        response = await asyncio.to_thread(
+            request, "GET", url, timeout=REACTPY_TESTS_DEFAULT_TIMEOUT.current
+        )
+        assert response.status_code == 200
+        assert (
+            '<noscript><p id="noscript-message">Please enable JavaScript.</p></noscript>'
+            in response.text
+        )
+
+
+async def test_customized_noscript_from_component():
+    @reactpy.component
+    def noscript_message():
+        return html.p({"id": "noscript-message"}, "Please enable JavaScript.")
+
+    app = ReactPyCsr(
+        Path(__file__).parent / "pyscript_components" / "root.py",
+        html_noscript=noscript_message,
     )
 
     async with BackendFixture(app) as server:
@@ -216,7 +238,10 @@ async def test_noscript_omitted():
 
 
 async def test_noscript_disabled():
-    app = ReactPyCsr(Path(__file__).parent / "pyscript_components" / "root.py", html_noscript_str_or_path=None)
+    app = ReactPyCsr(
+        Path(__file__).parent / "pyscript_components" / "root.py",
+        html_noscript=None,
+    )
 
     async with BackendFixture(app) as server:
         url = f"http://{server.host}:{server.port}"

tests/test_asgi/test_standalone.py

@@ -152,7 +152,7 @@ def sample():
 
     app = ReactPy(
         sample,
-        html_noscript_str_or_path=noscript_file,
+        html_noscript=noscript_file,
     )
 
     async with BackendFixture(app) as server:
@@ -174,7 +174,7 @@ def sample():
 
     app = ReactPy(
         sample,
-        html_noscript_str_or_path='<p id="noscript-message">Please enable JavaScript.</p>',
+        html_noscript='<p id="noscript-message">Please enable JavaScript.</p>',
     )
 
     async with BackendFixture(app) as server:
@@ -189,6 +189,29 @@ def sample():
         )
 
 
+async def test_customized_noscript_from_component():
+    @reactpy.component
+    def sample():
+        return html.h1("Hello World")
+
+    @reactpy.component
+    def noscript_message():
+        return html.p({"id": "noscript-message"}, "Please enable JavaScript.")
+
+    app = ReactPy(sample, html_noscript=noscript_message)
+
+    async with BackendFixture(app) as server:
+        url = f"http://{server.host}:{server.port}"
+        response = await asyncio.to_thread(
+            request, "GET", url, timeout=REACTPY_TESTS_DEFAULT_TIMEOUT.current
+        )
+        assert response.status_code == 200
+        assert (
+            '<noscript><p id="noscript-message">Please enable JavaScript.</p></noscript>'
+            in response.text
+        )
+
+
 async def test_noscript_omitted():
     @reactpy.component
     def sample():
@@ -213,7 +236,7 @@ async def test_noscript_disabled():
     def sample():
         return html.h1("Hello World")
 
-    app = ReactPy(sample, html_noscript_str_or_path=None)
+    app = ReactPy(sample, html_noscript=None)
 
     async with BackendFixture(app) as server:
         url = f"http://{server.host}:{server.port}"

tests/test_asgi/test_utils.py

@@ -2,7 +2,8 @@
 
 import pytest
 
-from reactpy import config
+import reactpy
+from reactpy import config, html
 from reactpy.executors import utils
 
 
@@ -16,21 +17,32 @@ def test_html_noscript_path_to_html(tmp_path: Path):
     noscript_file.write_text("<p>Please enable JavaScript.</p>", encoding="utf-8")
 
     assert (
-        utils.html_noscript_path_to_html(noscript_file)
+        utils.html_noscript_to_html(noscript_file)
         == "<noscript><p>Please enable JavaScript.</p></noscript>"
     )
 
 
 
 def test_html_noscript_string_to_html():
     assert (
-        utils.html_noscript_path_to_html("<p>Please enable JavaScript.</p>")
+        utils.html_noscript_to_html("<p>Please enable JavaScript.</p>")
         == "<noscript><p>Please enable JavaScript.</p></noscript>"
     )
 
 
+def test_html_noscript_component_to_html():
+    @reactpy.component
+    def message():
+        return html.p({"id": "noscript-message"}, "Please enable JavaScript.")
+
+    assert (
+        utils.html_noscript_to_html(message)
+        == '<noscript><p id="noscript-message">Please enable JavaScript.</p></noscript>'
+    )
+
+
 def test_html_noscript_none_to_html():
-    assert utils.html_noscript_path_to_html(None) == ""
+    assert utils.html_noscript_to_html(None) == ""
 
 
 def test_process_settings():