feat: add browser resumable upload client

Replace the placeholder browser script with the PLAN.md upload flow. The static
UI now creates upload records, slices the selected file into fixed-size chunks,
uploads missing chunks with a concurrency pool of three workers, retries failed
chunks with exponential backoff, pauses via AbortController, and completes the
upload once the server has accepted every chunk.

Persist pending upload records in IndexedDB and render them in the page so a
reload can resume from server-authoritative progress. When the File System
Access API is available, the app stores a file handle and asks for read
permission during resume; when it is unavailable or permission is denied, the
same pending record resumes after the user reselects the matching file. Browser
state is helpful but not trusted: every resume starts by querying the server for
completed chunks.

Add a JavaScript syntax check to the justfile, update the static-page test and
documentation, and extend TESTS.md with the manual resume scenarios that still
need real-browser repetition.

Test Plan:
- just check
- UPL_BIND=127.0.0.1:39123 UPL_DATA_DIR=$(mktemp -d) cargo run
- curl -fsS http://127.0.0.1:39123/healthz
- curl -fsS http://127.0.0.1:39123/ | rg "Choose file|Pending uploads|app.js"
- firefox --headless --screenshot /tmp/upl-page.png http://127.0.0.1:39123/

Refs: PLAN.md milestones 5, 6, and 7
This commit is contained in:
2026-05-30 17:08:02 +02:00
parent 5ca52b5780
commit 35cd0657bd
7 changed files with 596 additions and 19 deletions
+9 -3
View File
@@ -18,10 +18,10 @@
<span class="status-pill" id="connection-status">Server online</span>
</div>
<label class="file-picker">
<span>Select file</span>
<div class="file-picker">
<button id="pick-button" type="button">Choose file</button>
<input id="file-input" type="file">
</label>
</div>
<div class="file-summary" id="file-summary" hidden>
<strong id="file-name"></strong>
@@ -31,6 +31,7 @@
<div class="progress-wrap" aria-label="Upload progress">
<div class="progress-bar" id="progress-bar"></div>
</div>
<div class="progress-meta" id="progress-meta">0 of 0 chunks</div>
<div class="actions">
<button id="start-button" type="button" disabled>Start</button>
@@ -38,6 +39,11 @@
<button id="resume-button" type="button" disabled>Resume</button>
</div>
<section class="pending-section" id="pending-section" hidden>
<h2>Pending uploads</h2>
<ul class="pending-list" id="pending-list"></ul>
</section>
<ol class="event-log" id="event-log" aria-live="polite">
<li>Choose a file to begin.</li>
</ol>