1473163 - devtools inspector not responding while loading external assets on slow connections

Status: NEW

(DevTools :: Inspector, defect, P3)

Description

[bram]

User Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_12_6) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/67.0.3396.99 Safari/537.36

Steps to reproduce:

Make a simple valid html file that loads various assets from external domains, for example 5 different libraries from googleapis.com.
Set network throttling in Firefox Devtools to slow network / grps connection.
Open the devtools Inspector, load/hard-refresh the page. Try to select elements on the page.

I made a screencast to demonstrate the issue: https://youtu.be/Iak8tYnG0ZI


Actual results:

The devtools inspector won't select elements on the page until all the external assets have been loaded.


Expected results:

I would expect the devtools inspector to select elements on the age, while it is loading external assets. Google Chrome 67.0.3396.99 works the way I expect.

Comment 1

[Daniel_A[:daschilean] [Please contact - [e-mail]]]

User Agent:  Mozilla/5.0 (Macintosh; Intel Mac OS X 10.13; rv:63.0) Gecko/20100101 Firefox/63.0 
Build ID: 20180705220111         
I manage to reproduce this issue on Mac 10.13 with Firefox Nightly 63.0a1 (2018-07-06) (64-bit). Please note that this issue is also displayed on Windows 10 x64.

Comment 2

[Patrick Brosset <:pbro>]

Hey Alex, I seem to remember you working not long ago on making the inspector start to show things before the load event. Can you remind me the state of things here?

Comment 3

[Alexandre Poirot [:ochameau]]

I had work in progress patches in bug 1277348 to tweak that:
immediately load the inspector and update the markup-view instead of waiting for DOMContentLoaded.
Unfortunately I dropped the ball here as I got stuck on mochitest leaks.
Note that the simple switch to DOMContendLoaded instead of load already introduced a couple of regression,
I'm expecting this new change to bring even more subtle issues. See bug 1151909 dependent bugs.