drawn
" }, + ], + agent: "e2e", + }); + if (browserName === "chromium") { + await context.grantPermissions(["clipboard-read", "clipboard-write"]); + } + + await page.goto(server.url); + const card = page.locator(".card:not(#whatsNew)"); + const menu = page.locator(".share-menu"); + + // The three old export icons are gone — one share control replaces them. + await expect(card.locator(".act.copy, .act.open, .act.shot")).toHaveCount(0); + await card.locator(".act.share").click(); + await expect(menu).toBeVisible(); + await expect(menu.getByRole("menuitem")).toHaveText([ + "Copy link", + "Copy as markdown", + "Open in new tab", + "Open as image", + ]); + // No Browser Rendering on a Node server, so the image row is inert but visible. + await expect(menu.getByRole("menuitem", { name: "Open as image" })).toBeDisabled(); + + await menu.getByRole("menuitem", { name: "Copy as markdown" }).click(); + await expect(menu).toBeHidden(); + await expect(page.locator("#toast")).toContainText("Copied as markdown"); + if (browserName === "chromium") { + const copied = await page.evaluate(() => navigator.clipboard.readText()); + expect(copied).toContain("## Retry backoff"); + expect(copied).toContain("the plan"); + // An html surface links back rather than pasting agent markup. + expect(copied).toContain(`/p/${post.id}?part=1`); + expect(copied).not.toContain("drawn
"); + } + + // Escape closes and hands focus back to the button; a click outside closes too. + await card.locator(".act.share").click(); + await expect(menu).toBeVisible(); + await page.keyboard.press("Escape"); + await expect(menu).toBeHidden(); + await expect(card.locator(".act.share")).toBeFocused(); + await card.locator(".act.share").click(); + await page.locator(".card-title").first().click(); + await expect(menu).toBeHidden(); +}); + test("a failed comment send restores the input instead of losing the message", async ({ page, server, @@ -715,7 +773,7 @@ test("at phone width the sidebar collapses into a drawer and actions stay visibl expect((await card.boundingBox())!.width).toBeGreaterThan(300); // hover-only card actions are always visible at narrow widths - await expect(card.locator(".act.open")).toHaveCSS("opacity", "1"); + await expect(card.locator(".act.share")).toHaveCSS("opacity", "1"); // the menu button opens the drawer; picking a session closes it again await page.locator("#menuBtn").click(); diff --git a/server/app.ts b/server/app.ts index 0067a83..238c072 100644 --- a/server/app.ts +++ b/server/app.ts @@ -17,6 +17,7 @@ import { import { EventBus, type FeedEvent } from "./events.ts"; import { kitSummaries } from "./kits.ts"; import { registerMcp } from "./mcpHttp.ts"; +import { postToMarkdown } from "./postMarkdown.ts"; import { escapeHtml, renderHtmlPage, @@ -1149,6 +1150,19 @@ export function createApp({ if (!post) return c.json({ error: "post not found" }, 404); return c.json(viewerPostView(post)); }); + // The post flattened to portable markdown — what the viewer's share menu + // copies, and the same text on the CLI/HTTP tiers. Another canonical post + // subresource, like /viewer above. It has to be served rather than derived in + // the viewer: the hydrated post the viewer holds omits sandboxed surface + // bodies (see apiViews.ts), so only the server can see the whole post. + app.get("/api/posts/:id/markdown", async (c) => { + const post = await store.getPost(c.req.param("id")); + if (!post) return c.json({ error: "post not found" }, 404); + const origin = new URL(c.req.url).origin; + const base = `${origin}${requestBasePath(c.req.raw)}`; + const markdown = postToMarkdown(post, { postUrl: `${base}/p/${post.id}`, assetBase: base }); + return c.text(markdown, 200, { "content-type": "text/markdown; charset=utf-8" }); + }); app.get("/api/surfaces/:id", getPost); // legacy alias app.get("/api/posts/:id", getPost); app.get("/api/snippets/:id", getPost); // legacy alias diff --git a/server/postMarkdown.ts b/server/postMarkdown.ts new file mode 100644 index 0000000..6b86aff --- /dev/null +++ b/server/postMarkdown.ts @@ -0,0 +1,331 @@ +// Flatten a post to portable markdown — what the viewer's "copy as markdown" +// share action puts on the clipboard, and what GET /api/posts/:id/markdown +// serves so the CLI/HTTP tiers can have it too. +// +// Runtime-agnostic (no `node:` imports, no DOM): the Worker DO serves this route +// as well. It reads a stored post, so it sees full surface bodies — the viewer's +// hydrated posts deliberately omit sandboxed surface content (see apiViews.ts), +// which is exactly why this lives on the server rather than in the viewer. +// +// Each kind flattens the honest way: text kinds become fenced blocks, an image +// becomes an image link, and `html` — markup with no faithful markdown form — +// degrades to a link back to the surface rather than dumping its source. Unknown +// and by-reference kinds take that same link fallback. +import type { + CodeSurface, + DiffSurface, + ImageSurface, + JsonSurface, + MarkdownSurface, + MermaidSurface, + Post, + Surface, + TerminalSurface, +} from "./types.ts"; + +export interface PostMarkdownOptions { + // Absolute permalink to the post (`…/p/:id`). Surface links append `?part=N` + // (the legacy wire key the route still takes). Omit for a link-free document. + postUrl?: string; + // Absolute base an asset path hangs off (`…/a/:id`), i.e. origin + base path. + // Relative `/a/:id` links are useless once pasted elsewhere, so an image + // surface without this degrades to its alt text. + assetBase?: string; +} + +// A post the flattener can read. Loosened from `Post` so a single version out +// of `history` (which carries no id/timestamps) can be flattened too. +export type MarkdownablePost = Pick