Skip to content

examples/compose: build ttyd from our fork with autoreconnect patch - #126

Merged
hndrewaall merged 1 commit into
mainfrom
examples-compose-ttyd-from-fork
May 13, 2026
Merged

examples/compose: build ttyd from our fork with autoreconnect patch#126
hndrewaall merged 1 commit into
mainfrom
examples-compose-ttyd-from-fork

Conversation

@hndrewaall

Copy link
Copy Markdown
Owner

Summary

The ttyd web console in examples/compose/ previously served the upstream
tsl0922/ttyd:1.7.7 image's embedded HTML directly. That HTML's WebSocket
client only reconnects on non-1000 close codes and bails entirely after a
single socket error event, so laptop sleep / VPN flap / brief network
drops park the in-browser terminal at "Press Enter to Reconnect" until
someone notices.

This PR adds a node-based frontend-builder stage that clones our ttyd
fork (https://github.com/hndrewaall/ttyd) and runs yarn build +
gulp inline against it, producing a single self-contained HTML file
that ships:

  • exponential-backoff auto-reconnect (1s -> 30s) on every close while
    reconnect is enabled, not just non-1000 codes
  • reconnect kept enabled across error events (the always-following
    close drives the retry)
  • a visibilitychange handler that cancels any pending backoff and
    reconnects immediately when the tab becomes visible
  • backoff reset on a successful (re)open

The autodark CSS + theme-swap inject-autodark.py pipeline still runs on
top of the fork-built HTML. The upstream ttyd C binary is unchanged —
we still copy it out of tsl0922/ttyd:1.7.7.

The fork pin is captured as TTYD_FORK_REF (defaults to the squash-merge
SHA on the fork's main). Once the upstream PR
tsl0922/ttyd#1536 merges,
the pin can move back to a tsl0922/ttyd tag.

Test plan

  • Local sudo docker build examples/compose/ttyd/ succeeds end-to-end.
  • Resulting image contains the autoreconnect identifiers in
    /usr/local/share/ttyd/index.html (visibilitychange,
    scheduleReconnect, reconnectDelay, reconnectMaxDelay,
    installVisibilityHandler all present).
  • Autodark inject still applies (prefers-color-scheme + autodark-injected
    grep matches preserved as build-time guards).
  • Cold-start the full docker compose up stack; tab into
    http://localhost:7681 and verify reconnect overlay appears after a
    forced socket close instead of "Press Enter to Reconnect".

The ttyd web console previously consumed the upstream
tsl0922/ttyd:1.7.7 image's embedded HTML directly. That HTML's
WebSocket-client logic only reconnects on non-1000 close codes
and bails entirely on a single socket error, so laptop sleep /
VPN flap / brief network drops stick the in-browser terminal at
"Press Enter to Reconnect" until the user notices.

Switch the frontend build to clone our ttyd fork
(https://github.com/hndrewaall/ttyd) and run yarn build + gulp
inline against it, producing a single self-contained HTML file
that ships an exponential-backoff auto-reconnect plus a
visibilitychange handler (cancels the backoff + reconnects
immediately when the tab becomes visible). The autodark CSS +
theme-swap injection still runs on top of the fork-built HTML
via inject-autodark.py.

The upstream C binary is unchanged; we still copy it out of
tsl0922/ttyd:1.7.7. Once the upstream PR
(tsl0922/ttyd#1536) merges, the
TTYD_FORK_REF pin can move back to tsl0922/ttyd:main (or a
future tag).

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
@hndrewaall
hndrewaall merged commit c833e61 into main May 13, 2026
3 checks passed
@hndrewaall
hndrewaall deleted the examples-compose-ttyd-from-fork branch May 13, 2026 00:14
hndrewaall added a commit that referenced this pull request Aug 11, 2026
The ttyd web console previously consumed the upstream
tsl0922/ttyd:1.7.7 image's embedded HTML directly. That HTML's
WebSocket-client logic only reconnects on non-1000 close codes
and bails entirely on a single socket error, so laptop sleep /
VPN flap / brief network drops stick the in-browser terminal at
"Press Enter to Reconnect" until the user notices.

Switch the frontend build to clone our ttyd fork
(https://github.com/hndrewaall/ttyd) and run yarn build + gulp
inline against it, producing a single self-contained HTML file
that ships an exponential-backoff auto-reconnect plus a
visibilitychange handler (cancels the backoff + reconnects
immediately when the tab becomes visible). The autodark CSS +
theme-swap injection still runs on top of the fork-built HTML
via inject-autodark.py.

The upstream C binary is unchanged; we still copy it out of
tsl0922/ttyd:1.7.7. Once the upstream PR
(tsl0922/ttyd#1536) merges, the
TTYD_FORK_REF pin can move back to tsl0922/ttyd:main (or a
future tag).

Co-authored-by: Claude Opus 4.7 <noreply@anthropic.com>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant