fix(web): chat links open in a new tab and long URLs/CJK wrap cleanly (#27)

Co-authored-by: Alice <alice@prismshadow.com>
Co-authored-by: Claude Fable 5 <noreply@anthropic.com>
This commit is contained in:
Yaowei Zheng
2026-07-22 21:34:34 +08:00
committed by GitHub
parent 6d9a631e62
commit cb22cd5d97
6 changed files with 151 additions and 8 deletions
+16 -1
View File
@@ -86,10 +86,25 @@ test("chat + tool approval + stats/cost/copy + traces + files", async ({ page })
// Final assistant answer (turn 2 from mock).
await expect(page.getByText("Command finished; the result looks as expected.")).toBeVisible();
// Chat links always open in a new tab and never navigate the SPA away — including bare URLs
// that remark-gfm autolinks (the mock reply carries one inside a CJK sentence).
const replyLink = page.locator(".md-body a", { hasText: "example.com" }).first();
await expect(replyLink).toBeVisible();
await expect(replyLink).toHaveAttribute("href", /^https:\/\/example\.com\//);
await expect(replyLink).toHaveAttribute("target", "_blank");
await expect(replyLink).toHaveAttribute("rel", "noreferrer");
// Wide Markdown tables scroll inside the message body instead of pushing the page wide.
const replyTable = page.locator(".md-body table").first();
await expect(replyTable).toBeVisible();
expect(await replyTable.evaluate((el) => getComputedStyle(el).overflowX)).toBe("auto");
// Regression: after entering a session and rendering messages, the page must not overflow
// horizontally (previously, with the Files dock panel closed, the sr-only upload input was
// anchored to the initial containing block, bypassing the panel's overflow-hidden and
// stretching the document wide enough to create a horizontal scrollbar).
// stretching the document wide enough to create a horizontal scrollbar). The turn-2 reply
// above deliberately contains a ~170-char bare URL in CJK prose and a table with a 118-char
// unbreakable token — this assertion also proves the URL wraps and the table scrolls inside
// the message column instead of blowing out the page.
const docWidth = await page.evaluate(() => ({
scrollWidth: document.documentElement.scrollWidth,
clientWidth: document.documentElement.clientWidth,