✨ fix packaging (#28)

* ✨ fix packaging

* switch from uglify to tercer

* fix pkg versions

* add brotli to dev env

* fix ci

* fix ci

* fix ci

.github/workflows/onpush.yml

@@ -32,6 +32,9 @@ jobs:
         run: |
           python -m pip install --upgrade pip 
           pip install hatch
+          hatch run sync
+      - name: Download CSS dependencies
+        run: hatch run python src/python/schorle/scripts/load_css_deps.py
       - name: Lint
         run: hatch run lint:style .
       - name: Test

.github/workflows/onrelease.yml

@@ -36,6 +36,9 @@ jobs:
         run: |
           python -m pip install --upgrade pip 
           pip install hatch
+          hatch run sync
+      - name: Download CSS dependencies
+        run: hatch run python src/python/schorle/scripts/load_css_deps.py
       - name: Build package
         run: hatch build
       - name: Publish package distributions to PyPI

Makefile

@@ -30,4 +30,20 @@ docs-serve: docs-build
 docs-restart-app:
 	@echo "Restarting docs app..."
 	az webapp restart --name schorle-webapp --resource-group schorle-rg
+	@echo "Done."
+
+docs-build-local:
+	rm -rf src/python/schorle/assets/js
+	rm -rf src/python/schorle/assets/dist/*.br
+	python src/python/schorle/scripts/load_css_deps.py
+	yarn --cwd src/typescript build
+	@echo "Building package..."
+	hatch build -t wheel -c
+	@echo "Package built, contents:"
+	unzip -l dist/*.whl
+	docker build --no-cache -t schorle-docs-local -f docs/Dockerfile.docs.local .
+
+docs-serve-local: docs-build-local
+	@echo "Serving docs..."
+	docker run -p 4444:4444 -it schorle-docs-local
 	@echo "Done."

docs/Dockerfile.docs.local

@@ -0,0 +1,14 @@
+FROM python:3.10.6-slim as runtime
+ENV PYTHONUNBUFFERED=1 \
+    PYTHONDONTWRITEBYTECODE=1 \
+    PIP_DISABLE_PIP_VERSION_CHECK=on
+
+
+COPY ../dist/ /app/dist
+RUN pip install /app/dist/*.whl
+RUN mkdir -p /app/docs
+RUN mkdir -p /app/raw
+WORKDIR /app
+COPY docs/landing.py /app/docs/landing.py
+COPY raw /app/raw
+ENTRYPOINT ["uvicorn", "docs.landing:app", "--host", "0.0.0.0", "--port", "4444"]

pyproject.toml

@@ -48,6 +48,7 @@ packages = ["src/python/schorle"]
 
 [tool.hatch.build.targets.wheel.force-include]
 "src/python/schorle/assets/js" = "schorle/assets/js"
+"src/python/schorle/assets/dist" = "schorle/assets/dist"
 
 [tool.hatch.build.hooks.vcs]
 version-file = "src/python/schorle/_version.py"
@@ -57,7 +58,9 @@ dependencies = [
     "coverage[toml]>=6.5", "pytest",
     "betterproto[compiler]",
     "hatch-vcs",
-    "pytest-cov"
+    "pytest-cov",
+    "brotli",
+    "requests"
 ]
 [tool.hatch.envs.default.scripts]
 test = "pytest {args:tests}"

src/python/schorle/app.py

@@ -5,14 +5,15 @@
 from uuid import uuid4
 
 from fastapi import FastAPI
+from loguru import logger
 from starlette.responses import FileResponse, HTMLResponse
 from starlette.types import Receive, Scope, Send
 from starlette.websockets import WebSocket
 
 from schorle.component import Component
 from schorle.document import Document
 from schorle.events import EventsEndpoint
-from schorle.headers import DEV_HEADER, SESSION_ID_HEADER
+from schorle.headers import SESSION_ID_HEADER
 from schorle.session import Session
 from schorle.theme import Theme
 from schorle.utils import ASSETS_PATH, RunningMode, get_running_mode
@@ -30,8 +31,10 @@ def get_file(file_name: str, sub_path: Path | None = None) -> FileResponse | HTM
         mime_type, _ = mimetypes.guess_type(file_path)
 
         response = FileResponse(file_path, media_type=mime_type)
+        logger.info(f"Sending file: {file_path} with suffixes: {file_path.suffixes}")
         if ".br" in file_path.suffixes:
             response.headers["Content-Encoding"] = "br"
+            logger.info(f"Using brotli compression for file {file_path}")
         return response
     else:
         return HTMLResponse(status_code=404)
@@ -108,8 +111,6 @@ async def wrapper():
                 new_session = self.session_manager.create_session()
                 response = doc.to_response(new_session)
                 response.set_cookie(SESSION_ID_HEADER, new_session.uuid)
-                if get_running_mode() == RunningMode.DEV:
-                    response.set_cookie(DEV_HEADER, "true")
                 return response
 
         return decorator

src/python/schorle/document.py

@@ -1,3 +1,5 @@
+import base64
+import hashlib
 from typing import Callable
 
 from fastapi.responses import HTMLResponse
@@ -11,6 +13,7 @@
 from schorle.tags import HTMLTag
 from schorle.text import text
 from schorle.theme import Theme
+from schorle.utils import ASSETS_PATH
 
 
 class DevLoader(Component):
@@ -21,6 +24,30 @@ def render(self):
         span(classes="loading loading-md loading-bars text-primary")
 
 
+def get_integrity(raw_file_path: str) -> str:
+    file_path = ASSETS_PATH / raw_file_path
+    if not file_path.exists():
+        msg = f"File '{file_path}' not found."
+        raise FileNotFoundError(msg)
+
+    # Open the file in binary mode for reading
+    with open(file_path, "rb") as f:
+        # Calculate the SHA384 hash of the file
+        hash_obj = hashlib.sha256()
+        while True:
+            # Read the file in chunks to avoid loading large files into memory
+            chunk = f.read(4096)
+            if not chunk:
+                break
+            hash_obj.update(chunk)
+
+    # Encode the hash using base64 with URL and filename safe characters
+    integrity_hash = base64.b64encode(hash_obj.digest()).decode()
+
+    # Prepend "sha384-" to the hash
+    return f"sha256-{integrity_hash}"
+
+
 class Document(Component):
     page: Component
     title: str = "Schorle"
@@ -44,11 +71,29 @@ def render(self):
             with title():
                 text(self.title)
 
+            if self.with_dev_tools:
+                meta(name="schorle-dev-mode", content="true")
+
             link(href="/favicon.svg", rel="icon", type="image/svg+xml")
 
-            script(src="/_schorle/dist/tailwind.min.js.br")
-            link(href="/_schorle/dist/daisyui.min.css.br", rel="stylesheet")
-            script(src="/_schorle/js/index.min.js.br", crossorigin="anonymous", defer="", **{"type": "module"})
+            script(
+                src="/_schorle/dist/tailwind.min.js.br",
+                integrity=get_integrity("dist/tailwind.min.js"),
+                crossorigin="anonymous",
+            )
+            link(
+                href="/_schorle/dist/daisyui.min.css.br",
+                integrity=get_integrity("dist/daisyui.min.css"),
+                crossorigin="anonymous",
+                rel="stylesheet",
+            )
+            script(
+                src="/_schorle/js/index.min.js.br",
+                integrity=get_integrity("js/index.min.js"),
+                crossorigin="anonymous",
+                defer="",
+                **{"type": "module"},
+            )
             if self.extra_assets:
                 self.extra_assets()
 

src/python/schorle/scripts/load_css_deps.py

@@ -34,19 +34,20 @@ def replace_tw_message(text):
 
 
 cdns = [
-    CdnInfo("https://cdn.tailwindcss.com", "tailwind", "tailwind.min.js.br"),
-    CdnInfo("https://cdn.jsdelivr.net/npm/[email protected]/dist/full.min.css", "daisyui", "daisyui.min.css.br"),
+    CdnInfo("https://cdn.tailwindcss.com", "tailwind", "tailwind.min.js"),
+    CdnInfo("https://cdn.jsdelivr.net/npm/[email protected]/dist/full.min.css", "daisyui", "daisyui.min.css"),
 ]
 
 dist_path = ASSETS_PATH / "dist"
 
 
 def load_deps():
+    print("Loading CSS dependencies...")  # noqa T201
     if not dist_path.exists():
         dist_path.mkdir()
 
     for cdn in cdns:
-
+        print(f"Fetching {cdn.name}...")  # noqa T201
         _text = cdn.fetch()
 
         if cdn.name == "tailwind":
@@ -57,9 +58,16 @@ def load_deps():
         if output_path.exists():
             output_path.unlink()
 
-        with open(output_path, "wb") as f:
+        with open(output_path, "w") as f:
+            f.write(_text)
+
+        with open(output_path.with_suffix(f"{output_path.suffix}.br"), "wb") as f:
             f.write(brotli.compress(_text.encode("utf-8")))
 
+        print(f"Saved {cdn.name} to {output_path}")  # noqa T201
+
+    print("All CSS dependencies loaded!")  # noqa T201
+
 
 if __name__ == "__main__":
     load_deps()

src/typescript/index.ts

@@ -10,7 +10,11 @@ let getCookieByName = (name: string): string | undefined => {
 };
 
 let getSessionId = () => getCookieByName('X-Schorle-Session-Id');
-let getDevMode = () => getCookieByName('X-Schorle-Dev-Mode');
+let getDevMode = () => {
+  // check if meta with name schorle-dev-mode exists and return its content
+  let meta = document.querySelector('meta[name="schorle-dev-mode"]');
+  return meta ? meta.getAttribute('content') : 'false';
+};
 
 let getWsUrl = (subPath: string): string => {
   let protocol = window.location.protocol.replace('http', 'ws');

src/typescript/package.json

@@ -4,11 +4,11 @@
   "license": "MIT",
   "devDependencies": {
     "@rollup/plugin-node-resolve": "^15.2.3",
+    "@rollup/plugin-terser": "^0.4.4",
     "esbuild": "^0.20.2",
     "rollup": "^4.13.0",
     "rollup-plugin-esbuild": "^6.1.1",
     "rollup-plugin-gzip": "^3.1.2",
-    "rollup-plugin-uglify": "^6.0.4",
     "typescript": "^5.4.3"
   },
   "scripts": {

src/typescript/rollup.config.mjs

@@ -1,9 +1,9 @@
 import esbuild from 'rollup-plugin-esbuild';
 import { nodeResolve } from '@rollup/plugin-node-resolve';
-import { uglify } from 'rollup-plugin-uglify';
 import { brotliCompress } from 'zlib';
 import { promisify } from 'util';
 import gzipPlugin from 'rollup-plugin-gzip';
+import terser from '@rollup/plugin-terser';
 
 const brotliPromise = promisify(brotliCompress);
 
@@ -19,7 +19,7 @@ export default [
   },
   {
     plugins: [
-      uglify(),
+      terser(),
       gzipPlugin({
         customCompression: content => brotliPromise(Buffer.from(content)),
         fileName: '.br'