pippinmole/ghost

public

Source code of Ghost - On Ghost

web: highlight fenced code blocks in Markdown873103b6 days ago157 lines · 5.9 KB

1	import { describe, expect, it } from "bun:test";
2	import { renderToStaticMarkup }
3
4	import { Markdown }
5
6	/** The rendered markdown, without the wrapper or the image preloads React hoists ahead of it. */
7	function render(
8	markdown: string,
9	resolveUrl?: (url
10	repository?: {
11	) {
12	const html =
13	<Markdown resolveUrl={
14	{markdown}
15	</Markdown>,
16	);
17	const open =
18	return html.slice
19	}
20
21	const REPOSITORY = {
22
23	describe("Markdown", ()
24	it("hands a fenced block with a language to the highlighter, without its trailing newline, and leaves other code as written",
25	expect(render("```ts
26	"<pre><code>const a = 1;</code></pre>",
27	);
28	expect(render("```
29	expect(render("`inline`
30	});
31
32	it("turns GitHub emoji shortcodes into emoji, outside code",
33	expect(render("Ship it :ship: :+1:
34	expect(render("`:ship:`
35	expect(render(":not-an-emoji:
36	});
37
38	it("keeps the HTML READMEs are actually written with",
39	expect(render('<h1 align="center">Ghost</h1>
40	'<h1 align="center">Ghost</h1>',
41	);
42	expect(
43	render("<details><summary>s</summary>\n\nbody\n\n
44	).toContain("<details><summary>s</summary>"
45	expect(
46	render('<table><tr><td align="center">x</td></tr></table>'),
47	).toContain('<td style="text-align:center">x</td>'
48	});
49
50	it("drops script, event handlers, javascript: and inline style",
51	expect(render("<script>alert(1)</script>
52	expect(render('<img src="x" onerror="alert(1)">
53	expect(render('<a href="javascript:alert(1)">x</a>
54	expect(render('<iframe src="https://evil.example.com"></iframe>
55	expect(render('<div style="position:fixed;inset:0">x</div>
56	"<div>x</div>",
57	);
58	});
59
60	/** `align` on a cell becomes `style="text-align:<value>"` downstream of the sanitizer, so anything but the legal values is a CSS injection. */
61	it("refuses an align value that would smuggle CSS into style",
62	expect(
63	render(
64	'<table><tr><td align="right;position:fixed;inset:0">x</td></tr></table>',
65	),
66	).not.toContain(
67	expect(render("\| a \|
68	'style="text-align:center"',
69	);
70	});
71
72	it("keeps target and rel, and never opens a tab that keeps the opener",
73	expect(
74	render('<a href="https://x.example.com" target="_blank">x</a>'),
75	).toContain('rel="noopener noreferrer"'
76	expect(
77	render(
78	'<a href="https://x.example.com" target="_blank" rel="nofollow">x</a>',
79	),
80	).toContain('rel="nofollow noopener noreferrer"'
81	expect(
82	render('<a href="https://x.example.com" target="_top">x</a>'),
83	).toContain('target="_top"'
84	// not a real target: dropped before the component ever sees it
85	expect(
86	render('<a href="https://x.example.com" target="evilframe">x</a>'),
87	).not.toContain(
88	});
89
90	it("breaks lines on every newline in comment text, but not in a README",
91	expect(render("one
92	"<p>one<br/>\ntwo</p>",
93	);
94	expect(render("one
95	expect(render("`a
96	"<p><code>a b</code></p>",
97	);
98	});
99
100	it("renders GitHub alerts, and leaves look-alikes as quotes",
101	const alert =
102	"> [!IMPORTANT]\n> ## Revert\n> first",
103	undefined,
104	REPOSITORY,
105	);
106	expect(alert).toStartWith
107	'<div class="markdown-alert markdown-alert-important">\n<p class="markdown-alert-title"><svg',
108	);
109	expect(alert).toContain
110	expect(alert).toContain
111	expect(render("> [!note]
112	expect(render("> [!NOTE]
113	expect(render("> [!NOTE] x
114	expect(render("- > [!NOTE]
115	});
116
117	it("allows only the alert classes through",
118	expect(render('<div class="markdown-alert evil">x</div>
119	'<div class="markdown-alert">x</div>',
120	);
121	expect(render('<p class="evil">x</p>
122	});
123
124	it("rewrites relative URLs, in markdown and in raw HTML alike",
125	const resolveUrl =
126
127	expect(render("![x](shot.png)
128	'src="/src/shot.png"',
129	);
130	expect(render('<img src="shot.png">
131	'src="/src/shot.png"',
132	);
133	expect(render("[x](docs/a.md)
134	'href="/href/docs/a.md"',
135	);
136	expect(render("[x](https://example.com)
137	'href="https://example.com"',
138	);
139	expect(render("[x](#anchor)
140	});
141
142	it("links references in issue text, but not in code, links or files",
143	const html =
144	<Markdown repository={
145	{"Fixes #1 and them/lib#2, cc @bob. `#3` [#4](https://x.io)"}
146	</Markdown>,
147	);
148
149	expect(html).toContain
150	expect(html).toContain
151	expect(html).toContain
152	expect(html).toContain
153	expect(html).toContain
154	expect(html).not
155	expect(render("see #1
156	});
157	});