Brave-browser: Code syntax highlighting in dev tools missing for sources tab?

[tiagosiebler]

Description

Updated to the latest version today, and it seems all syntax highlighting in dev tools has disappeared. This worked in the previous version. This works in the latest version of Google Chrome.

Steps to Reproduce

1. Open dev tools
2. Navigate to "sources" tab
3. Find a "js" file. Doesn't matter if beautified or not.

Actual result:

No syntax highlights:

Expected result:

Syntax highlights, as still seen in chrome dev tools:

Reproduces how often:

Every time, easily reproduced.

Brave version (brave://version info)

Brave | 1.1.21 Chromium: 79.0.3945.79 (Official Build) (64-bit)
-- | --
Revision | 29f75ce3f42b007bd80361b0dfcfee3a13ff90b8-refs/branch-heads/3945@{#916}
OS | macOS Version 10.14.6 (Build 18G103)
JavaScript | V8 7.9.317.31
Flash | (Disabled)
User Agent | Mozilla/5.0 (Macintosh; Intel Mac OS X 10_14_6) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/79.0.3945.79 Safari/537.36
Command Line | /Applications/Brave Browser.app/Contents/MacOS/Brave Browser --enable-dom-distiller --disable-domain-reliability --no-pings --extension-content-verification=enforce_strict --extensions-install-verification=enforce --enable-oop-rasterization=Enabled --sync-url=https://no-thanks.invalid --enable-features=PasswordImport,WebUIDarkMode,SimplifyHttpsIndicator --disable-features=AutofillServerCommunication,WebXR,LookalikeUrlNavigationSuggestionsUI,NotificationTriggers,SyncUSSBookmarks,AllowPopupsDuringPageUnload,WebXrGamepadModule,UnifiedConsent,AudioServiceOutOfProcess,SmsReceiver --flag-switches-begin --enable-features=PasswordImport,WebUIDarkMode,SimplifyHttpsIndicator,fill-on-account-select --flag-switches-end --enable-audio-service-sandbox --disable-webrtc-apm-in-audio-service
Executable Path | /Applications/Brave Browser.app/Contents/MacOS/Brave Browser
Profile Path | /Users/tsiebler/Library/Application Support/BraveSoftware/Brave-Browser/Default

Chrome version where this issue is not seen:

Google Chrome | 79.0.3945.79 (Official Build) (64-bit)
-- | --
Revision | 29f75ce3f42b007bd80361b0dfcfee3a13ff90b8-refs/branch-heads/3945@{#916}
OS | macOS Version 10.14.6 (Build 18G103)
JavaScript | V8 7.9.317.31
Flash | 32.0.0.303 /Users/tsiebler/Library/Application Support/Google/Chrome/PepperFlash/32.0.0.303/PepperFlashPlayer.plugin
User Agent | Mozilla/5.0 (Macintosh; Intel Mac OS X 10_14_6) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/79.0.3945.79 Safari/537.36
Command Line | /Applications/Google Chrome.app/Contents/MacOS/Google Chrome --flag-switches-begin --enable-devtools-experiments --flag-switches-end --enable-audio-service-sandbox
Executable Path | /Applications/Google Chrome.app/Contents/MacOS/Google Chrome
Profile Path | /Users/tsiebler/Library/Application Support/Google/Chrome/Default
Variations | 202c099d-377be55ac7fc8f8f-ca7d8d807a26526b-ca7d8d80976622d1-2f7099702b6ab552-ca7d8d80f88a4127-ca7d8d80273268f8-ca7d8d80ec446204-ca7d8d80f33d9fff-ca7d8d80591560a-39160644e84c8bf2-377be55ae7f526b8-ca7d8d80134b243-ca7d8d80fcedb5cf-ca7d8d80afb5d7b8-ca7d8d803095aa95-3f4a17df58b09e02-984afc5b7c1bc906-f55a7974e4b1ae4a-ca7d8d804fd665d-ca7d8d807ecf6693-377be55a62e2a05b-ca7d8d80b5c69395-ca7d8d80a582a1b8-ad75ce178b943c2e-ca7d8d807c38c690-ca7d8d8012d31e2-377be55ae4a357e9-ca7d8d801745b01c-f9a4370311ee74ba-377be55a32b876d7-12ede6a237bfb3e1-ca7d8d80693a1022-12ede6a2991ddaf4-377be55a6a116980-ca7d8d80f742e6d6-377be55a142e58d7-ca7d8d8029c62d4-ca7d8d804c46d7b7-aaabdd8723d250bd-ca7d8d80408aa130-ca7d8d809e5c75f1-2d7df14ed8692482-d5f9c68519226de3-4fd97df049650e34-a33592df913f596c-ca7d8d8040d0d1dc-ca7d8d80227e3d3d-ca7d8d80ce12bb93-ca7d8d804ea303a6-ecbb250e9dbcde90-ca7d8d805417468-ca7d8d80904426fa-ca7d8d809c21deb7-377be55ac53a0941-ca7d8d8058a025e3-36e97b2c28be2392-ca7d8d801a298d67-ca7d8d80a372e609-ca7d8d802e7f6029-377be55a26464629-ca7d8d80cbc5b603-ca7d8d801354da85-ca7d8d808239ce46-ca7d8d80494d8760-52325d43f47ae82a-746c2ad43ac60855-486e2a9cf296190c-30f715f34442aae2-6e3b1976ed1d377-e1cc0f1475f0f0a0-6bdfffe7e2b18481-4c073154e7e71889-4ad60575b0a361bc-ca7d8d80cc122d59-3d47f4f4ae4c75f9-ca7d8d80af72417-ca7d8d8047a2af3f-1f8c5973a5fa7f3a-ca7d8d807e91b7bd-c6da37cb

Version/Channel Information:

• Can you reproduce this issue with the current release?
  yes
• Can you reproduce this issue with the beta channel?
  not tested, same for below
• Can you reproduce this issue with the dev channel?
• Can you reproduce this issue with the nightly channel?

Other Additional Information:

• Does the issue resolve itself when disabling Brave Shields?
  N/a, seen on new tab page too.
• Does the issue resolve itself when disabling Brave Rewards?
  N/a
• Is the issue reproducible on the latest version of Chrome?
  No
  

  Miscellaneous Information:

[bsclifton]

Thanks for the report, @tiagosiebler! This is something we've fixed in Developer and Nightly versions of Brave (1.3 and higher) with https://github.com/brave/brave-core/pull/4044

In those versions, there is a new setting you can enabled Remote Debugging under brave://settings/privacy which will fix this. I've created a pull request to try and pull this in earlier (1.2, which ships ~January 6) with https://github.com/brave/brave-core/pull/4228

[tiagosiebler]

Can this be moved up in prio, it's pretty painful for heavy dev tools usage...

[MRVDH]

@bsclifton I don't think this is a duplicate of the remote debugging issue. I don't use remote debugging, just regular pages in the browser.

[tiagosiebler]

@bsclifton I missed that your comment was focused on remote debugging. I can reproduce this on regular pages too. My screenshot is from the default "new tab" page in Brave vs Chrome.

[bsclifton]

The remote codepath comes into play when sources are fetched (it might be grabbing the source maps). When remote debugging is disabled, those calls aren't allowed. When it is enabled, the call to fetch works and then syntax highlighting will work

[tiagosiebler]

@bsclifton does this apply even for files that don't have/need a source map? E.g:

[bsclifton]

@tiagosiebler I believe so; I'm not sure what is fetched. Would need to do a network trace to see. But you can test on Nightly if you wanted to verify (even if you just uninstall Nightly after testing):
https://brave.com/download-nightly/

[tiagosiebler]

Tried on nightly, it shows the same issue - all highlighting is missing:

Can you verify on your side?

[bsclifton]

Tried on nightly, it shows the same issue - all highlighting is missing:

Can you verify on your side?

did you go to brave://settings/privacy and enable Remote Debugging?

[tiagosiebler]

Ah my bad, that seems to have worked! Rushed the test a little too much... would still love to see if this can be moved up in prio. Thanks!

[bsclifton]

Now I'm curious what it's doing... it may be running the source file through a web service? (to format? or help with highlighting?). Whatever the case, a remote call is made which is why we blocked it in the first place 😄

This is on track to be included in the Release channel build deploying January 6th 😄

[tiagosiebler]

Now I'm curious what it's doing... it may be running the source file through a web service? (to format? or help with highlighting?).

Wait, will it start sending my protected source code to somewhere on the internet? Did I understand that correctly?

[MRVDH]

Thank you for the Information, Brian :)

[bsclifton]

Now I'm curious what it's doing... it may be running the source file through a web service? (to format? or help with highlighting?).

Wait, will it start sending my protected source code to somewhere on the internet? Did I understand that correctly?

I'm not sure - that's why we've disabled it by default, because we haven't had time to audit this default behavior in Chromium

[tiagosiebler]

Weird, would be really good to confirm. Would be kind of naughty to be sending source code around without opt-in or warning... browser-based source is one thing, but connected node apps

[alwaysonfire]

Im experiencing this on Google Chrome. Anyone has an idea?

[westy]

I'm getting this on Google Chrome this morning too.
It's incredibly frustrating.

Seems to have broken the ability to mouse over variables and objects too.

[bsclifton]

@westy that bug is happening with Chrome - it's being tracked with https://bugs.chromium.org/p/chromium/issues/detail?id=1033022

@westy are you getting it even with Chrome 79.0.3945.117? Bug thread is showing it as fixed; it's also included in that release with this commit:
https://chromium.googlesource.com/chromium/src/+/40155350d88b079158ad74cceb3f7cc07f7868fd

We'll be releasing this Chromium update to Brave later today 😄 You can view all the new Chromium commits included here:
https://chromium.googlesource.com/chromium/src/+log/79.0.3945.88..79.0.3945.117/?pretty=fuller&n=10000

[westy]

Been using Firefox all day - it's come on nicely since I last used it in anger I must say.
Finding source files is better than Chrome I think.

@bsclifton But yeah, just reloaded Chrome, it updated to 79.0.3945.117 and the highlighting is back.

[alwaysonfire]

Still experiencing this.
Chrome: Version 79.0.3945.117 (Official Build) (64-bit)

[bsclifton]

@alwaysonfire do you have Remote Debugging enabled under brave://settings/privacy?

We're going to look at proxying the calls made and enabling by default (see https://github.com/brave/brave-browser/issues/7645)... but currently, it's something you need to manually enable

[alwaysonfire]

I am currently using Google Chrome. I can't seem to find a Remote Debugging here.

[bsclifton]

@alwaysonfire oh ok- Chrome doesn't have that; they make requests to Google servers without any settings changes

Sounds like there might be a new bug in Chromium? You can create a new issue at https://crbug.com