[webkit-changes] [WebKit/WebKit] ddfb1a: Add a "Media" WebInspector Element details panel

[Jer Noble]

  Branch: refs/heads/main
  Home:   https://github.com/WebKit/WebKit
  Commit: ddfb1a4a5608af37f95f99d837b43db85f48e435
      https://github.com/WebKit/WebKit/commit/ddfb1a4a5608af37f95f99d837b43db85f48e435
  Author: Jer Noble <jer.noble at apple.com>
  Date:   2024-01-30 (Tue, 30 Jan 2024)

  Changed paths:
    A LayoutTests/inspector/dom/getMediaStats-expected.txt
    A LayoutTests/inspector/dom/getMediaStats.html
    M Source/JavaScriptCore/inspector/protocol/DOM.json
    M Source/WTF/wtf/Forward.h
    M Source/WebCore/Modules/mediacontrols/MediaControlsHost.cpp
    M Source/WebCore/Modules/mediacontrols/MediaControlsHost.h
    M Source/WebCore/Modules/mediasource/VideoPlaybackQuality.cpp
    M Source/WebCore/Modules/mediasource/VideoPlaybackQuality.h
    A Source/WebCore/Modules/webcodecs/VideoColorSpace.cpp
    M Source/WebCore/Modules/webcodecs/VideoColorSpace.h
    M Source/WebCore/Sources.txt
    M Source/WebCore/WebCore.xcodeproj/project.pbxproj
    M Source/WebCore/en.lproj/Localizable.strings
    M Source/WebCore/html/HTMLMediaElement.cpp
    M Source/WebCore/html/HTMLMediaElement.h
    A Source/WebCore/html/track/AudioTrackConfiguration.cpp
    M Source/WebCore/html/track/AudioTrackConfiguration.h
    M Source/WebCore/html/track/AudioTrackList.cpp
    M Source/WebCore/html/track/AudioTrackList.h
    A Source/WebCore/html/track/VideoTrackConfiguration.cpp
    M Source/WebCore/html/track/VideoTrackConfiguration.h
    M Source/WebCore/html/track/VideoTrackList.cpp
    M Source/WebCore/html/track/VideoTrackList.h
    M Source/WebCore/inspector/agents/InspectorDOMAgent.cpp
    M Source/WebCore/inspector/agents/InspectorDOMAgent.h
    A Source/WebCore/platform/graphics/CodecUtilities.cpp
    A Source/WebCore/platform/graphics/CodecUtilities.h
    M Source/WebInspectorUI/Localizations/en.lproj/localizedStrings.js
    M Source/WebInspectorUI/UserInterface/Main.html
    M Source/WebInspectorUI/UserInterface/Models/DOMNode.js
    M Source/WebInspectorUI/UserInterface/Views/ElementsTabContentView.js
    M Source/WebInspectorUI/UserInterface/Views/FontDetailsSidebarPanel.js
    A Source/WebInspectorUI/UserInterface/Views/MediaDetailsSidebarPanel.css
    A Source/WebInspectorUI/UserInterface/Views/MediaDetailsSidebarPanel.js

  Log Message:
  -----------
  Add a "Media" WebInspector Element details panel
https://bugs.webkit.org/show_bug.cgi?id=265429
rdar://118865793

Reviewed by Devin Rousso and Antoine Quint.

Add a "Media" details panel to the Web Inspector when selecting a <video> or <audio> element.

The contents of the details panel should be broadly similar to the contents of the "Show Media Stats"
panel in desktop WebKit. These contents are collected within HTMLMediaElement::getStatsAsJSON(), put
into a JSON object, and passed to the WebInspector via InspectorDOMAgent. In order to facilitate
crating this JSON stats object, add toJSON/toJSONObject() methods to VideoPlaybackQuality,
AudioTrackConfiguration, and VideoTrackConfiguration. Add a new utility method to create a human
readable string from an extended codec string. And create and populate a new panel within the
WebInspectorUI to display these stats.

* Source/JavaScriptCore/inspector/protocol/DOM.json:
* Source/WTF/wtf/Forward.h:
* Source/WebCore/Modules/mediacontrols/MediaControlsHost.cpp:
(WebCore::MediaControlsHost::sourceType const):
* Source/WebCore/Modules/mediacontrols/MediaControlsHost.h:
* Source/WebCore/Modules/mediasource/VideoPlaybackQuality.cpp:
(WebCore::VideoPlaybackQuality::toJSONObject const):
* Source/WebCore/Modules/mediasource/VideoPlaybackQuality.h:
* Source/WebCore/Modules/webcodecs/VideoColorSpace.cpp: Copied from Source/WebCore/Modules/mediasource/VideoPlaybackQuality.cpp.
(WebCore::VideoColorSpace::toJSON const):
* Source/WebCore/Modules/webcodecs/VideoColorSpace.h:
* Source/WebCore/Sources.txt:
* Source/WebCore/WebCore.xcodeproj/project.pbxproj:
* Source/WebCore/html/HTMLMediaElement.cpp:
(WebCore::HTMLMediaElement::getVideoPlaybackQuality const):
(WebCore::HTMLMediaElement::getStatsAsJSON const):
(WebCore::HTMLMediaElement::sourceType const):
(WebCore::HTMLMediaElement::getVideoPlaybackQuality): Deleted.
* Source/WebCore/html/HTMLMediaElement.h:
* Source/WebCore/html/track/AudioTrackConfiguration.cpp: Copied from Source/WebCore/Modules/mediasource/VideoPlaybackQuality.cpp.
(WebCore::AudioTrackConfiguration::toJSON const):
* Source/WebCore/html/track/AudioTrackConfiguration.h:
* Source/WebCore/html/track/AudioTrackList.cpp:
(WebCore::AudioTrackList::firstEnabled const):
* Source/WebCore/html/track/AudioTrackList.h:
* Source/WebCore/html/track/VideoTrackConfiguration.cpp: Copied from Source/WebCore/Modules/mediasource/VideoPlaybackQuality.cpp.
(WebCore::VideoTrackConfiguration::toJSON const):
* Source/WebCore/html/track/VideoTrackConfiguration.h:
* Source/WebCore/html/track/VideoTrackList.cpp:
(WebCore::VideoTrackList::selectedItem const):
* Source/WebCore/html/track/VideoTrackList.h:
* Source/WebCore/inspector/agents/InspectorDOMAgent.cpp:
(WebCore::InspectorDOMAgent::getMediaStats):
* Source/WebCore/inspector/agents/InspectorDOMAgent.h:
* Source/WebCore/platform/graphics/CodecUtilities.cpp: Added.
(WebCore::humanReadableStringFromCodecString):
* Source/WebCore/platform/graphics/CodecUtilities.h: Copied from Source/WebCore/Modules/mediasource/VideoPlaybackQuality.cpp.
* Source/WebInspectorUI/Localizations/en.lproj/localizedStrings.js:
* Source/WebInspectorUI/UserInterface/Main.html:
* Source/WebInspectorUI/UserInterface/Models/DOMNode.js:
(WI.DOMNode):
* Source/WebInspectorUI/UserInterface/Protocol/Legacy/iOS/17.0/InspectorBackendCommands.js:
* Source/WebInspectorUI/UserInterface/Protocol/Legacy/macOS/14.0/InspectorBackendCommands.js:
* Source/WebInspectorUI/UserInterface/Views/ElementsTabContentView.js:
(WI.ElementsTabContentView):
* Source/WebInspectorUI/UserInterface/Views/MediaDetailsSidebarPanel.css: Added.
* Source/WebInspectorUI/UserInterface/Views/MediaDetailsSidebarPanel.js: Added.
(WI.MediaDetailsSidebarPanel):
(WI.MediaDetailsSidebarPanel.prototype.supportsDOMNode):
(WI.MediaDetailsSidebarPanel.prototype.initialLayout):
(WI.MediaDetailsSidebarPanel.prototype.async layout):
(WI.MediaDetailsSidebarPanel.prototype.get source):
(WI.MediaDetailsSidebarPanel.prototype.set source):
(WI.MediaDetailsSidebarPanel.prototype._updateViewportRow):
(WI.MediaDetailsSidebarPanel.prototype.get viewport):
(WI.MediaDetailsSidebarPanel.prototype.set viewport):
(WI.MediaDetailsSidebarPanel.prototype.get devicePixelRatio):
(WI.MediaDetailsSidebarPanel.prototype.set devicePixelRatio):
(WI.MediaDetailsSidebarPanel.prototype.get quality):
(WI.MediaDetailsSidebarPanel.prototype.set quality):
(WI.MediaDetailsSidebarPanel.prototype.get videoFormat):
(WI.MediaDetailsSidebarPanel.prototype.set videoFormat):
(WI.MediaDetailsSidebarPanel.prototype.get audioFormat):
(WI.MediaDetailsSidebarPanel.prototype.set audioFormat):
(WI.MediaDetailsSidebarPanel.prototype.get video):
(WI.MediaDetailsSidebarPanel.prototype.set video):
(WI.MediaDetailsSidebarPanel.prototype.get audio):
(WI.MediaDetailsSidebarPanel.prototype.set audio):
(WI.MediaDetailsSidebarPanel.prototype.attached):
(WI.MediaDetailsSidebarPanel.prototype.detached):

Canonical link: https://commits.webkit.org/273777@main