Add view for rendering component assets (#110)

Author: joshuadavidthomas

CHANGELOG.md

@@ -18,6 +18,10 @@ and this project attempts to adhere to [Semantic Versioning](https://semver.org/
 
 ## [Unreleased]
 
+### Added
+
+- Added built-in view and URLs for serving component assets in development. Note: This is not recommended for production use.
+
 ## [0.9.2]
 
 ### Changed

docs/assets.md

@@ -108,3 +108,31 @@ Assets are collected from all components used in your template hierarchy:
 ```
 
 The `{% bird:css %}` tag will include CSS and the `[% bird:js %}` tag will include JavaScript from both the `nav` and `content` components.
+
+## Serving Assets
+
+### In Development
+
+For development, django-bird includes a built-in view to serve component assets directly through Django. To enable this, add django-bird's URLs to your project's URL configuration:
+
+```{code-block} python
+:caption: urls.py
+
+from django.conf import settings
+from django.urls import include
+from django.urls import path
+
+
+if settings.DEBUG:
+    urlpatterns = [
+        path("__bird__/", include("django_bird.urls")),
+    ]
+```
+
+This will make component assets available at `/__bird__/assets/<component_name>/<asset_filename>` when `settings.DEBUG` is `True`.
+
+```{warning}
+The built-in asset serving is intended for development only. In production, you should serve assets through your web server or a CDN using Django's static files system.
+
+Future integration with `django.contrib.staticfiles` and the `collectstatic` management command is planned.
+```

src/django_bird/components.py

@@ -26,6 +26,12 @@ class Component:
     template: DjangoTemplate
     assets: frozenset[Asset] = field(default_factory=frozenset)
 
+    def get_asset(self, asset_filename: str) -> Asset | None:
+        for asset in self.assets:
+            if asset.path.name == asset_filename:
+                return asset
+        return None
+
     def render(self, context: dict[str, Any]):
         return self.template.render(context)
 

src/django_bird/staticfiles.py

@@ -11,6 +11,14 @@ class AssetType(Enum):
     CSS = "css"
     JS = "js"
 
+    @property
+    def content_type(self):
+        match self:
+            case AssetType.CSS:
+                return "text/css"
+            case AssetType.JS:
+                return "application/javascript"
+
     @property
     def ext(self):
         return f".{self.value}"

src/django_bird/urls.py

@@ -0,0 +1,11 @@
+from __future__ import annotations
+
+from django.urls import path
+
+from .views import asset_view
+
+app_name = "django_bird"
+
+urlpatterns = [
+    path("assets/<str:component_name>/<str:asset_filename>", asset_view, name="asset"),
+]

src/django_bird/views.py

@@ -0,0 +1,34 @@
+from __future__ import annotations
+
+import warnings
+
+from django.conf import settings
+from django.http import FileResponse
+from django.http import Http404
+from django.http.request import HttpRequest
+from django.template.exceptions import TemplateDoesNotExist
+
+from .components import components
+
+
+def asset_view(request: HttpRequest, component_name: str, asset_filename: str):
+    if not settings.DEBUG:
+        warnings.warn(
+            "Serving assets through this view in production is not recommended.",
+            RuntimeWarning,
+            stacklevel=2,
+        )
+
+    try:
+        component = components.get_component(component_name)
+    except (KeyError, TemplateDoesNotExist) as err:
+        raise Http404("Component not found") from err
+
+    asset = component.get_asset(asset_filename)
+    if not asset or not asset.path.exists():
+        raise Http404("Asset not found")
+
+    with open(asset.path, "rb") as f:
+        content = f.read()
+
+    return FileResponse(content, content_type=asset.type.content_type)

tests/test_views.py

@@ -0,0 +1,142 @@
+from __future__ import annotations
+
+from http import HTTPStatus
+
+import pytest
+from django.test import override_settings
+from django.urls import clear_url_caches
+from django.urls import include
+from django.urls import path
+from django.urls import reverse
+
+from django_bird.staticfiles import AssetType
+
+from .utils import TestAsset
+from .utils import TestComponent
+
+
+@pytest.fixture(autouse=True)
+def debug_mode():
+    with override_settings(DEBUG=True):
+        yield
+
+
+@pytest.fixture(autouse=True)
+def setup_urls():
+    urlpatterns = [
+        path("__bird__/", include("django_bird.urls")),
+    ]
+
+    clear_url_caches()
+
+    with override_settings(
+        ROOT_URLCONF=type(
+            "urls",
+            (),
+            {"urlpatterns": urlpatterns},
+        ),
+    ):
+        yield
+
+    clear_url_caches()
+
+
+def test_url_reverse(templates_dir):
+    button = TestComponent(name="button", content="<button>Click me</button>").create(
+        templates_dir
+    )
+    button_css = TestAsset(
+        component=button,
+        content=".button { color: blue; }",
+        asset_type=AssetType.CSS,
+    ).create()
+
+    assert reverse(
+        "django_bird:asset",
+        kwargs={"component_name": button.name, "asset_filename": button_css.file.name},
+    )
+
+
+def test_get_css(templates_dir, client):
+    button = TestComponent(name="button", content="<button>Click me</button>").create(
+        templates_dir
+    )
+    button_css = TestAsset(
+        component=button,
+        content=".button { color: blue; }",
+        asset_type=AssetType.CSS,
+    ).create()
+
+    response = client.get(f"/__bird__/assets/{button.name}/{button_css.file.name}")
+
+    assert response.status_code == HTTPStatus.OK
+    assert response["Content-Type"] == "text/css"
+
+
+def test_get_js(templates_dir, client):
+    button = TestComponent(name="button", content="<button>Click me</button>").create(
+        templates_dir
+    )
+    button_js = TestAsset(
+        component=button, content="console.log('button');", asset_type=AssetType.JS
+    ).create()
+
+    response = client.get(f"/__bird__/assets/{button.name}/{button_js.file.name}")
+
+    assert response.status_code == HTTPStatus.OK
+    assert response["Content-Type"] == "application/javascript"
+
+
+def test_get_invalid_type(templates_dir, client):
+    button = TestComponent(name="button", content="<button>Click me</button>").create(
+        templates_dir
+    )
+
+    button_txt_file = button.file.parent / f"{button.file.stem}.txt"
+    button_txt_file.write_text("hello from a text file")
+
+    response = client.get(f"/__bird__/assets/{button.name}/{button_txt_file.name}")
+
+    assert response.status_code == HTTPStatus.NOT_FOUND
+
+
+def test_get_nonexistent_component(templates_dir, client):
+    bird_dir = templates_dir / "bird"
+    bird_dir.mkdir(exist_ok=True)
+
+    nonexistent_css_file = bird_dir / "nonexistent.css"
+    nonexistent_css_file.write_text(".button { color: blue; }")
+
+    response = client.get(f"/__bird__/assets/nonexistent/{nonexistent_css_file.name}")
+
+    assert response.status_code == HTTPStatus.NOT_FOUND
+
+
+def test_asset_view_nonexistent_asset(templates_dir, client):
+    button = TestComponent(name="button", content="<button>Click me</button>").create(
+        templates_dir
+    )
+
+    response = client.get(f"/__bird__/assets/{button.name}/button.css")
+
+    assert response.status_code == HTTPStatus.NOT_FOUND
+
+
+def test_asset_view_warns_debug_false(templates_dir, client):
+    button = TestComponent(name="button", content="<button>Click me</button>").create(
+        templates_dir
+    )
+    button_css = TestAsset(
+        component=button,
+        content=".button { color: blue; }",
+        asset_type=AssetType.CSS,
+    ).create()
+
+    with override_settings(DEBUG=False):
+        with pytest.warns(RuntimeWarning):
+            response = client.get(
+                f"/__bird__/assets/{button.name}/{button_css.file.name}"
+            )
+
+    assert response.status_code == HTTPStatus.OK
+    assert response["Content-Type"] == "text/css"