feat(xref): copy a citation to the clipboard when its cell is clicked#529
Conversation
| <td>${entry.shortname}</td> | ||
| <td>${entry.type}</td> | ||
| <td>${cite}</td> | ||
| <td><button type="button" class="cite-cell" title="Copy citation">${cite}</button></td> |
There was a problem hiding this comment.
a11y wise, I think the copy button should be dedicated copy button. Like:
<td>${cite} <button>Copy</button></td>There was a problem hiding this comment.
Reworked this for a11y. Each citation is now its own real <button class="cite"> (the citation text is the button), so clicking/tapping the citation copies it and the <td> keeps its native cell role — no role="button" on the cell. Dropped the per-button title (it became a redundant description repeated on every button) in favour of aria-label="Copy citation …", and a role="status" toast confirms the copy.
| // Builds the citation text for the clipboard, turning the <br> separators | ||
| // between multiple `for` contexts into newlines so each citation is on its | ||
| // own line (textContent alone would concatenate them with no separator). | ||
| function citeTextFromCell(cell) { | ||
| return [...cell.childNodes] | ||
| .map(node => (node.nodeName === 'BR' ? '\n' : node.textContent)) | ||
| .join('') | ||
| .trim(); | ||
| } |
There was a problem hiding this comment.
Should it copy one item only? I don't see the benefit of copying multiple options at once, given only one need to be used. Maybe it can copy the least/most specific one?
There was a problem hiding this comment.
Good call — it now copies one item only. Each for-context citation is rendered as its own button with its own click target, so clicking e.g. [=stack/item=] copies just that one citation rather than all the options joined together.
08ba987 to
f6097b6
Compare
Each citation in the How to Cite column is its own button; clicking or tapping it copies just that citation, with a toast confirmation. Citation buttons carry an aria-label (Copy citation …) for screen readers and keep the table cell's native role.
f6097b6 to
9f12015
Compare
Mirror clipboard.test.js: throw a clear error if the vm slice no longer captures the citation helpers (e.g. after a rename), instead of silently testing the wrong region.
Render each citation as its own button so a click or Enter/Space copies just that citation to the clipboard, with a toast. Second of three PRs splitting #495; adds tests.
Landing order: land after #497 and rebase onto main; #497, #529, #511 all edit
static/xref/script.js. Suggested batch order: #499, #500, #501, #497, #529, #511 (#424 independent).