WebKit中<video>元素来源及原生元素Shadow DOM实现位置咨询

嘿，刚好对WebKit的代码结构比较熟悉，来给你梳理清楚这两个问题：

WebKit里的<video>元素属于HTMLVideoElement类，是HTMLMediaElement的子类，核心实现都集中在WebCore模块（WebKit处理DOM、渲染和媒体逻辑的核心部分）：

• 类的声明在：Source/WebCore/html/HTMLVideoElement.h
• 具体实现代码在：Source/WebCore/html/HTMLVideoElement.cpp

它继承的HTMLMediaElement是所有媒体元素（<audio>和<video>）的基类，代码在Source/WebCore/html/HTMLMediaElement.h和Source/WebCore/html/HTMLMediaElement.cpp里。如果要找底层媒体播放的逻辑，会涉及到MediaPlayer类，定义在Source/WebCore/platform/graphics/MediaPlayer.h，各个平台（比如macOS、iOS）的具体实现会放在对应平台的目录下，比如Source/WebCore/platform/graphics/cocoa/MediaPlayerCocoa.mm。

WebKit里原生元素的Shadow DOM被称为内置Shadow DOM（User Agent Shadow DOM），相关实现分散在WebCore的几个关键位置：

• Shadow DOM核心逻辑：Shadow根节点的创建、管理逻辑在Source/WebCore/dom/ShadowRoot.h和Source/WebCore/dom/ShadowRoot.cpp里，比如attachShadowInternal()方法就是用来创建内置Shadow根的核心函数。
• 各元素的Shadow结构定义：不同原生元素的具体Shadow树结构，大多在Source/WebCore/html/shadow目录下。比如表单元素（像<input>、<select>）的Shadow结构定义在InputElementsShadowDOM.cpp、SelectElementShadowDOM.cpp这类文件里，里面会用代码构建出元素内部的DOM节点（比如输入框的内部<div>、复选框的图标节点等）。
• 内置Shadow样式：原生元素内部Shadow节点的默认样式，主要在Source/WebCore/css/html.css和Source/WebCore/css/shadow.css中定义，这些样式确保原生元素呈现出我们熟悉的默认外观。

另外，大多数原生元素会在自己的初始化或attached阶段调用创建Shadow根的方法，比如HTMLInputElement会在合适的时机触发Shadow DOM的构建，把内部结构挂载到自己的Shadow根下。

内容的提问来源于stack exchange，提问作者Novellizator