mdn
interactive examples: line numbers and code overlaps
MDN URL
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/concat
What specific section or headline is this issue about?
Array.prototype.concat()
What information was incorrect, unhelpful, or incomplete?
the demo is altered/bug
What did you expect to see?
a structured explanation
Do you have any supporting links, references, or citations?
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/concat
Do you have anything more you want to share?
No response
MDN metadata
Page report details
- Folder:
en-us/web/javascript/reference/global_objects/array/concat - MDN URL: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/concat
- GitHub URL: https://github.com/mdn/content/blob/main/files/en-us/web/javascript/reference/global_objects/array/concat/index.md
- Last commit: https://github.com/mdn/content/commit/80ac011bc87a5d72cf51659998a9b22a1a2536c5
- Document last modified: 2022-02-04T02:28:12.000Z
What information was incorrect, unhelpful, or incomplete?
the demo is altered/bug
What did you expect to see?
a structured explanation
Could you explain in a bit more detail what the problem is? I don't know what "the demo is altered/bug" means.
It's just the numbers and letters are kind of mixing in one place . I visited the site again and it's fixed. I can't speak English properly as this is my 2nd language but thank you for this platform. It's a huge help!
On Mon, May 2, 2022 at 11:30 PM wbamberg @.***> wrote:
What information was incorrect, unhelpful, or incomplete?
the demo is altered/bug What did you expect to see?
a structured explanation
Could you explain in a bit more detail what the problem is? I don't know what "the demo is altered/bug" means.
— Reply to this email directly, view it on GitHub <mdn/yari#6152>, or unsubscribe https://github.com/notifications/unsubscribe-auth/AXGP6NOBSRQACRKUVSKJJT3VH7YHPANCNFSM5U3FMIMA . You are receiving this because you authored the thread.Message ID: @.***>
Hi @cjarmada
Perhaps you could put a screenshot highlighting the bit of the text that concerns you? At the moment it is impossible to fix this because it isn't clear where you are seeing this mixing, which means we have no chance of working out why you think it is a problem.
I can't find the report now, but I wonder if this is an intermittent issue we see in interactive examples where the line numbers overlap the first couple of characters of the code. It turns out I can reproduce this in Chrome if I:
- open a page, like say https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/slice
- from the sidebar, "open in new tab" a new page, like https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/copyWithin, so it opens in the background
- switch to that new tab
@cjarmada , is this what you are seeing?
This has been reported before but was closed because noone could figure out what was causing it.
But if this is your problem I think we should transfer this issue to Yari, so we can have another go at fixing it!
No wonder I couldn't find it, it was from Kuma days: https://github.com/mdn/kuma/issues/6310.
Yes, this was it.
On Tue, May 3, 2022 at 7:52 AM wbamberg @.***> wrote:
I can't find the report now, but I wonder if this is an intermittent issue we see in interactive examples where the line numbers overlap the first couple of characters of the code. It turns out I can reproduce this in Chrome if I:
- open a page, like say https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/slice
- from the sidebar, "open in new tab" a new page, like https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/copyWithin, so it opens in the background
- switch to that new tab
[image: Screen Shot 2022-05-02 at 4 48 14 PM] https://user-images.githubusercontent.com/432915/166343677-1d9b1285-e6f8-419c-b672-5e4c9ccf5279.png
@cjarmada https://github.com/cjarmada , is this what you are seeing?
This has been reported before but was closed because noone could figure out what was causing it.
— Reply to this email directly, view it on GitHub <mdn/yari#6152>, or unsubscribe https://github.com/notifications/unsubscribe-auth/AXGP6NKI5FWMLHVBIOIORTDVIBTCDANCNFSM5U3FMIMA . You are receiving this because you were mentioned.Message ID: @.***>
open a page, like say https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/slice
from the sidebar, "open in new tab" a new page, like https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/copyWithin, so it opens in the background
switch to that new tab
Unfortunately I cannot reproduce the issue following those steps with Chrome 101 on Mac OS.
@cjarmada @wbamberg
- What Chrome version and operating system are you using?
- Could you please provide a screen recording (video) starting with a blank page (
about:blank) so that we can see exactly what steps lead to the issue?
I'm running macOS Big Sur, and see the problem with Chrome 100 (but since this has been an issue for years, it's unlikely to be a problem with a specific Chrome version).
Screen recording:
Thanks @wbamberg! I was able to reproduce it now, but only after disabling MDN Offline.
It looks like a CodeMirror bug, which doesn't set the width of the div.CodeMirror-linenumber:
And there are indeed two corresponding upstream bugs:
- https://github.com/codemirror/CodeMirror/issues/5876
- https://github.com/codemirror/CodeMirror/issues/6210
I am using this script in Tampermonkey now, to fix the issue on my end, and thought it might be worth suggesting that you'll implement the same workaround for everyone until the upstream issues have been resolved:
gist.github.com/schockocraft/mdn-fix-js-code-examples.js
If you don't wanna do this, i hope anyone who is annoyed by it will find the link here to use it for themselfes :D
