wcoder/highlightjs-line-numbers.js

Copying not correctly working (spaces between lines)

Snakzi opened this issue · 9 comments

Snakzi commented

If I copy code, it puts white spaces between lines

wcoder commented

Hi @Smythu, thank you for the report!

wcoder commented

Hi @Smythu, please check new version of the plugin v2.5 (available in npm) or via link:

https://cdn.jsdelivr.net/npm/highlightjs-line-numbers.js@2.5.0/dist/highlightjs-line-numbers.min.js

Snakzi commented

@wcoder problem still persists! just try to select the code, copy it and put it in a text file. you'll see that there will be whitespaces between every line.

wcoder commented

@Smythu I created a simple demo to reproduce: https://jsfiddle.net/evgeniypakalo/bo52w43u/
after that I tried to copy code and paste to the text editor:
screen shot 2018-10-15 at 21 53 47
looks good 😄

Which styles/theme/code for highlighting do you use?

Snakzi commented

Your fiddle doesnt work for me:

https://imgur.com/a/trd52OD

anlambert commented

I confirm that I can reproduce the issue from my side but only when using Firefox (copy/paste works as expected with Chrome).

Nevertheless, disabling lines numbering makes copy/paste work as expected with Firefox so there
is definitely something wrong here.

rn4n commented

Can reproduce it on Edge too.

| Microsoft Edge     | 44.18312.1001.0  |
| Microsoft EdgeHTML | 18.18312         |
anlambert commented

This seems related to the fact that when using highlightjs-line-numbers, the code is wrapped into a <table> element. This table is itself contained in a <pre> element which seems the cause of the issue. There is an official bug report for Firefox with more details here: https://bugzilla.mozilla.org/show_bug.cgi?id=1273836

taufik-nurrohman commented

Time to switch to CSS table?

  • display: table-row for each code line
  • display: table-cell for number and code columns