Fix three things found by actually using it
Build App / compute-version (pull_request) Successful in 5s
Build App / build-macos (pull_request) Successful in 2m33s
Build App / build-windows (pull_request) Successful in 5m16s
Build App / build-linux (pull_request) Successful in 5m25s
Build App / create-tag (pull_request) Skipped
Build App / sync-to-github (pull_request) Skipped
Build App / compute-version (pull_request) Successful in 5s
Build App / build-macos (pull_request) Successful in 2m33s
Build App / build-windows (pull_request) Successful in 5m16s
Build App / build-linux (pull_request) Successful in 5m25s
Build App / create-tag (pull_request) Skipped
Build App / sync-to-github (pull_request) Skipped
**The drag showed no tab.** Moving to pointer events lost the drag image the OS used to supply, leaving a dimmed source tab and a 2px line — which reads as "some setting changed", not "I am holding this tab". A copy of the tab now follows the cursor, carrying its glyph and its real label, grabbed at the offset it was picked up by so it sits where the tab was. **The URL relay opened a different URL than the one on screen.** Observed: `repo.anhonesthost.net/…/tag/preview-63f3c54` arrived as `repo.anhonsthost.nt/…/preview-63f3c54Butitprovesyournitpick…`. The detector deleted *every* line break to undo PTY hard-wrapping, but a terminal that wraps at a space emits the break **instead of** the space — so deleting breaks also deletes the separators, gluing the following paragraph onto the link and running the match past the host. Only breaks the terminal inserted may be deleted, and those are exactly the ones at the column width. The detector now takes a live column getter and rejoins a line only when it is exactly that wide; every other break becomes a space, which is also what stops a URL match. Lines *longer* than the width are left alone — the stream had no break there, so the one that follows is the application's own. One case stays ambiguous: a URL whose length is an exact multiple of the width is indistinguishable from one that was cut. That is pinned in a test as known behaviour rather than papered over — the candidate is shown in full and nothing opens without the user pressing Open. **"In container" opened a page nobody could see.** It bound the browser and stopped, leaving the user to find the Browser tab and press Start, with nothing saying so — and from a terminal, no pane on screen at all. Opening a page now starts the viewer if it isn't running, and the terminal's prompt raises the pop-out window, because that caller has nowhere else to put it. Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
This commit is contained in:
@@ -229,13 +229,26 @@ export const getBrowserViewPopoutState = (projectId: string) =>
|
||||
* container too, so the loop closes without the host — and a dev server on
|
||||
* container loopback, which is how you watch a UI Claude is building. Only
|
||||
* http/https; the backend rejects anything else.
|
||||
*
|
||||
* The viewer is started if it isn't already: asking for a page is asking to
|
||||
* watch it, and leaving the user to go and press Start themselves — with no
|
||||
* hint that they had to — is what the first version did.
|
||||
*/
|
||||
export const openPageInContainerBrowser = (
|
||||
projectId: string,
|
||||
url: string,
|
||||
width: number,
|
||||
height: number,
|
||||
) => invoke<BrowserPageState>("open_page_in_container_browser", { projectId, url, width, height });
|
||||
/** Also raise the pop-out window — for callers with no pane on screen. */
|
||||
showWindow = false,
|
||||
) =>
|
||||
invoke<BrowserPageState>("open_page_in_container_browser", {
|
||||
projectId,
|
||||
url,
|
||||
width,
|
||||
height,
|
||||
showWindow,
|
||||
});
|
||||
/** Resize that page. Real reflow, not a scaled screencast — see BrowserTab. */
|
||||
export const setContainerPageViewport = (projectId: string, width: number, height: number) =>
|
||||
invoke<void>("set_container_page_viewport", { projectId, width, height });
|
||||
|
||||
@@ -0,0 +1,118 @@
|
||||
import { describe, it, expect, vi, beforeEach, afterEach } from "vitest";
|
||||
import { UrlDetector, flatten } from "./urlDetector";
|
||||
|
||||
const COLS = 80;
|
||||
const enc = new TextEncoder();
|
||||
|
||||
/** Feed text and let the debounce + confirmation timers run. */
|
||||
function feed(detector: UrlDetector, text: string) {
|
||||
detector.feed(enc.encode(text));
|
||||
vi.advanceTimersByTime(2000);
|
||||
}
|
||||
|
||||
/** Hard-wrap the way a PTY does: a break every `cols` characters, nothing lost. */
|
||||
function ptyWrap(text: string, cols = COLS): string {
|
||||
const lines: string[] = [];
|
||||
for (let i = 0; i < text.length; i += cols) lines.push(text.slice(i, i + cols));
|
||||
return lines.join("\r\n");
|
||||
}
|
||||
|
||||
beforeEach(() => vi.useFakeTimers());
|
||||
afterEach(() => vi.useRealTimers());
|
||||
|
||||
describe("flatten", () => {
|
||||
it("rejoins a break the terminal inserted at the width", () => {
|
||||
expect(flatten("abcde\nfghij", 5)).toBe("abcdefghij");
|
||||
});
|
||||
|
||||
it("keeps a break that arrived before the width as a separator", () => {
|
||||
expect(flatten("abc\ndef", 5)).toBe("abc def");
|
||||
});
|
||||
|
||||
it("rejoins nothing when the width isn't known", () => {
|
||||
// Better to lose a wrapped URL than to invent one.
|
||||
expect(flatten("abcde\nfghij", 0)).toBe("abcde fghij");
|
||||
});
|
||||
});
|
||||
|
||||
describe("UrlDetector", () => {
|
||||
it("reconstructs a URL the PTY hard-wrapped mid-token", () => {
|
||||
const seen: string[] = [];
|
||||
const d = new UrlDetector((u) => seen.push(u), () => COLS);
|
||||
const url =
|
||||
"https://accounts.example.com/o/oauth2/auth?client_id=1234567890-abcdefghijklmnop.apps.example.com&redirect_uri=http%3A%2F%2Flocalhost%3A45678&scope=openid+email+profile";
|
||||
|
||||
feed(d, "Open this link:\r\n" + ptyWrap(url) + "\r\nWaiting for the browser…\r\n");
|
||||
|
||||
expect(seen).toEqual([url]);
|
||||
});
|
||||
|
||||
it("does not glue the text that follows a link onto it", () => {
|
||||
// The bug this file exists for. A terminal wrapping a paragraph emits the
|
||||
// break *instead of* the space, so deleting every break produced
|
||||
// `…/tag/preview-63f3c54Butitprovesyournitpick…` — a different host and
|
||||
// path from the one on screen, opened on the user's machine.
|
||||
const seen: string[] = [];
|
||||
const d = new UrlDetector((u) => seen.push(u), () => COLS);
|
||||
const url =
|
||||
"https://repo.anhonesthost.net/CyberCoveLLC/Triple-C/releases/tag/preview-63f3c54-with-a-long-enough-suffix-to-scan";
|
||||
|
||||
feed(
|
||||
d,
|
||||
[
|
||||
url,
|
||||
"But it proves your nitpick perfectly: every file in it says 0.3.0.",
|
||||
"That is the hard-coded patch number.",
|
||||
].join("\r\n") + "\r\n",
|
||||
);
|
||||
|
||||
expect(seen).toEqual([url]);
|
||||
expect(seen[0]).not.toContain("But");
|
||||
// And the host is exactly what was printed — no characters lost.
|
||||
expect(new URL(seen[0]).host).toBe("repo.anhonesthost.net");
|
||||
});
|
||||
|
||||
it("stops at the end of a short line even when more output follows", () => {
|
||||
const seen: string[] = [];
|
||||
const d = new UrlDetector((u) => seen.push(u), () => COLS);
|
||||
const url = "https://example.com/" + "a".repeat(90);
|
||||
|
||||
feed(d, `${url}\r\nnext line of output\r\n`);
|
||||
|
||||
expect(seen).toEqual([url]);
|
||||
});
|
||||
|
||||
it("joins the next line when a token ends exactly at the width", () => {
|
||||
// The one case the width rule cannot decide: a URL whose length is an exact
|
||||
// multiple of the column count looks identical to one that was cut. Pinned
|
||||
// as known behaviour rather than pretended away — the toast still shows the
|
||||
// whole candidate, and nothing opens without the user pressing Open.
|
||||
const seen: string[] = [];
|
||||
const d = new UrlDetector((u) => seen.push(u), () => COLS);
|
||||
const url = "https://example.com/" + "c".repeat(2 * COLS - 20); // exactly 2 lines
|
||||
|
||||
feed(d, `${ptyWrap(url)}\r\nTAIL\r\n`);
|
||||
|
||||
expect(seen).toEqual([url + "TAIL"]);
|
||||
});
|
||||
|
||||
it("ignores anything under the length threshold", () => {
|
||||
const seen: string[] = [];
|
||||
const d = new UrlDetector((u) => seen.push(u), () => COLS);
|
||||
|
||||
feed(d, "see https://example.com/short\r\nmore text\r\n");
|
||||
|
||||
expect(seen).toEqual([]);
|
||||
});
|
||||
|
||||
it("emits a wrapped URL once, not once per chunk", () => {
|
||||
const seen: string[] = [];
|
||||
const d = new UrlDetector((u) => seen.push(u), () => COLS);
|
||||
const url = "https://example.com/" + "b".repeat(120);
|
||||
|
||||
feed(d, ptyWrap(url));
|
||||
feed(d, "\r\ndone\r\n");
|
||||
|
||||
expect(seen).toEqual([url]);
|
||||
});
|
||||
});
|
||||
@@ -3,8 +3,23 @@
|
||||
*
|
||||
* The Linux PTY hard-wraps long lines with \r\n at the terminal column width,
|
||||
* which breaks xterm.js WebLinksAddon URL detection. This class flattens
|
||||
* the buffer (stripping PTY wraps, converting blank lines to spaces) and
|
||||
* matches URLs with a single regex, firing a callback for ones >= 100 chars.
|
||||
* the buffer (rejoining hard wraps, treating every other break as a
|
||||
* terminator) and matches URLs with a single regex, firing a callback for ones
|
||||
* >= 100 chars.
|
||||
*
|
||||
* ## Which line breaks may be deleted
|
||||
*
|
||||
* Only the ones the *terminal* inserted. A hard wrap happens at exactly the
|
||||
* column width, so a line that reached the width was cut mid-token and its
|
||||
* break must be removed to put the token back together; a line that stopped
|
||||
* short ended for its own reasons and its break is a real separator.
|
||||
*
|
||||
* Deleting every break instead — which this did — glues unrelated output onto
|
||||
* the end of a URL. Observed for real: a wrapped paragraph following a link
|
||||
* became `…/tag/preview-63f3c54Butitprovesyournitpick…`, because a terminal
|
||||
* that wraps at a space emits the break *instead of* the space, so removing
|
||||
* the break removes the separator too. That candidate is a different URL from
|
||||
* the one on screen, and the user is the one who has to notice.
|
||||
*
|
||||
* When a URL match extends to the end of the flattened buffer, emission is
|
||||
* deferred (more chunks may still be arriving). A confirmation timer emits
|
||||
@@ -21,6 +36,45 @@ const MIN_URL_LENGTH = 100;
|
||||
|
||||
export type UrlCallback = (url: string) => void;
|
||||
|
||||
/**
|
||||
* How wide the terminal is right now.
|
||||
*
|
||||
* A getter, not a number: the width changes with every window resize, and a
|
||||
* stale one silently turns joining back into guesswork.
|
||||
*/
|
||||
export type ColumnsGetter = () => number;
|
||||
|
||||
/**
|
||||
* Rejoin the line breaks the terminal inserted; turn the rest into spaces.
|
||||
*
|
||||
* A line of exactly `columns` visible characters was cut by the terminal, so
|
||||
* its break is deleted and the two halves are put back together. Anything
|
||||
* shorter ended on its own and becomes a space — a URL cannot contain one, so
|
||||
* that is also what stops a match running into whatever followed.
|
||||
*
|
||||
* `columns` of 0 or less means "not known yet"; nothing is rejoined, which
|
||||
* costs a wrapped URL rather than inventing one.
|
||||
*
|
||||
* One case stays ambiguous and cannot be resolved here: a token that happens to
|
||||
* end exactly at the width is indistinguishable from one the terminal cut, so
|
||||
* the following line is joined to it. The candidate is still shown in full and
|
||||
* confirmed by the user before anything opens.
|
||||
*/
|
||||
export function flatten(clean: string, columns: number): string {
|
||||
const lines = clean.split(/\r?\n/);
|
||||
let out = "";
|
||||
for (let i = 0; i < lines.length; i++) {
|
||||
out += lines[i];
|
||||
if (i === lines.length - 1) break;
|
||||
// `===`, not `>=`. A line *longer* than the width was never cut by the
|
||||
// terminal — the stream simply contained no break there, so the break that
|
||||
// follows it is the application's own and separates two things.
|
||||
const wrapped = columns > 0 && lines[i].length === columns;
|
||||
if (!wrapped) out += " ";
|
||||
}
|
||||
return out;
|
||||
}
|
||||
|
||||
export class UrlDetector {
|
||||
private decoder = new TextDecoder();
|
||||
private buffer = "";
|
||||
@@ -29,9 +83,11 @@ export class UrlDetector {
|
||||
private lastEmitted = "";
|
||||
private pendingUrl: string | null = null;
|
||||
private callback: UrlCallback;
|
||||
private columns: ColumnsGetter;
|
||||
|
||||
constructor(callback: UrlCallback) {
|
||||
constructor(callback: UrlCallback, columns: ColumnsGetter) {
|
||||
this.callback = callback;
|
||||
this.columns = columns;
|
||||
}
|
||||
|
||||
/** Feed raw PTY output chunks. */
|
||||
@@ -61,12 +117,8 @@ export class UrlDetector {
|
||||
// 1. Strip ANSI escape sequences
|
||||
const clean = this.buffer.replace(ANSI_RE, "");
|
||||
|
||||
// 2. Flatten the buffer:
|
||||
// - Blank lines (2+ consecutive line breaks) → space (real paragraph break / URL terminator)
|
||||
// - Remaining \r and \n → removed (PTY hard-wrap artifacts)
|
||||
const flat = clean
|
||||
.replace(/(\r?\n){2,}/g, " ")
|
||||
.replace(/[\r\n]/g, "");
|
||||
// 2. Flatten the buffer: rejoin hard wraps, terminate on everything else.
|
||||
const flat = flatten(clean, this.columns());
|
||||
|
||||
if (!flat) return;
|
||||
|
||||
|
||||
Reference in New Issue
Block a user