Merge branch 'main' of https://github.com/AnswerDotAI/fasthtml

Author: ncoop57

fasthtml/__init__.py

@@ -3,3 +3,4 @@
 from .authmw import *
 from .components import *
 from .xtend import *
+from .live_reload import *

fasthtml/_modidx.py

@@ -19,6 +19,7 @@
             'fasthtml.core': {},
             'fasthtml.fastapp': {},
             'fasthtml.js': {},
+            'fasthtml.live_reload': {},
             'fasthtml.oauth': { 'fasthtml.oauth.GitHubAppClient': ('oauth.html#githubappclient', 'fasthtml/oauth.py'),
                                 'fasthtml.oauth.GitHubAppClient.__init__': ('oauth.html#githubappclient.__init__', 'fasthtml/oauth.py'),
                                 'fasthtml.oauth.GoogleAppClient': ('oauth.html#googleappclient', 'fasthtml/oauth.py'),

fasthtml/core.py

@@ -202,7 +202,7 @@ def __init__(self, routes=None, redirect_slashes=True, default=None, on_startup=
     def add_route( self, path: str, endpoint: callable, methods=None, name=None, include_in_schema=True):
         route = RouteX(path, endpoint=endpoint, methods=methods, name=name, include_in_schema=include_in_schema,
                       hdrs=self.hdrs, before=self.before, **self.bodykw)
-        self.routes = [o for o in self.routes if o.methods!=methods or o.path!=path]
+        self.routes = [o for o in self.routes if getattr(o,'methods',None)!=methods or o.path!=path]
         self.routes.append(route)
 
 htmxscr = Script(

fasthtml/live_reload.py

@@ -0,0 +1,62 @@
+from starlette.routing import WebSocketRoute
+from fasthtml import FastHTML, Script
+
+__all__ = ["FastHTMLWithLiveReload"]
+
+
+LIVE_RELOAD_SCRIPT = """
+    (function() {
+        var socket = new WebSocket(`ws://${window.location.host}/live-reload`);
+        var maxReloadAttempts = 20;
+        var reloadInterval = 250; // time between reload attempts in ms
+        socket.onclose = function() {
+            let reloadAttempts = 0;
+            const intervalFn = setInterval(function(){
+                window.location.reload();
+                reloadCount++;
+                if (reloadAttempts === maxReloadAttempts) {
+                    clearInterval(intervalFn);
+                };
+            }, reloadInterval);
+        }
+    })();
+"""
+
+
+async def live_reload_websocket(websocket):
+    await websocket.accept()
+
+
+class FastHTMLWithLiveReload(FastHTML):
+    """
+    `FastHTMLWithLiveReload` enables live reloading.
+    This means that any code changes saved on the server will automatically
+    trigger a reload of both the server and browser window.
+
+    How does it work?
+      - a websocket is creaetd at `/live-reload`
+      - a small js snippet `LIVE_RELOAD_SCRIPT` is injected into each webpage
+      - this snippet connects to the websocket at `/live-reload` and listens for an `onclose` event
+      - when the onclose event is detected the browser is reloaded
+
+    Why do we listen for an `onclose` event?
+      When code changes are saved the server automatically reloads if the --reload flag is set.
+      The server reload kills the websocket connection. The `onclose` event serves as a proxy
+      for "developer has saved some changes".
+
+    Usage
+        >>> from fasthtml.all import *
+        >>> app = FastHTMLWithLiveReload()
+
+        Run:
+            uvicorn main:app --reload
+    """
+    LIVE_RELOAD_HEADER = Script(f'{LIVE_RELOAD_SCRIPT}')
+    LIVE_RELOAD_ROUTE = WebSocketRoute("/live-reload", endpoint=live_reload_websocket)
+
+    def __init__(self, *args, **kwargs):
+        # "hdrs" and "routes" can be missing, None, a list or a tuple.
+        kwargs["hdrs"] = [*(kwargs.get("hdrs") or []), self.LIVE_RELOAD_HEADER]
+        kwargs["routes"] = [*(kwargs.get("routes") or []), self.LIVE_RELOAD_ROUTE]
+        super().__init__(*args, **kwargs)
+

fasthtml/starlette.py

@@ -11,7 +11,7 @@
 from starlette.exceptions import HTTPException
 from starlette._utils import is_async_callable
 from starlette.convertors import Convertor, StringConvertor, register_url_convertor, CONVERTOR_TYPES
-from starlette.routing import Route, Router, Mount
+from starlette.routing import Route, Router, Mount, WebSocketRoute
 from starlette.exceptions import HTTPException,WebSocketException
 from starlette.endpoints import HTTPEndpoint,WebSocketEndpoint
 from starlette.config import Config

nbs/core_tests.ipynb

@@ -116,9 +116,17 @@
    "metadata": {},
    "outputs": [],
    "source": [
-    "app = FastHTML(secret_key='soopersecret')\n",
-    "cli = TestClient(app)\n",
-    "rt = app.route"
+    "def get_cli(app): return app,TestClient(app),app.route"
+   ]
+  },
+  {
+   "cell_type": "code",
+   "execution_count": null,
+   "id": "4e3d0e99",
+   "metadata": {},
+   "outputs": [],
+   "source": [
+    "app,cli,rt = get_cli(FastHTML(secret_key='soopersecret'))"
    ]
   },
   {
@@ -421,13 +429,13 @@
      "name": "stdout",
      "output_type": "stream",
      "text": [
-      "Set to 2024-06-09 13:25:46.659017\n"
+      "Set to 2024-06-12 08:11:01.624854\n"
      ]
     },
     {
      "data": {
       "text/plain": [
-       "'Cookie was set at time 13:25:46.659017'"
+       "'Cookie was set at time 08:11:01.624854'"
       ]
      },
      "execution_count": null,
@@ -468,13 +476,13 @@
      "name": "stdout",
      "output_type": "stream",
      "text": [
-      "Set to 2024-06-09 13:25:46.705099\n"
+      "Set to 2024-06-12 08:11:03.878051\n"
      ]
     },
     {
      "data": {
       "text/plain": [
-       "'Session time: 13:25:46.705099'"
+       "'Session time: 08:11:03.878051'"
       ]
      },
      "execution_count": null,
@@ -502,11 +510,11 @@
       "\n",
       "<!-- do not remove -->\n",
       "\n",
-      "## 0.0.9\n",
+      "## 0.0.10\n",
       "\n",
       "### New Features\n",
       "\n",
-      "- Module `_\n"
+      "- sortable\n"
      ]
     }
    ],
@@ -528,16 +536,46 @@
    "outputs": [],
    "source": [
     "auth = user_pwd_auth(testuser='spycraft')\n",
-    "app = FastHTML(middleware=[auth])\n",
-    "cli = TestClient(app)\n",
+    "app,cli,rt = get_cli(FastHTML(middleware=[auth]))\n",
     "\n",
-    "@app.route(\"/locked\")\n",
+    "@rt(\"/locked\")\n",
     "def get(auth): return 'Hello, ' + auth\n",
     "\n",
     "test_eq(cli.get('/locked').text, 'not authenticated')\n",
     "test_eq(cli.get('/locked', auth=(\"testuser\",\"spycraft\")).text, 'Hello, testuser')"
    ]
   },
+  {
+   "cell_type": "code",
+   "execution_count": null,
+   "id": "97f2553c",
+   "metadata": {},
+   "outputs": [],
+   "source": [
+    "hdrs, routes = app.router.hdrs, app.routes"
+   ]
+  },
+  {
+   "cell_type": "code",
+   "execution_count": null,
+   "id": "fa194d53",
+   "metadata": {},
+   "outputs": [],
+   "source": [
+    "app,cli,rt = get_cli(FastHTMLWithLiveReload())\n",
+    "\n",
+    "@rt(\"/hi\")\n",
+    "def get(): return 'Hi there'\n",
+    "\n",
+    "test_eq(cli.get('/hi').text, \"Hi there\")\n",
+    "\n",
+    "lr_hdrs, lr_routes = app.router.hdrs, app.routes\n",
+    "test_eq(len(lr_hdrs), len(hdrs)+1)\n",
+    "assert app.LIVE_RELOAD_HEADER in lr_hdrs\n",
+    "test_eq(len(lr_routes), len(routes)+1)\n",
+    "assert app.LIVE_RELOAD_ROUTE in lr_routes"
+   ]
+  },
   {
    "cell_type": "markdown",
    "id": "ff470ef6",

nbs/index.ipynb

@@ -707,6 +707,32 @@
     "cli.get('/hxtest', headers={'HX-Request':'1'}).text"
    ]
   },
+  {
+   "cell_type": "markdown",
+   "metadata": {},
+   "source": [
+    "### Live Reloading\n",
+    "When building your app it can be useful to view your changes in a web browser as you make them. FastHTML supports live reloading which means that it watches for any changes to your code and automatically refreshes the webpage in your browser.\n",
+    "\n",
+    "To enable live reloading simply replace `FastHTML` in your app with `FastHTMLWithLiveReload`.\n",
+    "\n",
+    "```python\n",
+    "from fasthtml.all import *\n",
+    "app = FastHTMLWithLiveReload()\n",
+    "```\n",
+    "\n",
+    "Then in your terminal run `uvicorn` with reloading enabled.\n",
+    "\n",
+    "```\n",
+    "uvicorn: main:app --reload\n",
+    "```\n",
+    "\n",
+    "**⚠️ Gotchas**\n",
+    "- A reload is only triggered when you save your changes.\n",
+    "- `FastHTMLWithLiveReload` should only be used during development.\n",
+    "- If your app spans multiple directories you might need to use the `--reload-dir` flag to watch all files in each directory. See the uvicorn [docs](https://www.uvicorn.org/settings/#development) for more info."
+   ]
+  },
   {
    "cell_type": "markdown",
    "metadata": {},

settings.ini

@@ -4,7 +4,7 @@ lib_name = fasthtml
 version = 0.0.11
 min_python = 3.10
 license = apache2
-requirements = fastcore>=1.5.45 python-dateutil starlette oauthlib itsdangerous uvicorn httpx fastlite>=0.0.6 python-multipart
+requirements = fastcore>=1.5.45 python-dateutil starlette oauthlib itsdangerous uvicorn[standard] httpx fastlite>=0.0.6 python-multipart
 dev_requirements = ipython lxml
 black_formatting = False
 conda_user = fastai