Open Bug 1350807 Opened 4 years ago Updated 1 year ago

[icloud notes] Opening debugger freezes the browser on www.icloud.com/#notes2/

Categories

(DevTools :: Debugger, defect, P3)

53 Branch
defect

Tracking

(Not tracked)

People

(Reporter: karlcow, Unassigned)

References

(Blocks 2 open bugs)

Details

Attachments

(1 file)

With Firefox Nightly 55.0a1 (2017-03-26) (64-bit)
on MacOS 10.12.3 (16D32)
Fresh profile. No addon.

1. Go to https://www.icloud.com/
2. Login to your icloud account
3. Go to notes (https://www.icloud.com/#notes2/)
4. Type a note. Inspect the view at the insertion point.
5. You should see something along

<div class="fe-input-view-wrapper">
   <div class="fe-input-view" tabindex="1" style="left: 81px; top: 93.38px;">ざ</div>
</div>

6. There is an event associated with this markup. Click on it. If you locally look at the JS code (the widget view). This is ok.
7. If you ask to go to the script. The full browser gradually freezes with CPU > 100%

This is reproducible but instead of inspecting the content, just open the debugger. Everything is freezing again. 

The only way to get out is to force quit and restart.
Flags: needinfo?(feo53184)
Product: Firefox → DevTools
Karl, we fixed a lot of hangs during load in the last 2 release. I can't see a massive hang anymore; can you try?
Flags: needinfo?(feo53184) → needinfo?(kdubost)
Attached image event in the inspector
This is the event in question.
As of today, the click is taking a hell of a time to execute and it still fails with an unresponsive script.

```
Script: chrome://devtools/content/sour…odemirror/codemirror.bundle.js:1
```

And then the CPU goes to 100%.
Click on continue. CPU still 100%.
It goes to debugger with Unresponsive script. ahaha I even had a 198% CPU. :)

Second click on Continue.
And it displays the debugger.

Then trying to click on pretty print and again high CPU.


Console output


                                   *********                           
                             *******       *******                     
                           ***                    ***                  
                         **                         **                 
                *****   **                           ***               
             ****   *****                              **              
           **                                           **             
          *                                              *             
         **              **                **            *             
      ****               **        **      **           ******         
    **                   **        **      **                 ****     
  ***                              **                            ***   
  *                                **                              **  
 *                               ****                               *  
 *                                                                  *  
**                                                                  ** 
*                            **         **                           * 
**                            ***********                            * 
 *                                ***                               ** 
  **                                                               **  
   ***                                                            **   
      ****                                                     ****    
         ****                                               ****       
            *************************************************          
 
 Happy to see you here! We are hiring the sharpest minds in the
 industry who want to build the most sophisticated and delightful
 applications on the web.
 
 Check out https://www.icloud.com/jobs/
 
javascript-packed.js line 146 > eval:3:781
Content Security Policy: Ignoring ‘x-frame-options’ because of ‘frame-ancestors’ directive.

                                   *********                           
                             *******       *******                     
                           ***                    ***                  
                         **                         **                 
                *****   **                           ***               
             ****   *****                              **              
           **                                           **             
          *                                              *             
         **              **                **            *             
      ****               **        **      **           ******         
    **                   **        **      **                 ****     
  ***                              **                            ***   
  *                                **                              **  
 *                               ****                               *  
 *                                                                  *  
**                                                                  ** 
*                            **         **                           * 
**                            ***********                            * 
 *                                ***                               ** 
  **                                                               **  
   ***                                                            **   
      ****                                                     ****    
         ****                                               ****       
            *************************************************          
 
 Happy to see you here! We are hiring the sharpest minds in the
 industry who want to build the most sophisticated and delightful
 applications on the web.
 
 Check out https://www.icloud.com/jobs/
 
javascript.js:3:781
Content Security Policy: Ignoring ‘x-frame-options’ because of ‘frame-ancestors’ directive.
Successfully compiled asm.js code (total compilation time 30ms; stored in cache) main.js
Successfully compiled asm.js code (total compilation time 55ms; stored in cache) main.js
Successfully compiled asm.js code (total compilation time 39ms; stored in cache) main.js
Successfully compiled asm.js code (total compilation time 2ms; not stored in cache (too small to benefit)) main.js
Source map error: request failed with status 504
Resource URL: https://cdn.apple-cloudkit.com/ck/2/cloudkit.js
Source Map URL: resources/cloudkit.js.map[Learn More]
Flags: needinfo?(kdubost)
The only difference probably is that the freeze didn't create a crash.
:karlcoow, I see it now. Worked the first time to open the debugger but doesn't load at all the second time. I can't see a hang though, it just fails.

Could you attach a perf profile, please?
Flags: needinfo?(kdubost)
so first time. 
https://perfht.ml/2MNBRJB
No CPU jumping here, but also the request to open the debugger (clicking on the event widget) is never happening.


Second attempt. 

0. I'm opening the devtools
1. I'm going to the debugger
2. then going to main.js
3. Switch to performance panel and starts recording.

   3.1 back to the browser window.
   3.2 inspect element
   3.3 click on event 
   3.4 click on the arrow to go to the debugger.

This time it worked (when the script has been previously opened in the debugger). (CPU is super high)
https://perfht.ml/2pnExnH
Flags: needinfo?(kdubost)
The CPU is still high a couple of minutes later without interacting with the browser.
Got the hang reproduced and a profile (partially tracking the slow script dialog).

This part shows CodeMirror churning on String::indexOf: https://perfht.ml/2QPTbk2
And another one, 30sec this time: https://perfht.ml/2QLPBYe

The file it tries to open is https://www.icloud.com/applications/notes2/1817Project53/en-us/main.js , 2.55 Mb uncompressed JS

Previewing the file in Netmonitor's Response tab works fine, so I its not rendering the file that causes CodeMirror to fall over but something Debugger adds on top.
Flags: needinfo?(jlaster)
Thanks, the perf.html recording is cryptic. I'll take a look though
Flags: needinfo?(jlaster)
Blocks: dbg-perf
Priority: -- → P3

I feel l9ke opening any sufficiently large source file causes this. It may make sense to stop using HTML-based editing components and use Scintilla for that.

Harald, would you be up for re-profiling?

Flags: needinfo?(hkirschner)

Using event listener breakpoints (input), typing a note, and trying to pause I still get multiple slow script warnings in a row: Script: chrome://devtools/content/shar…odemirror/codemirror.bundle.js:1

Profile: https://perfht.ml/2JnEjIe . The parser worker is busy parsing and CodeMirror is churning on CodeMirror</Et.prototype.column

Flags: needinfo?(hkirschner)
You need to log in before you can comment on or make changes to this bug.