diff --git a/.changeset/techdocs-not-that-many-copies.md b/.changeset/techdocs-not-that-many-copies.md
new file mode 100644
index 0000000000..f0507a8157
--- /dev/null
+++ b/.changeset/techdocs-not-that-many-copies.md
@@ -0,0 +1,5 @@
+---
+'@backstage/plugin-techdocs': patch
+---
+
+Fixed a bug where copy-to-clipboard buttons were appended to unintended elements.
diff --git a/plugins/techdocs/src/reader/transformers/copyToClipboard.test.ts b/plugins/techdocs/src/reader/transformers/copyToClipboard.test.ts
index 679121d9bd..daa074f6e4 100644
--- a/plugins/techdocs/src/reader/transformers/copyToClipboard.test.ts
+++ b/plugins/techdocs/src/reader/transformers/copyToClipboard.test.ts
@@ -32,7 +32,7 @@ describe('copyToClipboard', () => {
- ${expectedClipboard}
+ ${expectedClipboard}
`,
@@ -46,4 +46,25 @@ describe('copyToClipboard', () => {
expect(clipboardSpy).toHaveBeenCalledWith(expectedClipboard);
});
+
+ it('only gets applied to code blocks', async () => {
+ const expectedClipboard = 'function foo() {return "bar";}';
+ const shadowDom = await createTestShadowDom(
+ `
+
+
+
+ ${expectedClipboard}
+
+
+ `,
+ {
+ preTransformers: [],
+ postTransformers: [copyToClipboard()],
+ },
+ );
+
+ const copyButton = shadowDom.querySelector('button');
+ expect(copyButton).toBe(null);
+ });
});
diff --git a/plugins/techdocs/src/reader/transformers/copyToClipboard.ts b/plugins/techdocs/src/reader/transformers/copyToClipboard.ts
index 24b46c0b85..d0569c0fd9 100644
--- a/plugins/techdocs/src/reader/transformers/copyToClipboard.ts
+++ b/plugins/techdocs/src/reader/transformers/copyToClipboard.ts
@@ -22,7 +22,7 @@ import type { Transformer } from './transformer';
*/
export const copyToClipboard = (): Transformer => {
return dom => {
- Array.from(dom.querySelectorAll('code')).forEach(codeElem => {
+ Array.from(dom.querySelectorAll('pre > code')).forEach(codeElem => {
const button = document.createElement('button');
const toBeCopied = codeElem.textContent || '';
button.className = 'md-clipboard md-icon';