Changeset 193646 in webkit


Ignore:
Timestamp:
Dec 7, 2015 12:57:35 PM (8 years ago)
Author:
BJ Burg
Message:

Web Inspector: Uncaught Exception page should have better styles and handle more error cases
​https://bugs.webkit.org/show_bug.cgi?id=151923

Reviewed by Timothy Hatcher.

Source/WebCore:

Add a check for InspectorFrontendAPI before calling it. This can fail
easily if an uncaught exception stalls initial loading, or whenever
the Inspector frontend is reloaded.

  • inspector/InspectorFrontendClientLocal.cpp:

(WebCore::InspectorFrontendClientLocal::evaluateOnLoad):

Source/WebInspectorUI:

Restructure the Uncaught Exception reporting page to act more like
a modal sheet. Distinguish between uncaught exceptions before and
after the frontend is initially loaded. If the frontend is loaded,
add a clickable link that dismisses the sheet and ignores the error.
If the inspector finished loading, then only show at most one
exception at a time, since subsequent interactions can cause spurious
errors when the sheet is active.

Split existing code into multiple functions so it's easier to follow.
Add miscellaneous guards against internal corruption and weird cases.

  • UserInterface/Base/Main.js:

(WebInspector.contentLoaded): Store the flag on the global object
in case WebInspector becomes shadowed or otherwise unusable.

  • UserInterface/Debug/UncaughtExceptionReporter.css: Renamed from Source/WebInspectorUI/UserInterface/Debug/CatchEarlyErrors.css.

(div.sheet-container):
(div.uncaught-exception-sheet):
(div.uncaught-exception-sheet a):
(div.uncaught-exception-sheet a:active):
(div.uncaught-exception-sheet h2):
(div.uncaught-exception-sheet h1 > img):
(div.uncaught-exception-sheet h2 > img):
(div.uncaught-exception-sheet dl):
(div.uncaught-exception-sheet dt):
(div.uncaught-exception-sheet dd):
(div.uncaught-exception-sheet ul):
(div.uncaught-exception-sheet li):

  • UserInterface/Debug/UncaughtExceptionReporter.js: Renamed from CatchEarlyErrors.js.

(stopEventPropagation): Allow clicking whitelisted links on the sheet.
(blockEventHandlers):
(unblockEventHandlers):
(handleUncaughtException):
(dismissErrorSheet):
(createErrorSheet.insertWordBreakCharacters):
(createErrorSheet):
(handleLinkClick):

  • UserInterface/Main.html:
  • UserInterface/Protocol/MessageDispatcher.js:

(WebInspector.dispatchMessageFromBackend): Don't try to dispatch
messages from the backend when showing the error sheet. They will
probably fail, so suspend dispatching until the sheet is dismissed.

Location:
trunk/Source
Files:
1 added
1 deleted
6 edited
1 moved

Legend:

Unmodified
Added
Removed

  • trunk/Source/WebCore/ChangeLog

    r193645 r193646  
     12015-12-07  Brian Burg  <bburg@apple.com>
     2
     3        Web Inspector: Uncaught Exception page should have better styles and handle more error cases
     4        https://bugs.webkit.org/show_bug.cgi?id=151923
     5
     6        Reviewed by Timothy Hatcher.
     7
     8        Add a check for InspectorFrontendAPI before calling it. This can fail
     9        easily if an uncaught exception stalls initial loading, or whenever
     10        the Inspector frontend is reloaded.
     11
     12        * inspector/InspectorFrontendClientLocal.cpp:
     13        (WebCore::InspectorFrontendClientLocal::evaluateOnLoad):
     14
    1152015-12-07  Beth Dakin  <bdakin@apple.com>
    216

  • trunk/Source/WebCore/inspector/InspectorFrontendClientLocal.cpp

    r192756 r193646  
    372372{
    373373    if (m_frontendLoaded)
    374         m_frontendPage->mainFrame().script().executeScript("InspectorFrontendAPI.dispatch(" + expression + ")");
     374        m_frontendPage->mainFrame().script().executeScript("if (InspectorFrontendAPI) InspectorFrontendAPI.dispatch(" + expression + ")");
    375375    else
    376376        m_evaluateOnLoad.append(expression);

  • trunk/Source/WebInspectorUI/ChangeLog

    r193615 r193646  
     12015-12-07  Brian Burg  <bburg@apple.com>
     2
     3        Web Inspector: Uncaught Exception page should have better styles and handle more error cases
     4        https://bugs.webkit.org/show_bug.cgi?id=151923
     5
     6        Reviewed by Timothy Hatcher.
     7
     8        Restructure the Uncaught Exception reporting page to act more like
     9        a modal sheet. Distinguish between uncaught exceptions before and
     10        after the frontend is initially loaded. If the frontend is loaded,
     11        add a clickable link that dismisses the sheet and ignores the error.
     12        If the inspector finished loading, then only show at most one
     13        exception at a time, since subsequent interactions can cause spurious
     14        errors when the sheet is active.
     15
     16        Split existing code into multiple functions so it's easier to follow.
     17        Add miscellaneous guards against internal corruption and weird cases.
     18
     19        * UserInterface/Base/Main.js:
     20        (WebInspector.contentLoaded): Store the flag on the global object
     21        in case WebInspector becomes shadowed or otherwise unusable.
     22
     23        * UserInterface/Debug/UncaughtExceptionReporter.css: Renamed from Source/WebInspectorUI/UserInterface/Debug/CatchEarlyErrors.css.
     24        (div.sheet-container):
     25        (div.uncaught-exception-sheet):
     26        (div.uncaught-exception-sheet a):
     27        (div.uncaught-exception-sheet a:active):
     28        (div.uncaught-exception-sheet h2):
     29        (div.uncaught-exception-sheet h1 > img):
     30        (div.uncaught-exception-sheet h2 > img):
     31        (div.uncaught-exception-sheet dl):
     32        (div.uncaught-exception-sheet dt):
     33        (div.uncaught-exception-sheet dd):
     34        (div.uncaught-exception-sheet ul):
     35        (div.uncaught-exception-sheet li):
     36        * UserInterface/Debug/UncaughtExceptionReporter.js: Renamed from CatchEarlyErrors.js.
     37        (stopEventPropagation): Allow clicking whitelisted links on the sheet.
     38        (blockEventHandlers):
     39        (unblockEventHandlers):
     40        (handleUncaughtException):
     41        (dismissErrorSheet):
     42        (createErrorSheet.insertWordBreakCharacters):
     43        (createErrorSheet):
     44        (handleLinkClick):
     45        * UserInterface/Main.html:
     46        * UserInterface/Protocol/MessageDispatcher.js:
     47        (WebInspector.dispatchMessageFromBackend): Don't try to dispatch
     48        messages from the backend when showing the error sheet. They will
     49        probably fail, so suspend dispatching until the sheet is dismissed.
     50
    1512015-12-06  Devin Rousso  <dcrousso+webkit@gmail.com>
    252

  • trunk/Source/WebInspectorUI/UserInterface/Base/Main.js

    r193507 r193646  
    176176WebInspector.contentLoaded = function()
    177177{
    178     // If a loading error page was already shown, then don't set up the Inspector UI.
    179     if (window.__earlyErrors)
     178    // If there was an uncaught exception earlier during loading, then
     179    // abort loading more content. We could be in an inconsistent state.
     180    if (window.__uncaughtExceptions)
    180181        return;
    181182
    … …  
    431432        this.showSplitConsole();
    432433
    433     this._contentLoaded = true;
     434    // Store this on the window in case the WebInspector global gets corrupted.
     435    window.__frontendCompletedLoad = true;
    434436
    435437    if (this.runBootstrapOperations)

  • trunk/Source/WebInspectorUI/UserInterface/Debug/UncaughtExceptionReporter.css

    r193645 r193646  
    2424 */
    2525
    26 body.caught-early-error {
    27     margin: 50px 65px;
    28     font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    29     font-size: 11pt;
    30     max-width: 700px;
    31     min-width: 400px;
    32     background-color: #fefefe;
    33     overflow: scroll;
     26.sheet-container {
     27    position: absolute;
     28    left: 0;
     29    right: 0;
     30    top: 0;
     31    bottom: 0;
     32    z-index: 10000;
     33    background-color: hsl(0, 0%, 96%);
    3434}
    3535
    36 body.caught-early-error h1,
    37 body.caught-early-error h2 {
    38     font-size: 16pt;
    39     font-weight: bold;
     36.uncaught-exception-sheet {
     37    padding: 50px 55px 50px 65px;
     38    font-family: '-webkit-system-font';
     39    font-size: 11pt;
     40    overflow-y: auto;
     41    min-width: 400px;
     42    color: hsl(0, 0%, 40%);
     43}
     44
     45.uncaught-exception-sheet a {
     46    text-decoration: underline;
     47    color: hsl(240, 55%, 30%);
     48    cursor: pointer;
     49    font-weight: 500;
     50    font-size: 97%;
     51}
     52.uncaught-exception-sheet a:hover,
     53.uncaught-exception-sheet a:active {
     54    color: hsl(240, 55%, 25%);
     55}
     56
     57.uncaught-exception-sheet h1,
     58.uncaught-exception-sheet h2 {
     59    font-size: 24px;
     60    line-height: 28px;
    4061    margin-bottom: 0px;
    4162    margin-top: 10px;
     63    font-weight: normal;
    4264}
    4365
    44 body.caught-early-error h1 > img {
     66.uncaught-exception-sheet h2 {
     67    margin-top: 40px;
     68}
     69
     70.uncaught-exception-sheet h1 > img {
    4571    height: 35px;
    4672    position: relative;
    4773    margin-left: -50px;
    48     margin-top: -7px;
     74    margin-top: -5px;
    4975    float: left;
    5076}
    5177
    52 body.caught-early-error h2 > img {
     78.uncaught-exception-sheet h2 > img {
    5379    height: 25px;
    5480    position: relative;
    … …  
    5884}
    5985
    60 body.caught-early-error dt {
    61     font-weight: 600;
    62     font-style: italic;
     86.uncaught-exception-sheet dl {
     87    max-width: 600px;
    6388}
    6489
    65 body.caught-early-error dd {
    66     margin: 10px 0 20px 10px;
     90.uncaught-exception-sheet dt {
     91    font-style: italic;
     92    font-size: 17px;
    6793}
    6894
    69 body.caught-early-error ul {
     95.uncaught-exception-sheet dd {
     96    margin: 10px 0 20px 10px;
     97    font-size: 13px;
     98    line-height: 18px;
     99}
     100
     101.uncaught-exception-sheet ul {
    70102    font-family: Menlo, monospace;
    71     font-size: 75%;
    72     margin: 0;
     103    font-size: 12px;
     104    line-height: 18px;
     105    margin: 0 0 0 2px;
    73106    padding: 0;
    74107}
    75108
    76 body.caught-early-error li {
     109.uncaught-exception-sheet li {
    77110    margin-bottom: 20px;
     111    word-break: break-word;
    78112}

  • trunk/Source/WebInspectorUI/UserInterface/Main.html

    r192906 r193646  
    186186    <link rel="stylesheet" href="Controllers/CodeMirrorTokenTrackingController.css">
    187187
    188     <link rel="stylesheet" href="Debug/CatchEarlyErrors.css">
    189 
    190     <script src="Debug/CatchEarlyErrors.js"></script>
     188    <link rel="stylesheet" href="Debug/UncaughtExceptionReporter.css">
     189
     190    <script src="Debug/UncaughtExceptionReporter.js"></script>
    191191
    192192    <script src="External/CodeMirror/codemirror.js"></script>

  • trunk/Source/WebInspectorUI/UserInterface/Protocol/MessageDispatcher.js

    r188946 r193646  
    6666    this._messagesToDispatch.push(message);
    6767
     68    // If something has gone wrong and the uncaught exception sheet is showing,
     69    // then don't try to dispatch more messages. Dispatching causes spurious uncaught
     70    // exceptions and cause the sheet to overflow with hundreds of logged exceptions.
     71    if (window.__uncaughtExceptions && window.__uncaughtExceptions.length)
     72        return;
     73
    6874    if (this._dispatchTimeout)
    6975        return;
Note: See TracChangeset for help on using the changeset viewer.