jerry/buzz
1
0
Fork 0
mirror of https://github.com/block/buzz.git synced 2026-11-05 08:51:10 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix(desktop): wrap long markdown autolinks (#1081)

Browse Source 
Signed-off-by: npub1mprnacetjua2xx3p5eddmhxyk6wv929ymm5py8kd2xfxurxahspqqlgyta <d8473ee32b973aa31a21a65adddcc4b69cc2a8a4dee8121ecd51926e0cddbc02@sprout-oss.stage.blox.sqprod.co>
Co-authored-by: npub1mprnacetjua2xx3p5eddmhxyk6wv929ymm5py8kd2xfxurxahspqqlgyta <d8473ee32b973aa31a21a65adddcc4b69cc2a8a4dee8121ecd51926e0cddbc02@sprout-oss.stage.blox.sqprod.co>
This commit is contained in:
tlongwell-block
2026-06-17 11:03:58 -04:00
committed by GitHub
parent ff824a365e
commit b7e22f4b5c
2 changed files with 41 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
desktop/src/shared/ui/markdown.tsx
View File

@@ -1432,7 +1432,7 @@ function MarkdownInner({
className={cn(
MESSAGE_MARKDOWN_CLASS,
[
"max-w-none break-words text-sm leading-relaxed text-foreground",
"max-w-none [overflow-wrap:anywhere] text-sm leading-relaxed text-foreground",
"[&>*:first-child]:mt-0 [&>*:last-child]:mb-0",
"[&>*+*]:mt-3",
"[&>p+p]:mt-1.5",

40
desktop/tests/e2e/messaging.spec.ts
View File

@@ -23,6 +23,46 @@ test("send a message and see it in timeline", async ({ page }) => {
);
});
test("long autolink wraps without widening the timeline", async ({ page }) => {
await page.setViewportSize({ width: 800, height: 600 });
await page.goto("/");
await page.getByTestId("channel-general").click();
await expect(page.getByTestId("chat-title")).toHaveText("general");
const longUrl = `https://blocked.teams.cloudflare.com/?${"dependencyconfusionnpm".repeat(18)}`;
const message = `Step "adapter" failed: npm error invalid json response body at <${longUrl}> reason: Unexpected token '<'`;
await page.getByTestId("message-input").fill(message);
await page.getByTestId("send-message").click();
const timeline = page.getByTestId("message-timeline");
await expect(timeline).toContainText('Step "adapter" failed');
await expect
.poll(() =>
timeline.evaluate((element) => element.scrollWidth - element.clientWidth),
)
.toBeLessThanOrEqual(1);
const row = page.getByTestId("message-row").last();
await row.hover();
const actionBar = page.locator('[data-testid^="message-action-bar-"]').last();
await expect(actionBar).toHaveCSS("opacity", "1");
await expect
.poll(async () => {
const [barBox, timelineBox] = await Promise.all([
actionBar.boundingBox(),
timeline.boundingBox(),
]);
if (!barBox || !timelineBox) {
return Number.POSITIVE_INFINITY;
}
return barBox.x + barBox.width - (timelineBox.x + timelineBox.width);
})
.toBeLessThanOrEqual(0);
});
test("send multiple messages in sequence", async ({ page }) => {
const ts = Date.now();
const messages = [