Changeset 237431 in webkit


Ignore:
Timestamp:
Oct 25, 2018 3:59:29 PM (5 years ago)
Author:
Devin Rousso
Message:

Web Inspector: display fullscreen enter/exit events in Timelines and Network node waterfalls
​https://bugs.webkit.org/show_bug.cgi?id=189874
<rdar://problem/44700000>

Reviewed by Joseph Pecoraro.

Source/JavaScriptCore:

  • inspector/protocol/DOM.json:

Allow data to be passed to the frontend with didFireEvent.

Source/WebCore:

Updated existing test: http/tests/inspector/dom/didFireEvent.html

  • inspector/agents/InspectorDOMAgent.h:
  • inspector/agents/InspectorDOMAgent.cpp:

(WebCore::EventFiredCallback::handleEvent):
(WebCore::InspectorDOMAgent::didCreateFrontendAndBackend):
(WebCore::InspectorDOMAgent::addEventListenersToNode):
(WebCore::InspectorDOMAgent::discardBindings):
(WebCore::InspectorDOMAgent::eventDidResetAfterDispatch): Added.
Prevent the same event from being sent to the frontend more than once.

  • dom/Event.cpp:

(WebCore::Event::resetAfterDispatch):

  • dom/Document.cpp:

(WebCore::Document::Document):

  • inspector/InspectorInstrumentation.h:

(WebCore::InspectorInstrumentation::eventDidResetAfterDispatch): Added.

  • inspector/InspectorInstrumentation.cpp:

(WebCore::InspectorInstrumentation::eventDidResetAfterDispatchImpl): Added.

Source/WebInspectorUI:

  • Localizations/en.lproj/localizedStrings.js:
  • UserInterface/Protocol/DOMObserver.js:

(WI.DOMObserver.prototype.didFireEvent):

  • UserInterface/Controllers/DOMManager.js:

(WI.DOMManager.prototype.didFireEvent):
Allow data to be passed to the frontend with didFireEvent.

  • UserInterface/Models/DOMNode.js:

(WI.DOMNode):
(WI.DOMNode.getFullscreenDOMEvents): Added.
(WI.DOMNode.prototype.didFireEvent):
(WI.DOMNode.prototype._handleDOMNodeDidFireEvent): Added.
(WI.DOMNode.prototype._addDOMEvent):
(WI.DOMNode.prototype._shouldListenForEventListeners): Added.
If an event is fired on an ancestor of this node, also record that event in this node's
domEvents, including the originator node.

  • UserInterface/Views/NetworkTableContentView.js:

(WI.NetworkTableContentView.prototype._populateWaterfallGraph):

  • UserInterface/Views/NetworkTableContentView.css:

(.network-table :not(.header) .cell.waterfall .waterfall-container > .dom-fullscreen): Added.

  • UserInterface/Views/DOMEventsBreakdownView.js:

(WI.DOMEventsBreakdownView.prototype.initialLayout):
(WI.DOMEventsBreakdownView.prototype._populateTable):

  • UserInterface/Views/DOMEventsBreakdownView.css:

(.dom-events-breakdown .graph > .area.fullscreen): Added.
(.dom-events-breakdown .inherited > .name, .dom-events-breakdown .inherited > .graph > .point): Added.
(.dom-events-breakdown:not(.has-inherited) .originator): Added.

LayoutTests:

  • http/tests/inspector/dom/didFireEvent-expected.txt:
  • http/tests/inspector/dom/didFireEvent.html:
Location:
trunk
Files:
21 edited

Legend:

Unmodified
Added
Removed

  • trunk/LayoutTests/ChangeLog

    r237426 r237431  
     12018-10-25  Devin Rousso  <drousso@apple.com>
     2
     3        Web Inspector: display fullscreen enter/exit events in Timelines and Network node waterfalls
     4        https://bugs.webkit.org/show_bug.cgi?id=189874
     5        <rdar://problem/44700000>
     6
     7        Reviewed by Joseph Pecoraro.
     8
     9        * http/tests/inspector/dom/didFireEvent-expected.txt:
     10        * http/tests/inspector/dom/didFireEvent.html:
     11
    1122018-10-25  Alexey Proskuryakov  <ap@apple.com>
    213

  • trunk/LayoutTests/http/tests/inspector/dom/didFireEvent-expected.txt

    r237028 r237431  
    44
    55== Running test suite: DOM.didFireEvent
    6 -- Running test case: DOM.didFireEvent
     6-- Running test case: DOM.didFireEvent.Basic
    77Adding video source "resources/white.mp4"...
    8 PASS: Should recieve a "loadstart" event.
     8PASS: Should receive a "loadstart" event.
    99PASS: Event timestamp should be greater than 0.
    1010
     11-- Running test case: DOM.didFireEvent.Fullscreen
     12Entering fullscreen on #video...
     13PASS: Should receive a "webkitfullscreenchange" event.
     14PASS: Event timestamp should be greater than 0.
     15PASS: Event should have data.
     16PASS: Fullscreen should be true.
     17Target: video#video
     18Exiting fullscreen...
     19PASS: Should receive a "webkitfullscreenchange" event.
     20PASS: Event timestamp should be greater than 0.
     21PASS: Event should have data.
     22PASS: Fullscreen should be false.
     23Target: video#video
     24
     25-- Running test case: DOM.didFireEvent.Inherited
     26Entering fullscreen on #container...
     27PASS: Should receive a "webkitfullscreenchange" event.
     28PASS: Event timestamp should be greater than 0.
     29PASS: Event should have data.
     30PASS: Fullscreen should be true.
     31Target: video#video
     32Originator: div#container
     33Exiting fullscreen...
     34PASS: Should receive a "webkitfullscreenchange" event.
     35PASS: Event timestamp should be greater than 0.
     36PASS: Event should have data.
     37PASS: Fullscreen should be false.
     38Target: video#video
     39Originator: div#container
     40

  • trunk/LayoutTests/http/tests/inspector/dom/didFireEvent.html

    r237028 r237431  
    1212}
    1313
     14function enterFullscreen(element) {
     15    document.addEventListener("keydown", (event) => {
     16        document.addEventListener("webkitfullscreenchange", (event) => {
     17            console.assert(document.webkitFullscreenElement === element);
     18
     19            TestPage.dispatchEventToFrontend("TestPage-enteredFullscreen");
     20        }, {once: true});
     21
     22        element.webkitRequestFullscreen();
     23    }, {once: true});
     24
     25    if (window.testRunner) {
     26        // DumpRenderTree changes the firstResponder to the WebInspector window when it opens.
     27        // This refocuses the test page, ensuring it gets the event.
     28        if (window.testRunner.setMainFrameIsFirstResponder)
     29            window.testRunner.setMainFrameIsFirstResponder(true);
     30
     31        eventSender.keyDown(" ");
     32    }
     33}
     34
     35function exitFullscreen() {
     36    document.addEventListener("webkitfullscreenchange", (event) => {
     37        console.assert(!document.webkitFullscreenElement);
     38
     39        TestPage.dispatchEventToFrontend("TestPage-exitedFullscreen");
     40    }, {once: true});
     41
     42    document.webkitExitFullscreen();
     43}
     44
    1445function test()
    1546{
     47    InspectorTest.debug();
     48
    1649    let suite = InspectorTest.createAsyncSuite("DOM.didFireEvent");
    1750
    1851    let videoNode = null;
    1952
     53    function fullscreenTest(fullscreenElementId, resolve, reject) {
     54        InspectorTest.awaitEvent("TestPage-exitedFullscreen")
     55        .then(resolve, reject);
     56
     57        InspectorTest.awaitEvent("TestPage-enteredFullscreen")
     58        .then((event) => {
     59            InspectorTest.log("Exiting fullscreen...");
     60            InspectorTest.evaluateInPage(`exitFullscreen()`).catch(reject);
     61        });
     62
     63        let enabled = false;
     64        let listener = videoNode.addEventListener(WI.DOMNode.Event.DidFireEvent, (event) => {
     65            let {domEvent} = event.data;
     66            if (domEvent.eventName !== "webkitfullscreenchange")
     67                return;
     68
     69            InspectorTest.pass(`Should receive a "webkitfullscreenchange" event.`);
     70            InspectorTest.expectGreaterThan(domEvent.timestamp, 0, "Event timestamp should be greater than 0.");
     71            InspectorTest.expectThat(domEvent.data, "Event should have data.");
     72            InspectorTest.expectNotEqual(domEvent.data.enabled, enabled, `Fullscreen should be ${!enabled}.`);
     73            InspectorTest.log("Target: " + event.target.displayName);
     74            if (domEvent.originator)
     75                InspectorTest.log("Originator: " + domEvent.originator.displayName);
     76
     77            enabled = domEvent.data.enabled;
     78            if (!enabled)
     79                videoNode.removeEventListener(WI.DOMNode.Event.DidFireEvent, listener);
     80        });
     81
     82        InspectorTest.log(`Entering fullscreen on #${fullscreenElementId}...`);
     83        InspectorTest.evaluateInPage(`enterFullscreen(document.getElementById("${fullscreenElementId}"))`).catch(reject);
     84    }
     85
    2086    suite.addTestCase({
    21         name: "DOM.didFireEvent",
     87        name: "DOM.didFireEvent.Basic",
    2288        description: "Check that HTMLMediaElement events work.",
    2389        test(resolve, reject) {
    … …  
    2995                    return;
    3096
    31                 InspectorTest.pass(`Should recieve a "loadstart" event.`)
     97                InspectorTest.pass(`Should receive a "loadstart" event.`)
    3298                InspectorTest.expectGreaterThan(domEvent.timestamp, 0, "Event timestamp should be greater than 0.");
    3399
    … …  
    38104            InspectorTest.log(`Adding video source "resources/${file}"...`);
    39105            InspectorTest.evaluateInPage(`loadSource("resources/${file}", "video/mp4")`);
     106        }
     107    });
     108
     109    suite.addTestCase({
     110        name: "DOM.didFireEvent.Fullscreen",
     111        description: "Check that fullscreen events work.",
     112        test(resolve, reject) {
     113            fullscreenTest("video", resolve, reject);
     114        }
     115    });
     116
     117    suite.addTestCase({
     118        name: "DOM.didFireEvent.Inherited",
     119        description: "Check that inherited events work.",
     120        test(resolve, reject) {
     121            fullscreenTest("container", resolve, reject);
    40122        }
    41123    });
    … …  
    57139<body onload="runTest()">
    58140    <p>Tests that listeners registered by InspectorDOMAgent::addEventListenersToNode are working.</p>
    59     <video id="video" muted autoplay></video>
     141    <div id="container">
     142        <video id="video" muted autoplay></video>
     143    </div>
    60144</body>
    61145</html>

  • trunk/Source/JavaScriptCore/ChangeLog

    r237429 r237431  
     12018-10-25  Devin Rousso  <drousso@apple.com>
     2
     3        Web Inspector: display fullscreen enter/exit events in Timelines and Network node waterfalls
     4        https://bugs.webkit.org/show_bug.cgi?id=189874
     5        <rdar://problem/44700000>
     6
     7        Reviewed by Joseph Pecoraro.
     8
     9        * inspector/protocol/DOM.json:
     10        Allow `data` to be passed to the frontend with `didFireEvent`.
     11
    1122018-10-25  Ross Kirsling  <ross.kirsling@sony.com>
    213

  • trunk/Source/JavaScriptCore/inspector/protocol/DOM.json

    r237028 r237431  
    667667                { "name": "nodeId", "$ref": "NodeId" },
    668668                { "name": "eventName", "type": "string" },
    669                 { "name": "timestamp", "$ref": "Network.Timestamp", "description": "Time when the event was fired" }
     669                { "name": "timestamp", "$ref": "Network.Timestamp", "description": "Time when the event was fired" },
     670                { "name": "data", "type": "object", "optional": true, "description": "Holds ancillary information about the event or its target." }
    670671            ]
    671672        }

  • trunk/Source/WebCore/ChangeLog

    r237424 r237431  
     12018-10-25  Devin Rousso  <drousso@apple.com>
     2
     3        Web Inspector: display fullscreen enter/exit events in Timelines and Network node waterfalls
     4        https://bugs.webkit.org/show_bug.cgi?id=189874
     5        <rdar://problem/44700000>
     6
     7        Reviewed by Joseph Pecoraro.
     8
     9        Updated existing test: http/tests/inspector/dom/didFireEvent.html
     10
     11        * inspector/agents/InspectorDOMAgent.h:
     12        * inspector/agents/InspectorDOMAgent.cpp:
     13        (WebCore::EventFiredCallback::handleEvent):
     14        (WebCore::InspectorDOMAgent::didCreateFrontendAndBackend):
     15        (WebCore::InspectorDOMAgent::addEventListenersToNode):
     16        (WebCore::InspectorDOMAgent::discardBindings):
     17        (WebCore::InspectorDOMAgent::eventDidResetAfterDispatch): Added.
     18        Prevent the same event from being sent to the frontend more than once.
     19
     20        * dom/Event.cpp:
     21        (WebCore::Event::resetAfterDispatch):
     22
     23        * dom/Document.cpp:
     24        (WebCore::Document::Document):
     25
     26        * inspector/InspectorInstrumentation.h:
     27        (WebCore::InspectorInstrumentation::eventDidResetAfterDispatch): Added.
     28        * inspector/InspectorInstrumentation.cpp:
     29        (WebCore::InspectorInstrumentation::eventDidResetAfterDispatchImpl): Added.
     30
    1312018-10-25  Michael Catanzaro  <mcatanzaro@igalia.com>
    232

  • trunk/Source/WebCore/dom/Document.cpp

    r237306 r237431  
    561561    for (auto& nodeListAndCollectionCount : m_nodeListAndCollectionCounts)
    562562        nodeListAndCollectionCount = 0;
     563
     564    InspectorInstrumentation::addEventListenersToNode(*this);
    563565}
    564566

  • trunk/Source/WebCore/dom/Event.cpp

    r237228 r237431  
    172172    m_propagationStopped = false;
    173173    m_immediatePropagationStopped = false;
     174
     175    InspectorInstrumentation::eventDidResetAfterDispatch(*this);
    174176}
    175177

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

    r237028 r237431  
    430430}
    431431
     432void InspectorInstrumentation::eventDidResetAfterDispatchImpl(InstrumentingAgents& instrumentingAgents, const Event& event)
     433{
     434    if (auto* domAgent = instrumentingAgents.inspectorDOMAgent())
     435        domAgent->eventDidResetAfterDispatch(event);
     436}
     437
    432438InspectorInstrumentationCookie InspectorInstrumentation::willEvaluateScriptImpl(InstrumentingAgents& instrumentingAgents, Frame& frame, const String& url, int lineNumber)
    433439{

  • trunk/Source/WebCore/inspector/InspectorInstrumentation.h

    r237028 r237431  
    158158    static InspectorInstrumentationCookie willDispatchEventOnWindow(Frame*, const Event&, DOMWindow&);
    159159    static void didDispatchEventOnWindow(const InspectorInstrumentationCookie&);
     160    static void eventDidResetAfterDispatch(const Event&);
    160161    static InspectorInstrumentationCookie willEvaluateScript(Frame&, const String& url, int lineNumber);
    161162    static void didEvaluateScript(const InspectorInstrumentationCookie&, Frame&);
    … …  
    344345    static InspectorInstrumentationCookie willDispatchEventOnWindowImpl(InstrumentingAgents&, const Event&, DOMWindow&);
    345346    static void didDispatchEventOnWindowImpl(const InspectorInstrumentationCookie&);
     347    static void eventDidResetAfterDispatchImpl(InstrumentingAgents&, const Event&);
    346348    static InspectorInstrumentationCookie willEvaluateScriptImpl(InstrumentingAgents&, Frame&, const String& url, int lineNumber);
    347349    static void didEvaluateScriptImpl(const InspectorInstrumentationCookie&, Frame&);
    … …  
    810812}
    811813
     814inline void InspectorInstrumentation::eventDidResetAfterDispatch(const Event& event)
     815{
     816    FAST_RETURN_IF_NO_FRONTENDS(void());
     817
     818    if (!is<Node>(event.target()))
     819        return;
     820
     821    auto* node = downcast<Node>(event.target());
     822    if (auto* instrumentingAgents = instrumentingAgentsForContext(node->scriptExecutionContext()))
     823        return eventDidResetAfterDispatchImpl(*instrumentingAgents, event);
     824}
     825
    812826inline InspectorInstrumentationCookie InspectorInstrumentation::willEvaluateScript(Frame& frame, const String& url, int lineNumber)
    813827{

  • trunk/Source/WebCore/inspector/agents/InspectorDOMAgent.cpp

    r237028 r237431  
    235235    void handleEvent(ScriptExecutionContext&, Event& event) final
    236236    {
    237         if (!is<Node>(event.target()))
     237        if (!is<Node>(event.target()) || m_domAgent.m_dispatchedEvents.contains(&event))
    238238            return;
    239239
    … …  
    243243            return;
    244244
     245        m_domAgent.m_dispatchedEvents.add(&event);
     246
     247        RefPtr<JSON::Object> data = JSON::Object::create();
     248
     249        if (event.type() == eventNames().webkitfullscreenchangeEvent)
     250            data->setBoolean("enabled"_s, !!node->document().webkitFullscreenElement());
     251
    245252        auto timestamp = m_domAgent.m_environment.executionStopwatch()->elapsedTime().seconds();
    246         m_domAgent.m_frontendDispatcher->didFireEvent(nodeId, event.type(), timestamp);
     253        m_domAgent.m_frontendDispatcher->didFireEvent(nodeId, event.type(), timestamp, data->size() ? WTFMove(data) : nullptr);
    247254    }
    248255
    … …  
    290297    m_instrumentingAgents.setInspectorDOMAgent(this);
    291298    m_document = m_pageAgent->mainFrame().document();
     299
     300    if (m_document)
     301        addEventListenersToNode(*m_document);
    292302
    293303    for (auto* mediaElement : HTMLMediaElement::allMediaElements())
    … …  
    524534    m_documentNodeToIdMap.clear();
    525535    m_idToNode.clear();
     536    m_dispatchedEvents.clear();
    526537    m_eventListenerEntries.clear();
    527538    releaseDanglingNodes();
    … …  
    21392150    };
    21402151
    2141     if (is<HTMLMediaElement>(node)) {
     2152    if (is<Document>(node))
     2153        createEventListener(eventNames().webkitfullscreenchangeEvent);
     2154    else if (is<HTMLMediaElement>(node)) {
     2155        createEventListener(eventNames().webkitfullscreenchangeEvent);
    21422156        createEventListener(eventNames().abortEvent);
    21432157        createEventListener(eventNames().canplayEvent);
    … …  
    24072421}
    24082422
     2423void InspectorDOMAgent::eventDidResetAfterDispatch(const Event& event)
     2424{
     2425    m_dispatchedEvents.remove(&event);
     2426}
     2427
    24092428bool InspectorDOMAgent::hasBreakpointForEventListener(EventTarget& target, const AtomicString& eventType, EventListener& listener, bool capture)
    24102429{

  • trunk/Source/WebCore/inspector/agents/InspectorDOMAgent.h

    r237028 r237431  
    178178    void willRemoveEventListener(EventTarget&, const AtomicString& eventType, EventListener&, bool capture);
    179179    bool isEventListenerDisabled(EventTarget&, const AtomicString& eventType, EventListener&, bool capture);
     180    void eventDidResetAfterDispatch(const Event&);
    180181
    181182    // Callbacks that don't directly correspond to an instrumentation entry point.
    … …  
    320321    friend class EventFiredCallback;
    321322
     323    HashSet<const Event*> m_dispatchedEvents;
    322324    HashMap<int, InspectorEventListener> m_eventListenerEntries;
    323325    int m_lastEventListenerId { 1 };

  • trunk/Source/WebInspectorUI/ChangeLog

    r237430 r237431  
     12018-10-25  Devin Rousso  <drousso@apple.com>
     2
     3        Web Inspector: display fullscreen enter/exit events in Timelines and Network node waterfalls
     4        https://bugs.webkit.org/show_bug.cgi?id=189874
     5        <rdar://problem/44700000>
     6
     7        Reviewed by Joseph Pecoraro.
     8
     9        * Localizations/en.lproj/localizedStrings.js:
     10
     11        * UserInterface/Protocol/DOMObserver.js:
     12        (WI.DOMObserver.prototype.didFireEvent):
     13        * UserInterface/Controllers/DOMManager.js:
     14        (WI.DOMManager.prototype.didFireEvent):
     15        Allow `data` to be passed to the frontend with `didFireEvent`.
     16
     17        * UserInterface/Models/DOMNode.js:
     18        (WI.DOMNode):
     19        (WI.DOMNode.getFullscreenDOMEvents): Added.
     20        (WI.DOMNode.prototype.didFireEvent):
     21        (WI.DOMNode.prototype._handleDOMNodeDidFireEvent): Added.
     22        (WI.DOMNode.prototype._addDOMEvent):
     23        (WI.DOMNode.prototype._shouldListenForEventListeners): Added.
     24        If an event is fired on an ancestor of this node, also record that event in this node's
     25        `domEvents`, including the `originator` node.
     26
     27        * UserInterface/Views/NetworkTableContentView.js:
     28        (WI.NetworkTableContentView.prototype._populateWaterfallGraph):
     29        * UserInterface/Views/NetworkTableContentView.css:
     30        (.network-table :not(.header) .cell.waterfall .waterfall-container > .dom-fullscreen): Added.
     31
     32        * UserInterface/Views/DOMEventsBreakdownView.js:
     33        (WI.DOMEventsBreakdownView.prototype.initialLayout):
     34        (WI.DOMEventsBreakdownView.prototype._populateTable):
     35        * UserInterface/Views/DOMEventsBreakdownView.css:
     36        (.dom-events-breakdown .graph > .area.fullscreen): Added.
     37        (.dom-events-breakdown .inherited > .name, .dom-events-breakdown .inherited > .graph > .point): Added.
     38        (.dom-events-breakdown:not(.has-inherited) .originator): Added.
     39
    1402018-10-25  Devin Rousso  <drousso@apple.com>
    241

  • trunk/Source/WebInspectorUI/Localizations/en.lproj/localizedStrings.js

    r237151 r237431  
    405405localizedStrings["Full Garbage Collection"] = "Full Garbage Collection";
    406406localizedStrings["Full URL"] = "Full URL";
     407localizedStrings["Fullscreen from “%s“"] = "Fullscreen from “%s“";
    407408localizedStrings["Function"] = "Function";
    408409localizedStrings["Function Name Variable"] = "Function Name Variable";
    … …  
    595596localizedStrings["Original formatting"] = "Original formatting";
    596597localizedStrings["Originally %s"] = "Originally %s";
     598localizedStrings["Originator"] = "Originator";
    597599localizedStrings["Other"] = "Other";
    598600localizedStrings["Other Issue"] = "Other Issue";

  • trunk/Source/WebInspectorUI/UserInterface/Controllers/DOMManager.js

    r237028 r237431  
    123123    }
    124124
    125     didFireEvent(nodeId, eventName, timestamp)
     125    didFireEvent(nodeId, eventName, timestamp, data)
    126126    {
    127127        // Called from WI.DOMObserver.
    … …  
    131131            return;
    132132
    133         node.didFireEvent(eventName, timestamp);
     133        node.didFireEvent(eventName, timestamp, data);
    134134    }
    135135

  • trunk/Source/WebInspectorUI/UserInterface/Models/DOMNode.js

    r237028 r237431  
    140140
    141141        this._domEvents = [];
     142
     143        if (this._shouldListenForEventListeners())
     144            WI.DOMNode.addEventListener(WI.DOMNode.Event.DidFireEvent, this._handleDOMNodeDidFireEvent, this);
     145    }
     146
     147    // Static
     148
     149    static getFullscreenDOMEvents(domEvents)
     150    {
     151        return domEvents.reduce((accumulator, current) => {
     152            if (current.eventName === "webkitfullscreenchange" && current.data && (!accumulator.length || accumulator.lastValue.data.enabled !== current.data.enabled))
     153                accumulator.push(current);
     154            return accumulator;
     155        }, []);
    142156    }
    143157
    … …  
    702716    }
    703717
    704     didFireEvent(eventName, timestamp)
     718    didFireEvent(eventName, timestamp, data)
    705719    {
    706720        // Called from WI.DOMManager.
    … …  
    709723            eventName,
    710724            timestamp: WI.timelineManager.computeElapsedTime(timestamp),
     725            data,
    711726        });
    712727    }
    713728
     729    _handleDOMNodeDidFireEvent(event)
     730    {
     731        if (event.target === this || !event.target.isAncestor(this))
     732            return;
     733
     734        let domEvent = Object.shallowCopy(event.data.domEvent);
     735        domEvent.originator = event.target;
     736
     737        this._addDOMEvent(domEvent);
     738    }
     739
    714740    _addDOMEvent(domEvent)
    715741    {
    … …  
    717743
    718744        this.dispatchEventToListeners(WI.DOMNode.Event.DidFireEvent, {domEvent});
     745    }
     746
     747    _shouldListenForEventListeners()
     748    {
     749        let lowerCaseName = this.localName() || this.nodeName().toLowerCase();
     750        return lowerCaseName === "video" || lowerCaseName === "audio";
    719751    }
    720752

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

    r237028 r237431  
    113113    }
    114114
    115     didFireEvent(nodeId, eventName, timestamp)
     115    didFireEvent(nodeId, eventName, timestamp, data)
    116116    {
    117         WI.domManager.didFireEvent(nodeId, eventName, timestamp);
     117        WI.domManager.didFireEvent(nodeId, eventName, timestamp, data);
    118118    }
    119119};

  • trunk/Source/WebInspectorUI/UserInterface/Views/DOMEventsBreakdownView.css

    r237028 r237431  
    7070}
    7171
     72.dom-events-breakdown .graph > .area.fullscreen {
     73    top: 0;
     74    height: 100%;
     75    background-color: var(--panel-background-color);
     76}
     77
    7278.dom-events-breakdown .time {
    7379    text-align: end;
    7480}
     81
     82.dom-events-breakdown .inherited > .name,
     83.dom-events-breakdown .inherited > .graph > .point {
     84    opacity: 0.5;
     85}
     86
     87.dom-events-breakdown:not(.has-inherited) .originator {
     88    display: none;
     89}

  • trunk/Source/WebInspectorUI/UserInterface/Views/DOMEventsBreakdownView.js

    r237028 r237431  
    7070        timeHeadCell.textContent = WI.UIString("Time");
    7171
     72        let originatorHeadCell = headRowElement.appendChild(document.createElement("th"));
     73        originatorHeadCell.classList.add("originator");
     74        originatorHeadCell.textContent = WI.UIString("Originator");
     75
    7276        this._tableBodyElement = tableElement.appendChild(document.createElement("tbody"));
    7377
    … …  
    9094        }
    9195
     96        let fullscreenRanges = [];
     97        let fullscreenDOMEvents = WI.DOMNode.getFullscreenDOMEvents(this._domEvents);
     98        for (let fullscreenDOMEvent of fullscreenDOMEvents) {
     99            let {enabled} = fullscreenDOMEvent.data;
     100            if (enabled || !fullscreenRanges.length) {
     101                fullscreenRanges.push({
     102                    startTimestamp: enabled ? fullscreenDOMEvent.timestamp : startTimestamp,
     103                });
     104            }
     105            fullscreenRanges.lastValue.endTimestamp = (enabled && fullscreenDOMEvent === fullscreenDOMEvents.lastValue) ? endTimestamp : fullscreenDOMEvent.timestamp;
     106        }
     107
    92108        for (let domEvent of this._domEvents) {
    93109            let rowElement = this._tableBodyElement.appendChild(document.createElement("tr"));
    … …  
    101117                graphCell.classList.add("graph");
    102118
     119                let fullscreenRange = fullscreenRanges.find((range) => domEvent.timestamp >= range.startTimestamp && domEvent.timestamp <= range.endTimestamp);
     120                if (fullscreenRange) {
     121                    let fullscreenArea = graphCell.appendChild(document.createElement("div"));
     122                    fullscreenArea.classList.add("area", "fullscreen");
     123                    fullscreenArea.style.setProperty(styleAttribute, percentOfTotalTime(fullscreenRange.startTimestamp - startTimestamp) + "%");
     124                    fullscreenArea.style.setProperty("width", percentOfTotalTime(fullscreenRange.endTimestamp - fullscreenRange.startTimestamp) + "%");
     125                }
     126
    103127                let graphPoint = graphCell.appendChild(document.createElement("div"));
    104128                graphPoint.classList.add("point");
    … …  
    111135            const higherResolution = true;
    112136            timeCell.textContent = Number.secondsToString(domEvent.timestamp - this._startTimestamp, higherResolution);
     137
     138            let originatorCell = rowElement.appendChild(document.createElement("td"));
     139            originatorCell.classList.add("originator");
     140            if (domEvent.originator) {
     141                originatorCell.appendChild(WI.linkifyNodeReference(domEvent.originator));
     142
     143                rowElement.classList.add("inherited");
     144                this.element.classList.add("has-inherited");
     145            }
    113146        }
    114147    }

  • trunk/Source/WebInspectorUI/UserInterface/Views/NetworkTableContentView.css

    r237028 r237431  
    183183}
    184184
     185.network-table :not(.header) .cell.waterfall .waterfall-container > .dom-fullscreen {
     186    position: absolute;
     187    top: var(--dom-fullscreen-vertical-padding);
     188    height: calc(100% - (var(--dom-fullscreen-vertical-padding) * 2));
     189    background-color: lightgrey;
     190
     191    /* Half of the vertical space above any .dom-event node */
     192    --dom-fullscreen-vertical-padding: calc((50% - (var(--node-waterfall-dom-event-size) / 2)) / 2);
     193}
     194
    185195.network-table .timeline-ruler > .header {
    186196    top: calc(var(--navigation-bar-height) - var(--timeline-ruler-height));

  • trunk/Source/WebInspectorUI/UserInterface/Views/NetworkTableContentView.js

    r237430 r237431  
    661661            const domEventElementSize = 8; // Keep this in sync with `--node-waterfall-dom-event-size`.
    662662
    663             let groupedDOMEvents = domNode.domEvents.reduce((accumulator, current) => {
    664                 if (!accumulator.length || (current.timestamp - accumulator.lastValue.endTimestamp) >= (domEventElementSize * secondsPerPixel)) {
    665                     accumulator.push({
    666                         startTimestamp: current.timestamp,
     663            let groupedDOMEvents = [];
     664            for (let domEvent of domNode.domEvents) {
     665                if (domEvent.originator)
     666                    continue;
     667
     668                if (!groupedDOMEvents.length || (domEvent.timestamp - groupedDOMEvents.lastValue.endTimestamp) >= (domEventElementSize * secondsPerPixel)) {
     669                    groupedDOMEvents.push({
     670                        startTimestamp: domEvent.timestamp,
    667671                        domEvents: [],
    668672                    });
    669673                }
    670                 accumulator.lastValue.endTimestamp = current.timestamp;
    671                 accumulator.lastValue.domEvents.push(current);
    672                 return accumulator;
    673             }, []);
     674                groupedDOMEvents.lastValue.endTimestamp = domEvent.timestamp;
     675                groupedDOMEvents.lastValue.domEvents.push(domEvent);
     676            }
     677
     678            let fullscreenDOMEvents = WI.DOMNode.getFullscreenDOMEvents(domNode.domEvents);
     679            if (fullscreenDOMEvents.length) {
     680                if (!fullscreenDOMEvents[0].data.enabled)
     681                    fullscreenDOMEvents.unshift({timestamp: graphStartTime});
     682
     683                if (fullscreenDOMEvents.lastValue.data.enabled)
     684                    fullscreenDOMEvents.push({timestamp: this._waterfallEndTime});
     685
     686                console.assert((fullscreenDOMEvents.length % 2) === 0, "Every enter/exit of fullscreen should have a corresponding exit/enter.");
     687
     688                for (let i = 0; i < fullscreenDOMEvents.length; i += 2) {
     689                    let fullscreenElement = container.appendChild(document.createElement("div"));
     690                    fullscreenElement.classList.add("dom-fullscreen");
     691                    positionByStartOffset(fullscreenElement, fullscreenDOMEvents[i].timestamp);
     692                    setWidthForDuration(fullscreenElement, fullscreenDOMEvents[i].timestamp, fullscreenDOMEvents[i + 1].timestamp);
     693
     694                    let originator = fullscreenDOMEvents[i].originator || fullscreenDOMEvents[i + 1].originator;
     695                    if (originator)
     696                        fullscreenElement.title = WI.UIString("Fullscreen from “%s“").format(originator.displayName);
     697                }
     698            }
    674699
    675700            let playing = false;
Note: See TracChangeset for help on using the changeset viewer.