forked from
npmx.dev/npmx.dev
[READ-ONLY]
a fast, modern browser for the npm registry
fix: render markdown in deprecated blocks in package docs (#446)
authored by
Lino Le Van
and committed by
GitHub
7ae58e69
5cab540d
+32
-5
+10
-2
app/pages/docs/[...path].vue
+10
-2
app/pages/docs/[...path].vue
···
364
364
@apply text-badge-orange text-sm;
365
365
}
366
366
367
-
.docs-content .docs-deprecated p {
368
-
@apply text-badge-orange text-sm mt-2 mb-0;
367
+
.docs-content .docs-deprecated-message {
368
+
@apply text-badge-orange text-sm mt-2;
369
+
}
370
+
371
+
.docs-content .docs-deprecated-message code {
372
+
@apply bg-badge-orange/20 text-badge-orange;
373
+
}
374
+
375
+
.docs-content .docs-deprecated-message .docs-link {
376
+
@apply text-badge-orange;
369
377
}
370
378
371
379
/* Parameters, Returns, Examples, See Also sections */
+4
-1
server/utils/docs/render.ts
+4
-1
server/utils/docs/render.ts
···
184
184
lines.push(`<div class="docs-deprecated">`)
185
185
lines.push(`<strong>Deprecated</strong>`)
186
186
if (deprecated.doc) {
187
-
lines.push(`<p>${parseJsDocLinks(deprecated.doc, symbolLookup)}</p>`)
187
+
// We remove new lines because they look weird when rendered into the deprecated block
188
+
// I think markdown is actually supposed to collapse single new lines automatically but this function doesn't do that so if that changes remove this
189
+
const renderedMessage = await renderMarkdown(deprecated.doc.replace(/\n/g, ' '), symbolLookup)
190
+
lines.push(`<div class="docs-deprecated-message">${renderedMessage}</div>`)
188
191
}
189
192
lines.push(`</div>`)
190
193
}
+7
-1
server/utils/docs/text.ts
+7
-1
server/utils/docs/text.ts
···
75
75
76
76
// External URL
77
77
if (target.startsWith('http://') || target.startsWith('https://')) {
78
-
return `<a href="${target}" target="_blank" rel="noopener" class="docs-link">${displayText}</a>`
78
+
return `<a href="${target}" target="_blank" rel="noreferrer" class="docs-link">${displayText}</a>`
79
79
}
80
80
81
81
// Internal symbol reference
···
115
115
116
116
// Now process the rest (JSDoc links, HTML escaping, etc.)
117
117
result = parseJsDocLinks(result, symbolLookup)
118
+
119
+
// Markdown links - i.e. [text](url)
120
+
result = result.replace(
121
+
/\[([^\]]+)\]\((https?:\/\/[^)]+)\)/g,
122
+
'<a href="$2" target="_blank" rel="noreferrer" class="docs-link">$1</a>',
123
+
)
118
124
119
125
// Handle inline code (single backticks) - won't interfere with fenced blocks
120
126
result = result
+11
-1
test/unit/docs-text.spec.ts
+11
-1
test/unit/docs-text.spec.ts
···
78
78
const result = parseJsDocLinks('{@link https://example.com}', emptyLookup)
79
79
expect(result).toContain('href="https://example.com"')
80
80
expect(result).toContain('target="_blank"')
81
-
expect(result).toContain('rel="noopener"')
81
+
expect(result).toContain('rel="noreferrer"')
82
82
})
83
83
84
84
it('should handle external URLs with labels', () => {
···
251
251
const result = await renderMarkdown(input, emptyLookup)
252
252
expect(result).toContain('<code class="docs-inline-code">code</code>')
253
253
expect(result).toContain('shiki')
254
+
})
255
+
256
+
it('should handle basic markdown links', async () => {
257
+
const result = await renderMarkdown(
258
+
'This [thing](https://example.com) is really important',
259
+
emptyLookup,
260
+
)
261
+
expect(result).toContain(
262
+
'This <a href="https://example.com" target="_blank" rel="noreferrer" class="docs-link">thing</a> is really important',
263
+
)
254
264
})
255
265
})