Copy To Clipboard Adds Linebreak At End Of String In Firefox

• I’ve read the contribution guidelines and agree with them

I’ve found a bug and checked that …

• … the problem doesn’t occur with the default MkDocs template
• … the problem is not in any of my customizations (CSS, JS, template)
• … the documentation does not mention anything about my problem
• … there are no open or closed issues that are related to my problem

Description

In Firefox, the copy to clipboard button on code blocks adds a linebreak/return character at the end of the string causing terminal commands to immediately execute when pasted.

Expected behavior

Clicking the copy to clipboard button for a terminal command code block and then pasting that command into a terminal should not execute the command until the enter key is pressed. This expected behavior is what happens in Chrome, Safari, and Edge (Chromium).

Actual behavior

A command copied via the copy to clipboard button is immediately executed when pasted into a terminal because it has a trailing linebreak/return character at the end of the copied string.

Steps to reproduce the bug

1. Open Firefox
2. Navigate to https://squidfunk.github.io/mkdocs-material/getting-started/
3. Click the copy to clipboard button on the pip install mkdocs-material code block
4. Paste the command into a terminal
5. Command is immediately executed instead of waiting for the return key-press

Package versions & Project configuration

I’ve omitted these since the issue is reproducible on the MkDocs for Material docs site: https://squidfunk.github.io/mkdocs-material Happy to provide more information if needed.

I fully understand if this is a low priority issue due to it only happening in Firefox. I started trying to figure out why it’s happening but I’m a bit stuck on figuring out how to get mkdocs to serve up the source maps for the js bundles and without that, I’m not making much headway looking through the minified js.

System information

• OS: Mac OS Catalina (10.15.7)

• Browser: Firefox 81

[zekefarwell]

You’re absolutely right about the python markdown parser emitting a trailing newline character. The dev tools inspector reformats html so that sort of thing isn’t always obvious. Very clear when looking at the raw html source though. I’ll open issues with python markdown and/or clipboard.js.

[squidfunk]

I’ve investigated this problem and it appears to me that it’s Firefox-specific:

If I select the whole line with the cursor, no newline is added

If I select the whole line with the cursor and move the cursor down by a little, a newline is added

If you look closely, the cursor is at the beginning of the next line, however, the command is not executed. This does not happen in Chrome.

If I press the copy-to-clipboard button, a newline is added – same behavior

If we inspect the HTML of the code block, there’s indeed a newline added to the end of it:

The exact same thing happens on the official MkDocs documentation – you can inspect the first code block under this section. If I remove the newline from the code block, it renders just as fine. For this reason, there are two possibilities to solve this:

1. Fix the Markdown Parser in Python Markdown to not emit trailing newlines.
2. Fix Clipboard.js to strip the newline in Firefox

None of that can be done as part of this project, which is why I’m closing this issue. I’m sorry we cannot do anything about it, but it only makes sense to solve this upstream.