Copying code blocks from markdown removes new lines on Firefox

[innocenzi]

Environment

Irrelevant

Reproduction

https://content.nuxtjs.org/get-started

Describe the bug

When writing code blocks in markdown, the generated HTML uses <span class="line"> elements to represent a line.

This would be perfectly fine if Firefox was taking display: block into account and was rendering new lines when copying, like Chrome or Safari, but it does not.

For instance, copying a multi-line code block from the docs from Firefox would copy that:

export default defineNuxtConfig({  modules: [    '@nuxt/content'  ],  content: {    // https://content.nuxtjs.org/api/configuration  }})

The expected result would be, of course, the original snippet:

export default defineNuxtConfig({
  modules: [
    '@nuxt/content'
  ],
  content: {
    // https://content.nuxtjs.org/api/configuration
  }
})

If there's a CSS work-around for adding new lines, this would be a potential fix. Otherwise, I suggest replacing the generated span with div, which behaves as expected.

Additional context

No response

Logs

No response

[nobkd]

If you want to copy the whole block, you can use the copy button in the corner. That preserves the newlines.

But you're right, that this should be fixed somehow.

[nobkd]

Line breaks are only removed (in Firefox), when a code block is highlighted

[innocenzi]

Is the copy button a Docus thing? I don't have it in my own app.

EDIT: looks like it's a nuxt-themes/typography thing.

[farnabaz]

Released in v2.5.0 thanks to @nobkd 🎉