Skip to content

fix: decode HTML entities in anchor modal title #544

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
rdmueller merged 2 commits into from
May 29, 2026
Merged

fix: decode HTML entities in anchor modal title #544

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
3c825b7
fix: decode HTML entities in anchor modal title
raifdmueller May 29, 2026
89d3d52
chore: allow DOMParser browser global in ESLint config
raifdmueller May 29, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 1 addition & 0 deletions website/eslint.config.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -18,6 +18,7 @@ const browserGlobals = {
setInterval: 'readonly',
clearInterval: 'readonly',
HTMLElement: 'readonly',
DOMParser: 'readonly',
Event: 'readonly',
CustomEvent: 'readonly',
KeyboardEvent: 'readonly',
Expand Down
9 changes: 6 additions & 3 deletions website/src/components/anchor-modal.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -238,9 +238,12 @@ export async function loadAnchorContent(anchorId) {
},
})

// Extract title from HTML or use anchor ID
const titleMatch = htmlContent.match(/<h1[^>]*>([^<]+)<\/h1>/)
const title = titleMatch ? titleMatch[1] : anchorId
// Extract title from HTML or use anchor ID.
// Parse via DOMParser so entities like &amp; decode to their characters —
// setting textContent on a regex-captured string would render
// "Strunk &amp; White" literally (regressed twice; keep this DOM round-trip).
const h1El = new DOMParser().parseFromString(htmlContent, 'text/html').querySelector('h1')
Comment thread
coderabbitai[bot] marked this conversation as resolved.
const title = h1El ? h1El.textContent.trim() : anchorId

titleEl.textContent = title
// Safe: htmlContent is generated by asciidoctor from .adoc files served from our own origin
Expand Down
13 changes: 13 additions & 0 deletions website/src/components/anchor-modal.test.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -129,6 +129,19 @@ describe('anchor-modal', () => {
expect(global.fetch).toHaveBeenCalledWith(expect.stringContaining('test-anchor.adoc'))
})

it('should decode HTML entities in the modal title (regression)', async () => {
global.fetch.mockResolvedValue({
ok: true,
text: async () => '= Plain English according to Strunk & White\n\nBody.',
})

await showAnchorDetails('plain-english-strunk-white')

const title = document.getElementById('modal-title').textContent
expect(title).toBe('Plain English according to Strunk & White')
expect(title).not.toContain('&amp;')
})

it('should handle fetch errors gracefully', async () => {
global.fetch.mockRejectedValue(new Error('Network error'))

Expand Down
Loading