25

Google Chrome pushed an update earlier this month, 60.0.3112.101, which makes it impossible to format code containing long lines. Maybe it even started in an earlier version, I just now noticed it:

<textarea cols="20" rows="10">01234567890123456789</textarea>

When running the snippet, try to put four spaces at the start of the "0123..." line. After two spaces, the browser will automatically insert a line break. This of course breaks the intended formatting.

Not really sure this is on-topic for Meta, but wanted to post it to warn others.

I noticed it while editing this post on Windows 10. I wanted to turn:

services.AddDbContext<DataContext>(options => options.UseSqlServer(Configuration["ConnectionStrings:LocalConnectionString"]));

Into:

services.AddDbContext<DataContext>(options => 
    options.UseSqlServer(Configuration["ConnectionStrings:LocalConnectionString"]));

For readability, but can now no longer do that from the browser. Try editing this Meta post and prepending spaces to the line starting with options above.

Note: copy-pasting four spaces does bypass this ridiculous behavior, so it's not even implemented consistently. I can't find the change yet in Chrome's release notes.

12
  • Hmm. I have 60.0.3112.101 and I'm not getting a line break. I do have user scripts so maybe those a helping? Commented Aug 24, 2017 at 11:56
  • 4
    I've seen this for a few days now, it's intensely annoying.
    – DavidG
    Commented Aug 24, 2017 at 11:57
  • 1
    I've seen this before but instead of putting four spaces I've had to select the code button. Didn't think it was browser specific so never really took much notice.
    – Bugs
    Commented Aug 24, 2017 at 11:58
  • @Nathan it's on Windows, don't know if that matters.
    – CodeCaster
    Commented Aug 24, 2017 at 11:58
  • 1
    Yet another reason why IE will always be the superior internet browser. /s (joking aside. I get line breaks as mentioned. Chrome 60.0.3112.101 Win 7)
    – I haz kode
    Commented Aug 24, 2017 at 11:58
  • Not sure. I've got Win7 pro 64 bit. Although this update did break a website I use. I cant log into anymore. Hopefully they update soon. Commented Aug 24, 2017 at 11:58
  • 1
    @Ihazkode Firefox master race!
    – user247702
    Commented Aug 24, 2017 at 12:06
  • 4
    Chrome always regresses somewhere with every major release, it's comical (I tried keeping track of each thing that broke from version 39 to around 43 before I quickly got tired of it). The majority of these do get fixed by the next release, but not even Internet Explorer suffered from regressions every single release.
    – BoltClock Mod
    Commented Aug 24, 2017 at 14:27
  • @BoltClock there's also a funny new bug (or perhaps a regression): for every character you type in the post editor on (meta) Stack Overflow, the favicon blinks...
    – CodeCaster
    Commented Aug 24, 2017 at 15:24
  • 3
    @CodeCaster: Which just reminds me of this: google.com/googlebooks/chrome/big_24.html
    – BoltClock Mod
    Commented Aug 24, 2017 at 15:35
  • 2
    Reproduced it in Chrome for MacOS version 59.0.3071.115.
    – Gimby
    Commented Aug 24, 2017 at 15:42
  • MacOS 61.0.3163.59 (beta) - There's a linebreak after a single space for me. Commented Aug 24, 2017 at 15:51

1 Answer 1

7

Chrome broke white-space: pre-wrap (i.e. it no longer follows the spec). The alternative would be to use white-space: pre but that will affect text as well, which may be less than ideal.

<textarea cols="20" rows="10" style="white-space: pre">01234567890123456789</textarea>

8
  • 5
    Yeah but ... no.
    – CodeCaster
    Commented Aug 24, 2017 at 15:57
  • 6
    The line break that's inserted is an actual newline character. I've never heard of Internet Explorer ever breaking CSS so hard that it mutates the DOM. I've said for many years that Chrome and Safari are the new IE, but I think Chrome has truly outdone IE on this one.
    – BoltClock Mod
    Commented Aug 24, 2017 at 16:56
  • The alternative would be to use Safari, Firefox, Opera, Edge, ...
    – Cœur
    Commented Aug 24, 2017 at 16:56
  • 2
    (Before anyone mentions crashing IE6 with CSS, several years ago one of my media queries started crashing Chrome while I wasn't looking, and it would seem I wasn't the only one affected.)
    – BoltClock Mod
    Commented Aug 24, 2017 at 17:22
  • Interestingly, querying the DOM does not show any newline characters being inserted nor does it appear as a newline character when using the element inspector @BoltClock. This seems to be purely a rendering bug.
    – user4639281
    Commented Aug 24, 2017 at 17:37
  • 1
    @Tiny Giant: I tried it again, experimenting with different numbers of keystrokes, and I found that the text simply soft-wraps after the first two spaces are inserted, without a newline; however, a newline is created after the third keystroke, and only then. I was able to confirm this by copying the snippet from the question and adding a keyup listener to log the content length (which is shown to increase by 2 after the third keystroke), as well as copying the content out of the textarea into a text editor.
    – BoltClock Mod
    Commented Aug 24, 2017 at 17:44
  • 1
    @BoltClock Sorry, I was looking at the textContent not the value. Apparently both textContent and innerHTML trim the whitespace. It does in fact insert a newline into the value.
    – user4639281
    Commented Aug 24, 2017 at 17:53
  • 6
    So... considering they're throwing the spec out the window for no apparent benefit, shouldn't we just file a bug report?
    – Siguza
    Commented Aug 26, 2017 at 23:38

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .