TODO: actually write tests lol

Packaging nodejs and ruby is an immense burden for the Rosa OS base system, and these files diff poorly.

Signed-off-by: Ophestra <cat@gensokyo.uk>

.gitignore

@@ -7,6 +7,11 @@
 
 # go generate
 /cmd/hakurei/LICENSE
+/cmd/pkgserver/.sass-cache
+/cmd/pkgserver/ui/static/*.js
+/cmd/pkgserver/ui/static/*.css*
+/cmd/pkgserver/ui/static/*.css.map
+/cmd/pkgserver/ui_test/static
 /internal/pkg/testdata/testtool
 /internal/rosa/hakurei_current.tar.gz
 

cmd/pkgserver/api.go

@@ -0,0 +1,176 @@
+package main
+
+import (
+	"encoding/json"
+	"log"
+	"net/http"
+	"net/url"
+	"path"
+	"strconv"
+	"sync"
+
+	"hakurei.app/internal/info"
+	"hakurei.app/internal/rosa"
+)
+
+// for lazy initialisation of serveInfo
+var (
+	infoPayload struct {
+		// Current package count.
+		Count int `json:"count"`
+		// Hakurei version, set at link time.
+		HakureiVersion string `json:"hakurei_version"`
+	}
+	infoPayloadOnce sync.Once
+)
+
+// handleInfo writes constant system information.
+func handleInfo(w http.ResponseWriter, _ *http.Request) {
+	infoPayloadOnce.Do(func() {
+		infoPayload.Count = int(rosa.PresetUnexportedStart)
+		infoPayload.HakureiVersion = info.Version()
+	})
+	// TODO(mae): cache entire response if no additional fields are planned
+	writeAPIPayload(w, infoPayload)
+}
+
+// newStatusHandler returns a [http.HandlerFunc] that offers status files for
+// viewing or download, if available.
+func (index *packageIndex) newStatusHandler(disposition bool) http.HandlerFunc {
+	return func(w http.ResponseWriter, r *http.Request) {
+		m, ok := index.names[path.Base(r.URL.Path)]
+		if !ok || !m.HasReport {
+			http.NotFound(w, r)
+			return
+		}
+
+		contentType := "text/plain; charset=utf-8"
+		if disposition {
+			contentType = "application/octet-stream"
+
+			// quoting like this is unsound, but okay, because metadata is hardcoded
+			contentDisposition := `attachment; filename="`
+			contentDisposition += m.Name + "-"
+			if m.Version != "" {
+				contentDisposition += m.Version + "-"
+			}
+			contentDisposition += m.ids + `.log"`
+			w.Header().Set("Content-Disposition", contentDisposition)
+		}
+		w.Header().Set("Content-Type", contentType)
+		w.Header().Set("Cache-Control", "no-cache, no-store, must-revalidate")
+		if err := func() (err error) {
+			defer index.handleAccess(&err)()
+			_, err = w.Write(m.status)
+			return
+		}(); err != nil {
+			log.Println(err)
+			http.Error(
+				w, "cannot deliver status, contact maintainers",
+				http.StatusInternalServerError,
+			)
+		}
+	}
+}
+
+// handleGet writes a slice of metadata with specified order.
+func (index *packageIndex) handleGet(w http.ResponseWriter, r *http.Request) {
+	q := r.URL.Query()
+	limit, err := strconv.Atoi(q.Get("limit"))
+	if err != nil || limit > 100 || limit < 1 {
+		http.Error(
+			w, "limit must be an integer between 1 and 100",
+			http.StatusBadRequest,
+		)
+		return
+	}
+	i, err := strconv.Atoi(q.Get("index"))
+	if err != nil || i >= len(index.sorts[0]) || i < 0 {
+		http.Error(
+			w, "index must be an integer between 0 and "+
+				strconv.Itoa(int(rosa.PresetUnexportedStart-1)),
+			http.StatusBadRequest,
+		)
+		return
+	}
+	sort, err := strconv.Atoi(q.Get("sort"))
+	if err != nil || sort >= len(index.sorts) || sort < 0 {
+		http.Error(
+			w, "sort must be an integer between 0 and "+
+				strconv.Itoa(sortOrderEnd),
+			http.StatusBadRequest,
+		)
+		return
+	}
+	values := index.sorts[sort][i:min(i+limit, len(index.sorts[sort]))]
+	writeAPIPayload(w, &struct {
+		Values []*metadata `json:"values"`
+	}{values})
+}
+
+func (index *packageIndex) handleSearch(w http.ResponseWriter, r *http.Request) {
+	q := r.URL.Query()
+	limit, err := strconv.Atoi(q.Get("limit"))
+	if err != nil || limit > 100 || limit < 1 {
+		http.Error(
+			w, "limit must be an integer between 1 and 100",
+			http.StatusBadRequest,
+		)
+		return
+	}
+	i, err := strconv.Atoi(q.Get("index"))
+	if err != nil || i >= len(index.sorts[0]) || i < 0 {
+		http.Error(
+			w, "index must be an integer between 0 and "+
+				strconv.Itoa(int(rosa.PresetUnexportedStart-1)),
+			http.StatusBadRequest,
+		)
+		return
+	}
+	search, err := url.PathUnescape(q.Get("search"))
+	if len(search) > 100 || err != nil {
+		http.Error(
+			w, "search must be a string between 0 and 100 characters long",
+			http.StatusBadRequest,
+		)
+		return
+	}
+	desc := q.Get("desc") == "true"
+	n, res, err := index.performSearchQuery(limit, i, search, desc)
+	if err != nil {
+		http.Error(w, err.Error(), http.StatusInternalServerError)
+	}
+	writeAPIPayload(w, &struct {
+		Count   int            `json:"count"`
+		Results []searchResult `json:"results"`
+	}{n, res})
+}
+
+// apiVersion is the name of the current API revision, as part of the pattern.
+const apiVersion = "v1"
+
+// registerAPI registers API handler functions.
+func (index *packageIndex) registerAPI(mux *http.ServeMux) {
+	mux.HandleFunc("GET /api/"+apiVersion+"/info", handleInfo)
+	mux.HandleFunc("GET /api/"+apiVersion+"/get", index.handleGet)
+	mux.HandleFunc("GET /api/"+apiVersion+"/search", index.handleSearch)
+	mux.HandleFunc("GET /api/"+apiVersion+"/status/", index.newStatusHandler(false))
+	mux.HandleFunc("GET /status/", index.newStatusHandler(true))
+}
+
+// writeAPIPayload sets headers common to API responses and encodes payload as
+// JSON for the response body.
+func writeAPIPayload(w http.ResponseWriter, payload any) {
+	w.Header().Set("Content-Type", "application/json; charset=utf-8")
+	w.Header().Set("Cache-Control", "no-cache, no-store, must-revalidate")
+	w.Header().Set("Pragma", "no-cache")
+	w.Header().Set("Expires", "0")
+
+	if err := json.NewEncoder(w).Encode(payload); err != nil {
+		log.Println(err)
+		http.Error(
+			w, "cannot encode payload, contact maintainers",
+			http.StatusInternalServerError,
+		)
+	}
+}

cmd/pkgserver/api_test.go

@@ -0,0 +1,183 @@
+package main
+
+import (
+	"net/http"
+	"net/http/httptest"
+	"slices"
+	"strconv"
+	"testing"
+
+	"hakurei.app/internal/info"
+	"hakurei.app/internal/rosa"
+)
+
+// prefix is prepended to every API path.
+const prefix = "/api/" + apiVersion + "/"
+
+func TestAPIInfo(t *testing.T) {
+	t.Parallel()
+
+	w := httptest.NewRecorder()
+	handleInfo(w, httptest.NewRequestWithContext(
+		t.Context(),
+		http.MethodGet,
+		prefix+"info",
+		nil,
+	))
+
+	resp := w.Result()
+	checkStatus(t, resp, http.StatusOK)
+	checkAPIHeader(t, w.Header())
+
+	checkPayload(t, resp, struct {
+		Count          int    `json:"count"`
+		HakureiVersion string `json:"hakurei_version"`
+	}{int(rosa.PresetUnexportedStart), info.Version()})
+}
+
+func TestAPIGet(t *testing.T) {
+	t.Parallel()
+	const target = prefix + "get"
+
+	index := newIndex(t)
+	newRequest := func(suffix string) *httptest.ResponseRecorder {
+		w := httptest.NewRecorder()
+		index.handleGet(w, httptest.NewRequestWithContext(
+			t.Context(),
+			http.MethodGet,
+			target+suffix,
+			nil,
+		))
+		return w
+	}
+
+	checkValidate := func(t *testing.T, suffix string, vmin, vmax int, wantErr string) {
+		t.Run("invalid", func(t *testing.T) {
+			t.Parallel()
+
+			w := newRequest("?" + suffix + "=invalid")
+			resp := w.Result()
+			checkError(t, resp, wantErr, http.StatusBadRequest)
+		})
+
+		t.Run("min", func(t *testing.T) {
+			t.Parallel()
+
+			w := newRequest("?" + suffix + "=" + strconv.Itoa(vmin-1))
+			resp := w.Result()
+			checkError(t, resp, wantErr, http.StatusBadRequest)
+
+			w = newRequest("?" + suffix + "=" + strconv.Itoa(vmin))
+			resp = w.Result()
+			checkStatus(t, resp, http.StatusOK)
+		})
+
+		t.Run("max", func(t *testing.T) {
+			t.Parallel()
+
+			w := newRequest("?" + suffix + "=" + strconv.Itoa(vmax+1))
+			resp := w.Result()
+			checkError(t, resp, wantErr, http.StatusBadRequest)
+
+			w = newRequest("?" + suffix + "=" + strconv.Itoa(vmax))
+			resp = w.Result()
+			checkStatus(t, resp, http.StatusOK)
+		})
+	}
+
+	t.Run("limit", func(t *testing.T) {
+		t.Parallel()
+		checkValidate(
+			t, "index=0&sort=0&limit", 1, 100,
+			"limit must be an integer between 1 and 100",
+		)
+	})
+
+	t.Run("index", func(t *testing.T) {
+		t.Parallel()
+		checkValidate(
+			t, "limit=1&sort=0&index", 0, int(rosa.PresetUnexportedStart-1),
+			"index must be an integer between 0 and "+strconv.Itoa(int(rosa.PresetUnexportedStart-1)),
+		)
+	})
+
+	t.Run("sort", func(t *testing.T) {
+		t.Parallel()
+		checkValidate(
+			t, "index=0&limit=1&sort", 0, int(sortOrderEnd),
+			"sort must be an integer between 0 and "+strconv.Itoa(int(sortOrderEnd)),
+		)
+	})
+
+	checkWithSuffix := func(name, suffix string, want []*metadata) {
+		t.Run(name, func(t *testing.T) {
+			t.Parallel()
+
+			w := newRequest(suffix)
+			resp := w.Result()
+			checkStatus(t, resp, http.StatusOK)
+			checkAPIHeader(t, w.Header())
+			checkPayloadFunc(t, resp, func(got *struct {
+				Count  int         `json:"count"`
+				Values []*metadata `json:"values"`
+			}) bool {
+				return got.Count == len(want) &&
+					slices.EqualFunc(got.Values, want, func(a, b *metadata) bool {
+						return (a.Version == b.Version ||
+							a.Version == rosa.Unversioned ||
+							b.Version == rosa.Unversioned) &&
+							a.HasReport == b.HasReport &&
+							a.Name == b.Name &&
+							a.Description == b.Description &&
+							a.Website == b.Website
+					})
+			})
+
+		})
+	}
+
+	checkWithSuffix("declarationAscending", "?limit=2&index=0&sort=0", []*metadata{
+		{
+			Metadata: rosa.GetMetadata(0),
+			Version:  rosa.Std.Version(0),
+		},
+		{
+			Metadata: rosa.GetMetadata(1),
+			Version:  rosa.Std.Version(1),
+		},
+	})
+	checkWithSuffix("declarationAscending offset", "?limit=3&index=5&sort=0", []*metadata{
+		{
+			Metadata: rosa.GetMetadata(5),
+			Version:  rosa.Std.Version(5),
+		},
+		{
+			Metadata: rosa.GetMetadata(6),
+			Version:  rosa.Std.Version(6),
+		},
+		{
+			Metadata: rosa.GetMetadata(7),
+			Version:  rosa.Std.Version(7),
+		},
+	})
+	checkWithSuffix("declarationDescending", "?limit=3&index=0&sort=1", []*metadata{
+		{
+			Metadata: rosa.GetMetadata(rosa.PresetUnexportedStart - 1),
+			Version:  rosa.Std.Version(rosa.PresetUnexportedStart - 1),
+		},
+		{
+			Metadata: rosa.GetMetadata(rosa.PresetUnexportedStart - 2),
+			Version:  rosa.Std.Version(rosa.PresetUnexportedStart - 2),
+		},
+		{
+			Metadata: rosa.GetMetadata(rosa.PresetUnexportedStart - 3),
+			Version:  rosa.Std.Version(rosa.PresetUnexportedStart - 3),
+		},
+	})
+	checkWithSuffix("declarationDescending offset", "?limit=1&index=37&sort=1", []*metadata{
+		{
+			Metadata: rosa.GetMetadata(rosa.PresetUnexportedStart - 38),
+			Version:  rosa.Std.Version(rosa.PresetUnexportedStart - 38),
+		},
+	})
+}

cmd/pkgserver/index.go

@@ -0,0 +1,105 @@
+package main
+
+import (
+	"cmp"
+	"errors"
+	"slices"
+	"strings"
+
+	"hakurei.app/internal/pkg"
+	"hakurei.app/internal/rosa"
+)
+
+const (
+	declarationAscending = iota
+	declarationDescending
+	nameAscending
+	nameDescending
+	sizeAscending
+	sizeDescending
+
+	sortOrderEnd = iota - 1
+)
+
+// packageIndex refers to metadata by name and various sort orders.
+type packageIndex struct {
+	sorts  [sortOrderEnd + 1][rosa.PresetUnexportedStart]*metadata
+	names  map[string]*metadata
+	search searchCache
+	// Taken from [rosa.Report] if available.
+	handleAccess func(*error) func()
+}
+
+// metadata holds [rosa.Metadata] extended with additional information.
+type metadata struct {
+	p rosa.PArtifact
+	*rosa.Metadata
+
+	// Populated via [rosa.Toolchain.Version], [rosa.Unversioned] is equivalent
+	// to the zero value. Otherwise, the zero value is invalid.
+	Version string `json:"version,omitempty"`
+	// Output data size, available if present in report.
+	Size int64 `json:"size,omitempty"`
+	// Whether the underlying [pkg.Artifact] is present in the report.
+	HasReport bool `json:"report"`
+
+	// Ident string encoded ahead of time.
+	ids string
+	// Backed by [rosa.Report], access must be prepared by HandleAccess.
+	status []byte
+}
+
+// populate deterministically populates packageIndex, optionally with a report.
+func (index *packageIndex) populate(cache *pkg.Cache, report *rosa.Report) (err error) {
+	if report != nil {
+		defer report.HandleAccess(&err)()
+		index.handleAccess = report.HandleAccess
+	}
+
+	var work [rosa.PresetUnexportedStart]*metadata
+	index.names = make(map[string]*metadata)
+	for p := range rosa.PresetUnexportedStart {
+		m := metadata{
+			p: p,
+
+			Metadata: rosa.GetMetadata(p),
+			Version:  rosa.Std.Version(p),
+		}
+		if m.Version == "" {
+			return errors.New("invalid version from " + m.Name)
+		}
+		if m.Version == rosa.Unversioned {
+			m.Version = ""
+		}
+
+		if cache != nil && report != nil {
+			id := cache.Ident(rosa.Std.Load(p))
+			m.ids = pkg.Encode(id.Value())
+			m.status, m.Size = report.ArtifactOf(id)
+			m.HasReport = m.Size >= 0
+		}
+
+		work[p] = &m
+		index.names[m.Name] = &m
+	}
+
+	index.sorts[declarationAscending] = work
+	index.sorts[declarationDescending] = work
+	slices.Reverse(index.sorts[declarationDescending][:])
+
+	index.sorts[nameAscending] = work
+	slices.SortFunc(index.sorts[nameAscending][:], func(a, b *metadata) int {
+		return strings.Compare(a.Name, b.Name)
+	})
+	index.sorts[nameDescending] = index.sorts[nameAscending]
+	slices.Reverse(index.sorts[nameDescending][:])
+
+	index.sorts[sizeAscending] = work
+	slices.SortFunc(index.sorts[sizeAscending][:], func(a, b *metadata) int {
+		return cmp.Compare(a.Size, b.Size)
+	})
+	index.sorts[sizeDescending] = index.sorts[sizeAscending]
+	slices.Reverse(index.sorts[sizeDescending][:])
+
+	return
+}

cmd/pkgserver/main.go

@@ -0,0 +1,115 @@
+package main
+
+import (
+	"context"
+	"errors"
+	"log"
+	"net/http"
+	"os"
+	"os/signal"
+	"syscall"
+	"time"
+
+	"hakurei.app/command"
+	"hakurei.app/container/check"
+	"hakurei.app/internal/pkg"
+	"hakurei.app/internal/rosa"
+	"hakurei.app/message"
+)
+
+const shutdownTimeout = 15 * time.Second
+
+func main() {
+	log.SetFlags(0)
+	log.SetPrefix("pkgserver: ")
+
+	var (
+		flagBaseDir string
+		flagAddr    string
+	)
+
+	ctx, stop := signal.NotifyContext(context.Background(), syscall.SIGINT, syscall.SIGTERM, syscall.SIGHUP)
+	defer stop()
+	msg := message.New(log.Default())
+
+	c := command.New(os.Stderr, log.Printf, "pkgserver", func(args []string) error {
+		var (
+			cache  *pkg.Cache
+			report *rosa.Report
+		)
+		switch len(args) {
+		case 0:
+			break
+
+		case 1:
+			baseDir, err := check.NewAbs(flagBaseDir)
+			if err != nil {
+				return err
+			}
+
+			cache, err = pkg.Open(ctx, msg, 0, baseDir)
+			if err != nil {
+				return err
+			}
+			defer cache.Close()
+
+			report, err = rosa.OpenReport(args[0])
+			if err != nil {
+				return err
+			}
+
+		default:
+			return errors.New("pkgserver requires 1 argument")
+
+		}
+
+		var index packageIndex
+		index.search = make(searchCache)
+		if err := index.populate(cache, report); err != nil {
+			return err
+		}
+		ticker := time.NewTicker(1 * time.Minute)
+		go func() {
+			for {
+				select {
+				case <-ctx.Done():
+					ticker.Stop()
+					return
+				case <-ticker.C:
+					index.search.clean()
+				}
+			}
+		}()
+		var mux http.ServeMux
+		uiRoutes(&mux)
+		testUIRoutes(&mux)
+		index.registerAPI(&mux)
+		server := http.Server{
+			Addr:    flagAddr,
+			Handler: &mux,
+		}
+		go func() {
+			<-ctx.Done()
+			c, cancel := context.WithTimeout(context.Background(), shutdownTimeout)
+			defer cancel()
+			if err := server.Shutdown(c); err != nil {
+				log.Fatal(err)
+			}
+		}()
+		return server.ListenAndServe()
+	}).Flag(
+		&flagBaseDir,
+		"b", command.StringFlag(""),
+		"base directory for cache",
+	).Flag(
+		&flagAddr,
+		"addr", command.StringFlag(":8067"),
+		"TCP network address to listen on",
+	)
+	c.MustParse(os.Args[1:], func(err error) {
+		if errors.Is(err, http.ErrServerClosed) {
+			os.Exit(0)
+		}
+		log.Fatal(err)
+	})
+}

cmd/pkgserver/main_test.go

@@ -0,0 +1,96 @@
+package main
+
+import (
+	"bytes"
+	"encoding/json"
+	"fmt"
+	"io"
+	"net/http"
+	"reflect"
+	"testing"
+)
+
+// newIndex returns the address of a newly populated packageIndex.
+func newIndex(t *testing.T) *packageIndex {
+	t.Helper()
+
+	var index packageIndex
+	if err := index.populate(nil, nil); err != nil {
+		t.Fatalf("populate: error = %v", err)
+	}
+	return &index
+}
+
+// checkStatus checks response status code.
+func checkStatus(t *testing.T, resp *http.Response, want int) {
+	t.Helper()
+
+	if resp.StatusCode != want {
+		t.Errorf(
+			"StatusCode: %s, want %s",
+			http.StatusText(resp.StatusCode),
+			http.StatusText(want),
+		)
+	}
+}
+
+// checkHeader checks the value of a header entry.
+func checkHeader(t *testing.T, h http.Header, key, want string) {
+	t.Helper()
+
+	if got := h.Get(key); got != want {
+		t.Errorf("%s: %q, want %q", key, got, want)
+	}
+}
+
+// checkAPIHeader checks common entries set for API endpoints.
+func checkAPIHeader(t *testing.T, h http.Header) {
+	t.Helper()
+
+	checkHeader(t, h, "Content-Type", "application/json; charset=utf-8")
+	checkHeader(t, h, "Cache-Control", "no-cache, no-store, must-revalidate")
+	checkHeader(t, h, "Pragma", "no-cache")
+	checkHeader(t, h, "Expires", "0")
+}
+
+// checkPayloadFunc checks the JSON response of an API endpoint by passing it to f.
+func checkPayloadFunc[T any](
+	t *testing.T,
+	resp *http.Response,
+	f func(got *T) bool,
+) {
+	t.Helper()
+
+	var got T
+	r := io.Reader(resp.Body)
+	if testing.Verbose() {
+		var buf bytes.Buffer
+		r = io.TeeReader(r, &buf)
+		defer func() { t.Helper(); t.Log(buf.String()) }()
+	}
+	if err := json.NewDecoder(r).Decode(&got); err != nil {
+		t.Fatalf("Decode: error = %v", err)
+	}
+
+	if !f(&got) {
+		t.Errorf("Body: %#v", got)
+	}
+}
+
+// checkPayload checks the JSON response of an API endpoint.
+func checkPayload[T any](t *testing.T, resp *http.Response, want T) {
+	t.Helper()
+
+	checkPayloadFunc(t, resp, func(got *T) bool {
+		return reflect.DeepEqual(got, &want)
+	})
+}
+
+func checkError(t *testing.T, resp *http.Response, error string, code int) {
+	t.Helper()
+
+	checkStatus(t, resp, code)
+	if got, _ := io.ReadAll(resp.Body); string(got) != fmt.Sprintln(error) {
+		t.Errorf("Body: %q, want %q", string(got), error)
+	}
+}

cmd/pkgserver/search.go

@@ -0,0 +1,77 @@
+package main
+
+import (
+	"cmp"
+	"maps"
+	"regexp"
+	"slices"
+	"time"
+)
+
+type searchCache map[string]searchCacheEntry
+type searchResult struct {
+	NameIndices [][]int `json:"name_matches"`
+	DescIndices [][]int `json:"desc_matches,omitempty"`
+	Score       float64 `json:"score"`
+	*metadata
+}
+type searchCacheEntry struct {
+	query   string
+	results []searchResult
+	expiry  time.Time
+}
+
+func (index *packageIndex) performSearchQuery(limit int, i int, search string, desc bool) (int, []searchResult, error) {
+	entry, ok := index.search[search]
+	if ok {
+		return len(entry.results), entry.results[i:min(i+limit, len(entry.results))], nil
+	}
+
+	regex, err := regexp.Compile(search)
+	if err != nil {
+		return 0, make([]searchResult, 0), err
+	}
+	res := make([]searchResult, 0)
+	for p := range maps.Values(index.names) {
+		nameIndices := regex.FindAllIndex([]byte(p.Name), -1)
+		var descIndices [][]int = nil
+		if desc {
+			descIndices = regex.FindAllIndex([]byte(p.Description), -1)
+		}
+		if nameIndices == nil && descIndices == nil {
+			continue
+		}
+		score := float64(indexsum(nameIndices)) / (float64(len(nameIndices)) + 1)
+		if desc {
+			score += float64(indexsum(descIndices)) / (float64(len(descIndices)) + 1) / 10.0
+		}
+		res = append(res, searchResult{
+			NameIndices: nameIndices,
+			DescIndices: descIndices,
+			Score:       score,
+			metadata:    p,
+		})
+	}
+	slices.SortFunc(res[:], func(a, b searchResult) int { return -cmp.Compare(a.Score, b.Score) })
+	expiry := time.Now().Add(1 * time.Minute)
+	entry = searchCacheEntry{
+		query:   search,
+		results: res,
+		expiry:  expiry,
+	}
+	index.search[search] = entry
+
+	return len(res), res[i:min(i+limit, len(entry.results))], nil
+}
+func (s *searchCache) clean() {
+	maps.DeleteFunc(*s, func(_ string, v searchCacheEntry) bool {
+		return v.expiry.Before(time.Now())
+	})
+}
+func indexsum(in [][]int) int {
+	sum := 0
+	for i := 0; i < len(in); i++ {
+		sum += in[i][1] - in[i][0]
+	}
+	return sum
+}

cmd/pkgserver/test_ui.go

@@ -0,0 +1,35 @@
+//go:build frontend && frontend_test
+
+package main
+
+import (
+	"embed"
+	"io/fs"
+	"net/http"
+)
+
+// Always remove ui_test/ui; if the previous tsc run failed, the rm never
+// executes.
+
+//go:generate sh -c "rm -r ui_test/ui/ 2>/dev/null || true"
+//go:generate mkdir ui_test/ui
+//go:generate sh -c "cp ui/static/*.ts ui_test/ui/"
+//go:generate tsc --outDir ui_test/static -p ui_test
+//go:generate rm -r ui_test/ui/
+//go:generate sass ui_test/lib/ui.scss ui_test/static/style.css
+//go:generate cp ui_test/lib/ui.html ui_test/static/index.html
+//go:generate sh -c "cd ui_test/lib && cp *.svg ../static/"
+//go:embed ui_test/static
+var _staticTest embed.FS
+
+var staticTest = func() fs.FS {
+	if f, err := fs.Sub(_staticTest, "ui_test/static"); err != nil {
+		panic(err)
+	} else {
+		return f
+	}
+}()
+
+func testUIRoutes(mux *http.ServeMux) {
+	mux.Handle("GET /test/", http.StripPrefix("/test", http.FileServer(http.FS(staticTest))))
+}

cmd/pkgserver/test_ui_stub.go

@@ -0,0 +1,7 @@
+//go:build !(frontend && frontend_test)
+
+package main
+
+import "net/http"
+
+func testUIRoutes(mux *http.ServeMux) {}

cmd/pkgserver/ui.go

@@ -0,0 +1,38 @@
+package main
+
+import "net/http"
+
+func serveWebUI(w http.ResponseWriter, r *http.Request) {
+	w.Header().Set("Cache-Control", "no-cache, no-store, must-revalidate")
+	w.Header().Set("Pragma", "no-cache")
+	w.Header().Set("Expires", "0")
+	w.Header().Set("X-Content-Type-Options", "nosniff")
+	w.Header().Set("X-XSS-Protection", "1")
+	w.Header().Set("X-Frame-Options", "DENY")
+
+	http.ServeFileFS(w, r, content, "ui/index.html")
+}
+func serveStaticContent(w http.ResponseWriter, r *http.Request) {
+	switch r.URL.Path {
+	case "/static/style.css":
+		darkTheme := r.CookiesNamed("dark_theme")
+		if len(darkTheme) > 0 && darkTheme[0].Value == "true" {
+			http.ServeFileFS(w, r, content, "ui/static/dark.css")
+		} else {
+			http.ServeFileFS(w, r, content, "ui/static/light.css")
+		}
+	case "/favicon.ico":
+		http.ServeFileFS(w, r, content, "ui/static/favicon.ico")
+	case "/static/index.js":
+		http.ServeFileFS(w, r, content, "ui/static/index.js")
+	default:
+		http.NotFound(w, r)
+
+	}
+}
+
+func uiRoutes(mux *http.ServeMux) {
+	mux.HandleFunc("GET /{$}", serveWebUI)
+	mux.HandleFunc("GET /favicon.ico", serveStaticContent)
+	mux.HandleFunc("GET /static/", serveStaticContent)
+}

cmd/pkgserver/ui/index.html

@@ -0,0 +1,35 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <link rel="stylesheet" href="static/style.css">
+    <title>Hakurei PkgServer</title>
+    <script src="static/index.js"></script>
+</head>
+<body>
+<h1>Hakurei PkgServer</h1>
+
+<table id="pkg-list">
+    <tr><td>Loading...</td></tr>
+</table>
+<p>Showing entries <span id="entry-counter"></span>.</p>
+<span class="bottom-nav"><a href="javascript:prevPage()">&laquo; Previous</a> <span id="page-number">1</span> <a href="javascript:nextPage()">Next &raquo;</a></span>
+<span><label for="count">Entries per page: </label><select name="count" id="count">
+    <option value="10">10</option>
+    <option value="20">20</option>
+    <option value="30">30</option>
+    <option value="50">50</option>
+</select></span>
+<span><label for="sort">Sort by: </label><select name="sort" id="sort">
+    <option value="0">Definition (ascending)</option>
+    <option value="1">Definition (descending)</option>
+    <option value="2">Name (ascending)</option>
+    <option value="3">Name (descending)</option>
+    <option value="4">Size (ascending)</option>
+    <option value="5">Size (descending)</option>
+</select></span>
+</body>
+<footer>
+    <p>&copy;<a href="https://hakurei.app/">Hakurei</a> (<span id="hakurei-version">unknown</span>). Licensed under the MIT license.</p>
+</footer>
+</html>

cmd/pkgserver/ui/static/dark.scss

@@ -0,0 +1,6 @@
+@use 'common';
+
+html {
+  background-color: #2c2c2c;
+  color: ghostwhite;
+}

cmd/pkgserver/ui/static/index.ts

@@ -0,0 +1,161 @@
+function assertGetElementById(id: string): HTMLElement {
+    let elem = document.getElementById(id)
+    if(elem == null) throw new ReferenceError(`element with ID '${id}' missing from DOM`)
+    return elem
+}
+
+interface PackageIndexEntry {
+    name: string
+    size: number | null
+    description: string | null
+    website: string | null
+    version: string | null
+    report:  boolean
+}
+function toHTML(entry: PackageIndexEntry): HTMLTableRowElement {
+    let v = entry.version != null ? `<span>${escapeHtml(entry.version)}</span>` : ""
+    let s = entry.size != null ? `<p>Size: ${toByteSizeString(entry.size)} (${entry.size})</p>` : ""
+    let d = entry.description != null ? `<p>${escapeHtml(entry.description)}</p>` : ""
+    let w = entry.website != null ? `<a href="${encodeURI(entry.website)}">Website</a>` : ""
+    let r = entry.report ? `Log (<a href=\"${encodeURI('/api/v1/status/' + entry.name)}\">View</a> | <a href=\"${encodeURI('/status/' + entry.name)}\">Download</a>)` : ""
+    let row = <HTMLTableRowElement>(document.createElement('tr'))
+    row.innerHTML = `<td>
+            <h2>${escapeHtml(entry.name)} ${v}</h2>
+            ${d}
+            ${s}
+            ${w}
+            ${r}
+        </td>`
+    return row
+}
+
+function toByteSizeString(bytes: number): string {
+    if(bytes == null || bytes < 1024) return `${bytes}B`
+    if(bytes < Math.pow(1024, 2)) return `${(bytes/1024).toFixed(2)}kiB`
+    if(bytes < Math.pow(1024, 3)) return `${(bytes/Math.pow(1024, 2)).toFixed(2)}MiB`
+    if(bytes < Math.pow(1024, 4)) return `${(bytes/Math.pow(1024, 3)).toFixed(2)}GiB`
+    if(bytes < Math.pow(1024, 5)) return `${(bytes/Math.pow(1024, 4)).toFixed(2)}TiB`
+    return "not only is it big, it's large"
+}
+
+const API_VERSION = 1
+const ENDPOINT = `/api/v${API_VERSION}`
+interface InfoPayload {
+    count: number
+    hakurei_version: string
+}
+
+async function infoRequest(): Promise<InfoPayload> {
+    const res = await fetch(`${ENDPOINT}/info`)
+    const payload = await res.json()
+    return payload
+}
+interface GetPayload {
+    values: PackageIndexEntry[]
+}
+
+enum SortOrders {
+    DeclarationAscending,
+    DeclarationDescending,
+    NameAscending,
+    NameDescending
+}
+async function getRequest(limit: number, index: number, sort: SortOrders): Promise<GetPayload> {
+    const res = await fetch(`${ENDPOINT}/get?limit=${limit}&index=${index}&sort=${sort.valueOf()}`)
+    const payload = await res.json()
+    return payload
+}
+class State {
+    entriesPerPage: number = 10
+    entryIndex: number = 0
+    maxEntries: number = 0
+    sort: SortOrders = SortOrders.DeclarationAscending
+
+    getEntriesPerPage(): number {
+        return this.entriesPerPage
+    }
+    setEntriesPerPage(entriesPerPage: number) {
+        this.entriesPerPage = entriesPerPage
+        this.setEntryIndex(Math.floor(this.getEntryIndex() / entriesPerPage) * entriesPerPage)
+    }
+    getEntryIndex(): number {
+        return this.entryIndex
+    }
+    setEntryIndex(entryIndex: number) {
+        this.entryIndex = entryIndex
+        this.updatePage()
+        this.updateRange()
+        this.updateListings()
+    }
+    getMaxEntries(): number {
+        return this.maxEntries
+    }
+    setMaxEntries(max: number) {
+        this.maxEntries = max
+    }
+    getSortOrder(): SortOrders {
+        return this.sort
+    }
+    setSortOrder(sortOrder: SortOrders) {
+        this.sort = sortOrder
+        this.setEntryIndex(0)
+    }
+    updatePage() {
+        let page = Math.ceil(((this.getEntryIndex() + this.getEntriesPerPage()) - 1) / this.getEntriesPerPage())
+        assertGetElementById("page-number").innerText = String(page)
+    }
+    updateRange() {
+        let max = Math.min(this.getEntryIndex() + this.getEntriesPerPage(), this.getMaxEntries())
+        assertGetElementById("entry-counter").innerText = `${this.getEntryIndex() + 1}-${max} of ${this.getMaxEntries()}`
+    }
+    updateListings() {
+        getRequest(this.getEntriesPerPage(), this.getEntryIndex(), this.getSortOrder())
+            .then(res => {
+                let table = assertGetElementById("pkg-list")
+                table.innerHTML = ''
+                res.values.forEach((row) => {
+                    table.appendChild(toHTML(row))
+                })
+            })
+    }
+
+}
+
+let STATE: State
+
+function prevPage() {
+    let index = STATE.getEntryIndex()
+    STATE.setEntryIndex(Math.max(0, index - STATE.getEntriesPerPage()))
+}
+function nextPage() {
+    let index = STATE.getEntryIndex()
+    STATE.setEntryIndex(Math.min((Math.ceil(STATE.getMaxEntries() / STATE.getEntriesPerPage()) * STATE.getEntriesPerPage()) - STATE.getEntriesPerPage(), index + STATE.getEntriesPerPage()))
+}
+
+function escapeHtml(str: string): string {
+    if(str === undefined) return ""
+    return str
+        .replace(/&/g, '&amp;')
+        .replace(/</g, '&lt;')
+        .replace(/>/g, '&gt;')
+        .replace(/"/g, '&quot;')
+        .replace(/'/g, '&apos;')
+}
+
+document.addEventListener("DOMContentLoaded", () => {
+    STATE = new State()
+    infoRequest()
+        .then(res => {
+            STATE.setMaxEntries(res.count)
+            assertGetElementById("hakurei-version").innerText = res.hakurei_version
+            STATE.updateRange()
+            STATE.updateListings()
+        })
+
+    assertGetElementById("count").addEventListener("change", (event) => {
+        STATE.setEntriesPerPage(parseInt((event.target as HTMLSelectElement).value))
+    })
+    assertGetElementById("sort").addEventListener("change", (event) => {
+        STATE.setSortOrder(parseInt((event.target as HTMLSelectElement).value))
+    })
+})

cmd/pkgserver/ui/static/light.scss

@@ -0,0 +1,6 @@
+@use 'common';
+
+html {
+  background-color: #d3d3d3;
+  color: black;
+}

cmd/pkgserver/ui/static/tsconfig.json

@@ -0,0 +1,6 @@
+{
+  "compilerOptions": {
+    "strict": true,
+    "target": "ES2024"
+  }
+}

cmd/pkgserver/ui_full.go

@@ -0,0 +1,9 @@
+//go:build frontend
+
+package main
+
+import "embed"
+
+//go:generate sh -c "sass ui/static/dark.scss ui/static/dark.css && sass ui/static/light.scss ui/static/light.css && tsc -p ui/static"
+//go:embed ui/*
+var content embed.FS

cmd/pkgserver/ui_stub.go

@@ -0,0 +1,7 @@
+//go:build !frontend
+
+package main
+
+import "testing/fstest"
+
+var content fstest.MapFS

cmd/pkgserver/ui_test/all_tests.ts

@@ -0,0 +1,2 @@
+// Import all test files to register their test suites.
+import "./index_test.js";

cmd/pkgserver/ui_test/lib/cli.ts

@@ -0,0 +1,48 @@
+#!/usr/bin/env node
+
+// Many editors have terminal emulators built in, so running tests with NodeJS
+// provides faster iteration, especially for those acclimated to test-driven
+// development.
+
+import "../all_tests.js";
+import { StreamReporter, GLOBAL_REGISTRAR } from "./test.js";
+
+// TypeScript doesn't like process and Deno as their type definitions aren't
+// installed, but doesn't seem to complain if they're accessed through
+// globalThis.
+const process: any = (globalThis as any).process;
+const Deno: any = (globalThis as any).Deno;
+
+function getArgs(): string[] {
+    if (process) {
+        const [runtime, program, ...args] = process.argv;
+        return args;
+    }
+    if (Deno) return Deno.args;
+    return [];
+}
+
+function exit(code?: number): never {
+    if (Deno) Deno.exit(code);
+    if (process) process.exit(code);
+    throw `exited with code ${code ?? 0}`;
+}
+
+const args = getArgs();
+let verbose = false;
+if (args.length > 1) {
+    console.error("Too many arguments");
+    exit(1);
+}
+if (args.length === 1) {
+    if (args[0] === "-v" || args[0] === "--verbose" || args[0] === "-verbose") {
+        verbose = true;
+    } else if (args[0] !== "--") {
+        console.error(`Unknown argument '${args[0]}'`);
+        exit(1);
+    }
+}
+
+let reporter = new StreamReporter({ writeln: console.log }, verbose);
+GLOBAL_REGISTRAR.run(reporter);
+exit(reporter.succeeded() ? 0 : 1);

cmd/pkgserver/ui_test/lib/failure-closed.svg

@@ -0,0 +1,13 @@
+<?xml version="1.0"?>
+<!-- See failure-open.svg for an explanation of the view box dimensions. -->
+<svg xmlns="http://www.w3.org/2000/svg" width="20" viewBox="-20,-20 160 130">
+    <!-- This triangle should match success-closed.svg, fill and stroke color notwithstanding. -->
+    <polygon points="0,0 100,50 0,100" fill="red" stroke="red" stroke-width="15" stroke-linejoin="round"/>
+    <!--
+     ! y-coordinates go before x-coordinates here to highlight the difference
+     ! (or, lack thereof) between these numbers and the ones in failure-open.svg;
+     ! try a textual diff. Make sure to keep the numbers in sync!
+     -->
+    <line y1="30" x1="10" y2="70" x2="50" stroke="white" stroke-width="16"/>
+    <line y1="30" x1="50" y2="70" x2="10" stroke="white" stroke-width="16"/>
+</svg>

cmd/pkgserver/ui_test/lib/failure-open.svg

@@ -0,0 +1,35 @@
+<?xml version="1.0"?>
+<!--
+ ! This view box is a bit weird: the strokes assume they're working in a view
+ ! box that spans from the (0,0) to (100,100), and indeed that is convenient
+ ! conceptualizing the strokes, but the stroke itself has a considerable width
+ ! that gets clipped by restrictive view box dimensions. Hence, the view is
+ ! shifted from (0,0)–(100,100) to (-20,-20)–(120,120), to make room for the
+ ! clipped stroke, while leaving behind an illusion of working in a view box
+ ! spanning from (0,0) to (100,100).
+ !
+ ! However, the resulting SVG is too close to the summary text, and CSS
+ ! properties to add padding do not seem to work with `content:` (likely because
+ ! they're anonymous replaced elements); thus, the width of the view is
+ ! increased considerably to provide padding in the SVG itself, while leaving
+ ! the strokes oblivious.
+ !
+ ! It gets worse: the summary text isn't vertically aligned with the icon! As
+ ! a flexbox cannot be used in a summary to align the marker with the text, the
+ ! simplest and most effective solution is to reduce the height of the view box
+ ! from 140 to 130, thereby removing some of the bottom padding present.
+ !
+ ! All six SVGs use the same view box (and indeed, they refer to this comment)
+ ! so that they all appear to be the same size and position relative to each
+ ! other on the DOM—indeed, the view box dimensions, alongside the width,
+ ! directly control their placement on the DOM.
+ !
+ ! TL;DR: CSS is janky, overflow is weird, and SVG is awesome!
+ -->
+<svg xmlns="http://www.w3.org/2000/svg" width="20" viewBox="-20,-20 160 130">
+    <!-- This triangle should match success-open.svg, fill and stroke color notwithstanding. -->
+    <polygon points="0,0 100,0 50,100" fill="red" stroke="red" stroke-width="15" stroke-linejoin="round"/>
+    <!-- See the comment in failure-closed.svg before modifying this. -->
+    <line x1="30" y1="10" x2="70" y2="50" stroke="white" stroke-width="16"/>
+    <line x1="30" y1="50" x2="70" y2="10" stroke="white" stroke-width="16"/>
+</svg>

cmd/pkgserver/ui_test/lib/go_test_entrypoint.ts

@@ -0,0 +1,3 @@
+import "../all_tests.js";
+import { GoTestReporter, GLOBAL_REGISTRAR } from "./test.js";
+GLOBAL_REGISTRAR.run(new GoTestReporter());

cmd/pkgserver/ui_test/lib/skip-closed.svg

@@ -0,0 +1,21 @@
+<?xml version="1.0"?>
+<!-- See failure-open.svg for an explanation of the view box dimensions. -->
+<svg xmlns="http://www.w3.org/2000/svg" width="20" viewBox="-20,-20 160 130">
+    <!-- This triangle should match success-closed.svg, fill and stroke color notwithstanding. -->
+    <polygon points="0,0 100,50 0,100" fill="blue" stroke="blue" stroke-width="15" stroke-linejoin="round"/>
+    <!--
+     ! This path is extremely similar to the one in skip-open.svg; before
+     ! making minor modifications, diff the two to understand how they should
+     ! remain in sync.
+     -->
+    <path
+        d="M 50,50
+           A 23,23 270,1,1 30,30
+           l -10,20
+           m 10,-20
+           l -20,-10"
+        fill="none"
+        stroke="white"
+        stroke-width="12"
+        stroke-linejoin="round"/>
+</svg>

cmd/pkgserver/ui_test/lib/skip-open.svg

@@ -0,0 +1,21 @@
+<?xml version="1.0"?>
+<!-- See failure-open.svg for an explanation of the view box dimensions. -->
+<svg xmlns="http://www.w3.org/2000/svg" width="20" viewBox="-20,-20 160 130">
+    <!-- This triangle should match success-open.svg, fill and stroke color notwithstanding. -->
+    <polygon points="0,0 100,0 50,100" fill="blue" stroke="blue" stroke-width="15" stroke-linejoin="round"/>
+    <!--
+     ! This path is extremely similar to the one in skip-closed.svg; before
+     ! making minor modifications, diff the two to understand how they should
+     ! remain in sync.
+     -->
+    <path
+        d="M 50,50
+           A 23,23 270,1,1 70,30
+           l 10,-20
+           m -10,20
+           l -20,-10"
+        fill="none"
+        stroke="white"
+        stroke-width="12"
+        stroke-linejoin="round"/>
+</svg>

cmd/pkgserver/ui_test/lib/success-closed.svg

@@ -0,0 +1,16 @@
+<?xml version="1.0"?>
+<!-- See failure-open.svg for an explanation of the view box dimensions. -->
+<svg xmlns="http://www.w3.org/2000/svg" width="20" viewBox="-20,-20 160 130">
+    <style>
+    .adaptive-stroke {
+        stroke: black;
+    }
+    @media (prefers-color-scheme: dark) {
+        .adaptive-stroke {
+            stroke: ghostwhite;
+        }
+    }
+    </style>
+    <!-- When updating this triangle, also update the other five SVGs. -->
+    <polygon points="0,0 100,50 0,100" fill="none" class="adaptive-stroke" stroke-width="15" stroke-linejoin="round"/>
+</svg>

cmd/pkgserver/ui_test/lib/success-open.svg

@@ -0,0 +1,16 @@
+<?xml version="1.0"?>
+<!-- See failure-open.svg for an explanation of the view box dimensions. -->
+<svg xmlns="http://www.w3.org/2000/svg" width="20" viewBox="-20,-20 160 130">
+    <style>
+    .adaptive-stroke {
+        stroke: black;
+    }
+    @media (prefers-color-scheme: dark) {
+        .adaptive-stroke {
+            stroke: ghostwhite;
+        }
+    }
+    </style>
+    <!-- When updating this triangle, also update the other five SVGs. -->
+    <polygon points="0,0 100,0 50,100" fill="none" class="adaptive-stroke" stroke-width="15" stroke-linejoin="round"/>
+</svg>

cmd/pkgserver/ui_test/lib/test.ts

@@ -0,0 +1,403 @@
+// =============================================================================
+// DSL
+
+type TestTree = TestGroup | Test;
+type TestGroup = { name: string; children: TestTree[] };
+type Test = { name: string; test: (t: TestController) => void };
+
+export class TestRegistrar {
+    #suites: TestGroup[];
+
+    constructor() {
+        this.#suites = [];
+    }
+
+    suite(name: string, children: TestTree[]) {
+        checkDuplicates(name, children);
+        this.#suites.push({ name, children });
+    }
+
+    run(reporter: Reporter) {
+        reporter.register(this.#suites);
+        for (const suite of this.#suites) {
+            for (const c of suite.children) runTests(reporter, [suite.name], c);
+        }
+        reporter.finalize();
+    }
+}
+
+export let GLOBAL_REGISTRAR = new TestRegistrar();
+
+// Register a suite in the global registrar.
+export function suite(name: string, children: TestTree[]) {
+    GLOBAL_REGISTRAR.suite(name, children);
+}
+
+export function group(name: string, children: TestTree[]): TestTree {
+    checkDuplicates(name, children);
+    return { name, children };
+}
+export const context = group;
+export const describe = group;
+
+export function test(name: string, test: (t: TestController) => void): TestTree {
+    return { name, test };
+}
+
+function checkDuplicates(parent: string, names: { name: string }[]) {
+    let seen = new Set<string>();
+    for (const { name } of names) {
+        if (seen.has(name)) {
+            throw new RangeError(`duplicate name '${name}' in '${parent}'`);
+        }
+        seen.add(name);
+    }
+}
+
+export type TestState = "success" | "failure" | "skip";
+
+class AbortSentinel {}
+
+export class TestController {
+    #state: TestState;
+    logs: string[];
+
+    constructor() {
+        this.#state = "success";
+        this.logs = [];
+    }
+
+    getState(): TestState {
+        return this.#state;
+    }
+
+    fail() {
+        this.#state = "failure";
+    }
+
+    failed(): boolean {
+        return this.#state === "failure";
+    }
+
+    failNow(): never {
+        this.fail();
+        throw new AbortSentinel();
+    }
+
+    log(message: string) {
+        this.logs.push(message);
+    }
+
+    error(message: string) {
+        this.log(message);
+        this.fail();
+    }
+
+    fatal(message: string): never {
+        this.log(message);
+        this.failNow();
+    }
+
+    skip(message?: string): never {
+        if (message != null) this.log(message);
+        if (this.#state !== "failure") this.#state = "skip";
+        throw new AbortSentinel();
+    }
+
+    skipped(): boolean {
+        return this.#state === "skip";
+    }
+}
+
+// =============================================================================
+// Execution
+
+export interface TestResult {
+    state: TestState;
+    logs: string[];
+}
+
+function runTests(reporter: Reporter, parents: string[], node: TestTree) {
+    const path = [...parents, node.name];
+    if ("children" in node) {
+        for (const c of node.children) runTests(reporter, path, c);
+        return;
+    }
+    let controller = new TestController();
+    try {
+        node.test(controller);
+    } catch (e) {
+        if (!(e instanceof AbortSentinel)) {
+            controller.error(extractExceptionString(e));
+        }
+    }
+    reporter.update(path, { state: controller.getState(), logs: controller.logs });
+}
+
+function extractExceptionString(e: any): string {
+    // String() instead of .toString() as null and undefined don't have
+    // properties.
+    const s = String(e);
+    if (!(e instanceof Error && e.stack)) return s;
+    // v8 (Chromium, NodeJS) includes the error message, while Firefox and
+    // WebKit do not.
+    if (e.stack.startsWith(s)) return e.stack;
+    return `${s}\n${e.stack}`;
+}
+
+// =============================================================================
+// Reporting
+
+export interface Reporter {
+    register(suites: TestGroup[]): void;
+    update(path: string[], result: TestResult): void;
+    finalize(): void;
+}
+
+export class NoOpReporter implements Reporter {
+    suites: TestGroup[];
+    results: ({ path: string[] } & TestResult)[];
+    finalized: boolean;
+
+    constructor() {
+        this.suites = [];
+        this.results = [];
+        this.finalized = false;
+    }
+
+    register(suites: TestGroup[]) {
+        this.suites = suites;
+    }
+
+    update(path: string[], result: TestResult) {
+        this.results.push({ path, ...result });
+    }
+
+    finalize() {
+        this.finalized = true;
+    }
+}
+
+export interface Stream {
+    writeln(s: string): void;
+}
+
+const SEP = " ❯ ";
+
+export class StreamReporter implements Reporter {
+    stream: Stream;
+    verbose: boolean;
+    #successes: ({ path: string[] } & TestResult)[];
+    #failures: ({ path: string[] } & TestResult)[];
+    #skips: ({ path: string[] } & TestResult)[];
+
+    constructor(stream: Stream, verbose: boolean = false) {
+        this.stream = stream;
+        this.verbose = verbose;
+        this.#successes = [];
+        this.#failures = [];
+        this.#skips = [];
+    }
+
+    succeeded(): boolean {
+        return this.#successes.length > 0 && this.#failures.length === 0;
+    }
+
+    register(suites: TestGroup[]) {}
+
+    update(path: string[], result: TestResult) {
+        if (path.length === 0) throw new RangeError("path is empty");
+        const pathStr = path.join(SEP);
+        switch (result.state) {
+        case "success":
+            this.#successes.push({ path, ...result });
+            if (this.verbose) this.stream.writeln(`✅️ ${pathStr}`);
+            break;
+        case "failure":
+            this.#failures.push({ path, ...result });
+            this.stream.writeln(`⚠️ ${pathStr}`);
+            break;
+        case "skip":
+            this.#skips.push({ path, ...result });
+            this.stream.writeln(`⏭️ ${pathStr}`);
+            break;
+        }
+    }
+
+    finalize() {
+        if (this.verbose) this.#displaySection("successes", this.#successes, true);
+        this.#displaySection("failures", this.#failures);
+        this.#displaySection("skips", this.#skips);
+        this.stream.writeln("");
+        this.stream.writeln(
+            `${this.#successes.length} succeeded, ${this.#failures.length} failed` +
+                (this.#skips.length ? `, ${this.#skips.length} skipped` : ""),
+        );
+    }
+
+    #displaySection(name: string, data: ({ path: string[] } & TestResult)[], ignoreEmpty: boolean = false) {
+        if (!data.length) return;
+
+        // Transform [{ path: ["a", "b", "c"] }, { path: ["a", "b", "d"] }]
+        // into { "a ❯ b": ["c", "d"] }.
+        let pathMap = new Map<string, ({ name: string } & TestResult)[]>();
+        for (const t of data) {
+            if (t.path.length === 0) throw new RangeError("path is empty");
+            const key = t.path.slice(0, -1).join(SEP);
+            if (!pathMap.has(key)) pathMap.set(key, []);
+            pathMap.get(key)!.push({ name: t.path.at(-1)!, ...t });
+        }
+
+        this.stream.writeln("");
+        this.stream.writeln(name.toUpperCase());
+        this.stream.writeln("=".repeat(name.length));
+
+        for (let [path, tests] of pathMap) {
+            if (ignoreEmpty) tests = tests.filter((t) => t.logs.length);
+            if (tests.length === 0) continue;
+            if (tests.length === 1) {
+                this.#writeOutput(tests[0], path ? `${path}${SEP}` : "", false);
+            } else {
+                this.stream.writeln(path);
+                for (const t of tests) this.#writeOutput(t, "  - ", true);
+            }
+        }
+    }
+
+    #writeOutput(test: { name: string } & TestResult, prefix: string, nested: boolean) {
+        let output = "";
+        if (test.logs.length) {
+            // Individual logs might span multiple lines, so join them together
+            // then split it again.
+            const logStr = test.logs.join("\n");
+            const lines = logStr.split("\n");
+            if (lines.length <= 1) {
+                output = `: ${logStr}`;
+            } else {
+                const padding = nested ? "      " : "  ";
+                output = ":\n" + lines.map((line) => padding + line).join("\n");
+            }
+        }
+        this.stream.writeln(`${prefix}${test.name}${output}`);
+    }
+}
+
+function assertGetElementById(id: string): HTMLElement {
+    let elem = document.getElementById(id);
+    if (elem == null) throw new ReferenceError(`element with ID '${id}' missing from DOM`);
+    return elem;
+}
+
+export class DOMReporter implements Reporter {
+    register(suites: TestGroup[]) {}
+
+    update(path: string[], result: TestResult) {
+        if (path.length === 0) throw new RangeError("path is empty");
+        if (result.state === "skip") {
+            assertGetElementById("skip-counter-text").hidden = false;
+        }
+        const counter = assertGetElementById(`${result.state}-counter`);
+        counter.innerText = (Number(counter.innerText) + 1).toString();
+
+        let parent = assertGetElementById("root");
+        for (const node of path) {
+            let child: HTMLDetailsElement | null = null;
+            let summary: HTMLElement | null = null;
+            let d: Element;
+            outer: for (d of parent.children) {
+                if (!(d instanceof HTMLDetailsElement)) continue;
+                for (const s of d.children) {
+                    if (!(s instanceof HTMLElement)) continue;
+                    if (!(s.tagName === "SUMMARY" && s.innerText === node)) continue;
+                    child = d;
+                    summary = s;
+                    break outer;
+                }
+            }
+            if (!child) {
+                child = document.createElement("details");
+                child.className = "test-node";
+                child.ariaRoleDescription = "test";
+                summary = document.createElement("summary");
+                summary.appendChild(document.createTextNode(node));
+                summary.ariaRoleDescription = "test name";
+                child.appendChild(summary);
+                parent.appendChild(child);
+            }
+            if (!summary) throw new Error("unreachable as assigned above");
+
+            switch (result.state) {
+            case "failure":
+                child.open = true;
+                child.classList.add("failure");
+                child.classList.remove("skip");
+                child.classList.remove("success");
+                // The summary marker does not appear in the AOM, so setting its
+                // alt text is fruitless; label the summary itself instead.
+                summary.setAttribute("aria-labelledby", "failure-description");
+                break;
+            case "skip":
+                if (child.classList.contains("failure")) break;
+                child.classList.add("skip");
+                child.classList.remove("success");
+                summary.setAttribute("aria-labelledby", "skip-description");
+                break;
+            case "success":
+                if (child.classList.contains("failure") || child.classList.contains("skip")) break;
+                child.classList.add("success");
+                summary.setAttribute("aria-labelledby", "success-description");
+                break;
+            }
+
+            parent = child;
+        }
+
+        const p = document.createElement("p");
+        p.classList.add("test-desc");
+        if (result.logs.length) {
+            const pre = document.createElement("pre");
+            pre.appendChild(document.createTextNode(result.logs.join("\n")));
+            p.appendChild(pre);
+        } else {
+            p.classList.add("italic");
+            p.appendChild(document.createTextNode("No output."));
+        }
+        parent.appendChild(p);
+    }
+
+    finalize() {}
+}
+
+interface GoNode {
+    name: string;
+    subtests?: GoNode[];
+}
+
+// Used to display results via `go test`, via some glue code from the Go side.
+export class GoTestReporter implements Reporter {
+    register(suites: TestGroup[]) {
+        console.log(JSON.stringify(suites.map(GoTestReporter.serialize)));
+    }
+
+    // Convert a test tree into the one expected by the Go code.
+    static serialize(node: TestTree): GoNode {
+        return {
+            name: node.name,
+            subtests: "children" in node ? node.children.map(GoTestReporter.serialize) : undefined,
+        };
+    }
+
+    update(path: string[], result: TestResult) {
+        let state: number;
+        switch (result.state) {
+            case "success": state = 0; break;
+            case "failure": state = 1; break;
+            case "skip": state = 2; break;
+        }
+        console.log(JSON.stringify({ path, state, logs: result.logs }));
+    }
+
+    finalize() {
+        console.log("null");
+    }
+}

cmd/pkgserver/ui_test/lib/ui.html

@@ -0,0 +1,39 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <link rel="stylesheet" href="/test/style.css">
+    <title>PkgServer Tests</title>
+</head>
+<body>
+<noscript>
+    I hate JavaScript as much as you, but this page runs tests written in
+    JavaScript to test the functionality of code written in JavaScript, so it
+    wouldn't make sense for it to work without JavaScript. <strong>Please turn
+    JavaScript on!</strong>
+</noscript>
+
+<h1>PkgServer Tests</h1>
+
+<main>
+<p id="counters">
+    <span id="success-counter">0</span> succeeded, <span id="failure-counter">0</span>
+    failed<span id="skip-counter-text" hidden>, <span id="skip-counter">0</span> skipped</span>.
+</p>
+
+<p hidden id="success-description">Successful test</p>
+<p hidden id="failure-description">Failed test</p>
+<p hidden id="skip-description">Partially or fully skipped test</p>
+
+<div id="root">
+</div>
+
+<script type="module">
+    import "/test/all_tests.js";
+    import { DOMReporter, GLOBAL_REGISTRAR } from "/test/lib/test.js";
+    GLOBAL_REGISTRAR.run(new DOMReporter());
+</script>
+</main>
+</body>
+</html>

cmd/pkgserver/ui_test/lib/ui.scss

@@ -0,0 +1,88 @@
+/*
+ * If updating the theme colors, also update them in success-closed.svg and
+ * success-open.svg!
+ */
+
+:root {
+    --bg: #d3d3d3;
+    --fg: black;
+}
+
+@media (prefers-color-scheme: dark) {
+    :root {
+        --bg: #2c2c2c;
+        --fg: ghostwhite;
+    }
+}
+
+html {
+    background-color: var(--bg);
+    color: var(--fg);
+}
+
+h1, p, summary, noscript {
+    font-family: sans-serif;
+}
+
+noscript {
+    font-size: 16pt;
+}
+
+.root {
+    margin: 1rem 0;
+}
+
+details.test-node {
+    margin-left: 1rem;
+    padding: 0.2rem 0.5rem;
+    border-left: 2px dashed var(--fg);
+    > summary {
+        cursor: pointer;
+    }
+    &.success > summary::marker {
+        /*
+         * WebKit only supports color and font-size properties in ::marker [1],
+         * and its ::-webkit-details-marker only supports hiding the marker
+         * entirely [2], contrary to mdn's example [3]; thus, set a color as
+         * a fallback: while it may not be accessible for colorblind
+         * individuals, it's better than no indication of a test's state for
+         * anyone, as that there's no other way to include an indication in the
+         * marker on WebKit.
+         *
+         * [1]: https://developer.mozilla.org/en-US/docs/Web/CSS/Reference/Selectors/::marker#browser_compatibility
+         * [2]: https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Elements/summary#default_style
+         * [3]: https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Elements/summary#changing_the_summarys_icon
+         */
+        color: var(--fg);
+        content: url("/test/success-closed.svg") / "success";
+    }
+    &.success[open] > summary::marker {
+        content: url("/test/success-open.svg") / "success";
+    }
+    &.failure > summary::marker {
+        color: red;
+        content: url("/test/failure-closed.svg") / "failure";
+    }
+    &.failure[open] > summary::marker {
+        content: url("/test/failure-open.svg") / "failure";
+    }
+    &.skip > summary::marker {
+        color: blue;
+        content: url("/test/skip-closed.svg") / "skip";
+    }
+    &.skip[open] > summary::marker {
+        content: url("/test/skip-open.svg") / "skip";
+    }
+}
+
+p.test-desc {
+    margin: 0 0 0 1rem;
+    padding: 2px 0;
+    > pre {
+        margin: 0;
+    }
+}
+
+.italic {
+    font-style: italic;
+}

cmd/pkgserver/ui_test/tsconfig.json

@@ -0,0 +1,6 @@
+{
+  "compilerOptions": {
+    "strict": true,
+    "target": "ES2024"
+  }
+}