mirror of
https://github.com/coder/coder.git
synced 2026-09-24 15:04:27 +08:00
fix(site): fix StreamingCodeFence storybook flake (#23681)
This commit is contained in:
@@ -1,5 +1,5 @@
|
|||||||
import type { Meta, StoryObj } from "@storybook/react-vite";
|
import type { Meta, StoryObj } from "@storybook/react-vite";
|
||||||
import { expect, within } from "storybook/test";
|
import { expect, waitFor, within } from "storybook/test";
|
||||||
import { Response } from "./response";
|
import { Response } from "./response";
|
||||||
|
|
||||||
const sampleMarkdown = `
|
const sampleMarkdown = `
|
||||||
@@ -125,15 +125,21 @@ export const StreamingInlineMarkdown: Story = {
|
|||||||
|
|
||||||
// Verifies that an incomplete fenced code block in streaming mode
|
// Verifies that an incomplete fenced code block in streaming mode
|
||||||
// renders inside a code element rather than showing raw backticks.
|
// renders inside a code element rather than showing raw backticks.
|
||||||
|
// The FileViewer renders a <diffs-container> web component whose
|
||||||
|
// content lives in Shadow DOM, so we assert on DOM structure rather
|
||||||
|
// than text content inside the web component.
|
||||||
export const StreamingCodeFence: Story = {
|
export const StreamingCodeFence: Story = {
|
||||||
args: {
|
args: {
|
||||||
children: "```ts\nconst x = 1",
|
children: "```ts\nconst x = 1",
|
||||||
streaming: true,
|
streaming: true,
|
||||||
},
|
},
|
||||||
play: async ({ canvasElement }) => {
|
play: async ({ canvasElement }) => {
|
||||||
const canvas = within(canvasElement);
|
// The code fence should be parsed into a FileViewer (web component),
|
||||||
const codeContent = await canvas.findByText(/const x = 1/);
|
// not rendered as raw backtick text.
|
||||||
expect(codeContent).toBeInTheDocument();
|
await waitFor(() => {
|
||||||
|
const viewer = canvasElement.querySelector("diffs-container");
|
||||||
|
expect(viewer).toBeInTheDocument();
|
||||||
|
});
|
||||||
// The raw triple-backtick should not appear as visible text.
|
// The raw triple-backtick should not appear as visible text.
|
||||||
const bodyText = canvasElement.textContent ?? "";
|
const bodyText = canvasElement.textContent ?? "";
|
||||||
expect(bodyText).not.toContain("```");
|
expect(bodyText).not.toContain("```");
|
||||||
|
|||||||
Reference in New Issue
Block a user