Commit `9d8fd17820`

9d8fd17820457f0c60320c9f4a8b0da1db45a6b0

parent: ddab521653

Verified · cmc ci/build: success ci/test: success ci/vuln: success

cmc <hello@cleberg.net> · 2026-09-04 01:40 UTC

web: markdown headings carry ids, and the stylesheet revalidates

goldmark was built without auto heading ids, so a .md README or wiki
page had no section links while org pages did; task-list boxes had no
styling. The 62 KB stylesheet was served with no ETag or Cache-Control
while fonts got a week. Headings now carry ids, task boxes are sized
to the prose, and the stylesheet carries a hash ETag with a day's
lifetime and answers a matching If-None-Match with 304.

Closes #132

Layout: unified · split

e2e/web_test.go +1 −1

	@@ -85,7 +85,7 @@ func TestWebUI(t *testing.T) {
85	if status != 200 \|\| !strings.Contains(body, "src/") \|\| !strings.Contains(body, "README.md") {	85	if status != 200 \|\| !strings.Contains(body, "src/") \|\| !strings.Contains(body, "README.md") {
86	t.Fatalf("repo home: %d\n%s", status, body)	86	t.Fatalf("repo home: %d\n%s", status, body)
87	}	87	}
88	if !strings.Contains(body, "<h1>hello site</h1>") \|\| !strings.Contains(body, "<em>markdown</em>") {	88	if !strings.Contains(body, "<h1 id=\"hello-site\">hello site</h1>") \|\| !strings.Contains(body, "<em>markdown</em>") {
89	t.Fatalf("README not rendered:\n%s", body)	89	t.Fatalf("README not rendered:\n%s", body)
90	}	90	}
91	for _, tab := range []string{">Issues<", ">Merge requests<"} {	91	for _, tab := range []string{">Issues<", ">Merge requests<"} {

internal/httpd/anchors_test.go added +40

@@ -0,0 +1,40 @@
	1	package httpd
	2
	3	import (
	4	"net/http"
	5	"net/http/httptest"
	6	"strings"
	7	"testing"
	8
	9	"gitbay.org/gitbay/internal/config"
	10	)
	11
	12	// Markdown headings carry ids, so a README section can be deep-linked
	13	// the way org headings already could (#132).
	14	func TestMarkdownHeadingAnchors(t *testing.T) {
	15	out := string(renderReadme("README.md", []byte("# Getting started\n\n## Two words\n\n- [ ] a task\n")))
	16	for _, want := range []string{`id="getting-started"`, `id="two-words"`, `type="checkbox"`} {
	17	if !strings.Contains(out, want) {
	18	t.Errorf("rendered markdown lacks %s:\n%s", want, out)
	19	}
	20	}
	21	}
	22
	23	// The stylesheet carries an ETag and a cache lifetime; a revalidation
	24	// with the same tag is a 304 with no body (#132).
	25	func TestStylesheetRevalidates(t *testing.T) {
	26	s := New(config.Default(), nil)
	27	first := httptest.NewRecorder()
	28	s.stylesheet(first, httptest.NewRequest("GET", "/static/style.css", nil))
	29	tag := first.Header().Get("ETag")
	30	if first.Code != 200 \|\| tag == "" \|\| first.Body.Len() == 0 \|\| !strings.Contains(first.Header().Get("Cache-Control"), "max-age") {
	31	t.Fatalf("first fetch: %d etag=%q cc=%q bytes=%d", first.Code, tag, first.Header().Get("Cache-Control"), first.Body.Len())
	32	}
	33	req := httptest.NewRequest("GET", "/static/style.css", nil)
	34	req.Header.Set("If-None-Match", tag)
	35	second := httptest.NewRecorder()
	36	s.stylesheet(second, req)
	37	if second.Code != http.StatusNotModified \|\| second.Body.Len() != 0 {
	38	t.Fatalf("revalidation: %d with %d bytes", second.Code, second.Body.Len())
	39	}
	40	}

internal/httpd/web.go +25 −2

 import (
 	"bytes"
+	"crypto/sha256"
+	"encoding/hex"
 	"errors"
 	"fmt"
 	"hash/fnv"
 	"github.com/yuin/goldmark"
 	highlighting "github.com/yuin/goldmark-highlighting/v2"
 	"github.com/yuin/goldmark/extension"
+	"github.com/yuin/goldmark/parser"
 	"gitbay.org/gitbay/internal/autolink"
 	"gitbay.org/gitbay/internal/control"
 	return strings.TrimSuffix(h, "/")
 }
+// stylesheetETag is the hash of what stylesheet serves, computed once:
+// a browser revalidates with If-None-Match and gets a 304 until a deploy
+// changes the bytes (#132).
+var stylesheetETag = func() string {
+	h := sha256.New()
+	h.Write(web.StyleCSS)
+	h.Write(chromaCSS)
+	return `"` + hex.EncodeToString(h.Sum(nil))[:16] + `"`
+}()
 func (s *Server) stylesheet(w http.ResponseWriter, r *http.Request) {
+	w.Header().Set("ETag", stylesheetETag)
+	w.Header().Set("Cache-Control", "public, max-age=86400, must-revalidate")
+	if r.Header.Get("If-None-Match") == stylesheetETag {
+		w.WriteHeader(http.StatusNotModified)
+		return
+	}
 	w.Header().Set("Content-Type", "text/css; charset=utf-8")
 	w.Write(web.StyleCSS)
 	w.Write(chromaCSS)
 // task lists) on top of CommonMark, with class-based fence highlighting
 // (the palette lives in the stylesheet, per scheme). Raw HTML is still
 // dropped.
-var markdown = goldmark.New(goldmark.WithExtensions(extension.GFM,
+// Headings carry ids so a README or wiki section can be linked to, the
-	highlighting.NewHighlighting(highlighting.WithFormatOptions(html.WithClasses(true)))))
+// way org headings already are (#132).
+var markdown = goldmark.New(
+	goldmark.WithParserOptions(parser.WithAutoHeadingID()),
+	goldmark.WithExtensions(extension.GFM,
+		highlighting.NewHighlighting(highlighting.WithFormatOptions(html.WithClasses(true)))))
 // fenceHighlight renders one code block with chroma classes, for org and
 // anything else outside goldmark. Unknown languages fall back to plain.

internal/web/static/style.css +3

 /* rendered markdown / org / html */
 .rendered { max-width: 100%; overflow-wrap: anywhere; }
+/* GFM task lists: the box sits in the line, sized to the prose. */
+.rendered li input[type="checkbox"] { width: 0.9em; height: 0.9em; margin: 0 0.35em 0 0; vertical-align: -0.05em; accent-color: var(--accent); }
+.rendered li:has(> input[type="checkbox"]) { list-style: none; margin-left: -1.2em; }
 /* line length is a reading constraint, so it applies to prose only —
    tables, code blocks and images keep the full column */
 .rendered > p,

Commit 9d8fd17820

Commit `9d8fd17820`