fix(markdown): don't strikethrough single-tilde text (#154)

webview-ui/src/components/common/MarkdownBlock.tsx

@@ -307,7 +307,9 @@ const MarkdownBlock = memo(({ markdown }: MarkdownBlockProps) => {
 		<StyledMarkdown>
 			<ReactMarkdown
 				remarkPlugins={[
-					remarkGfm,
+					// singleTilde: false so a single "~" around text (e.g. "1~3", "~10") is not
+					// rendered as strikethrough; only "~~text~~" is. Matches VS Code's markdown. (#154)
+					[remarkGfm, { singleTilde: false }],
 					remarkMath,
 					() => {
 						return (tree: any) => {

webview-ui/src/components/common/__tests__/MarkdownBlock.spec.tsx

@@ -36,6 +36,30 @@ describe("MarkdownBlock", () => {
 		expect(paragraph?.textContent).toBe("Check out this link: https://example.com.")
 	}, 10000)
 
+	it("should not strikethrough text wrapped in a single tilde (#154)", async () => {
+		const markdown = "1. Lorem ~10 ipsum dolor sit 1~3 amet."
+		const { container } = render(<MarkdownBlock markdown={markdown} />)
+
+		await screen.findByText(/Lorem/, { exact: false })
+
+		// Single tildes around numbers must NOT become strikethrough.
+		expect(container.querySelectorAll("del").length).toBe(0)
+		const listItem = container.querySelector("li")
+		expect(listItem?.textContent).toContain("~10")
+		expect(listItem?.textContent).toContain("1~3")
+	}, 10000)
+
+	it("should still strikethrough text wrapped in double tildes", async () => {
+		const markdown = "This is ~~struck~~ text."
+		const { container } = render(<MarkdownBlock markdown={markdown} />)
+
+		await screen.findByText(/struck/, { exact: false })
+
+		const del = container.querySelector("del")
+		expect(del).not.toBeNull()
+		expect(del?.textContent).toBe("struck")
+	}, 10000)
+
 	it("should render unordered lists with proper styling", async () => {
 		const markdown = `Here are some items:
 - First item