Adds Export button to code blocks in ChatGPT responses, prompts user to save code as file with predefined filename based on coding language detected from the code block's class name.
Sometimes the button was inserted after the Copy code button, so I fixed it by changing the code:
// Insert "Export" button after the language label languageLabel.parentNode.insertBefore(exportButton, languageLabel.nextSibling);
To
// Find the element containing "Copy code" let copyCodeDiv = null; const elements = header.querySelectorAll('.flex.items-center.relative.text-token-text-secondary.bg-token-main-surface-secondary.px-4.py-2.text-xs.font-sans.justify-between.rounded-t-md div'); elements.forEach(element => { if (element.innerHTML.includes('Copy code')) { copyCodeDiv = element; } });
// Insert "Export" button before the found element or append to header if not found if (copyCodeDiv) { copyCodeDiv.parentNode.insertBefore(exportButton, copyCodeDiv); } else { header.appendChild(exportButton); }
Sometimes the button was inserted after the Copy code button, so I fixed it by changing the code:
// Insert "Export" button after the language label
languageLabel.parentNode.insertBefore(exportButton, languageLabel.nextSibling);
To
// Find the element containing "Copy code"
let copyCodeDiv = null;
const elements = header.querySelectorAll('.flex.items-center.relative.text-token-text-secondary.bg-token-main-surface-secondary.px-4.py-2.text-xs.font-sans.justify-between.rounded-t-md div');
elements.forEach(element => {
if (element.innerHTML.includes('Copy code')) {
copyCodeDiv = element;
}
});
// Insert "Export" button before the found element or append to header if not found
if (copyCodeDiv) {
copyCodeDiv.parentNode.insertBefore(exportButton, copyCodeDiv);
} else {
header.appendChild(exportButton);
}