[zh-cn]: sync translation for Picture-in-Picture API & add translation for ShadowRoot.pictureInPictureElement

files/zh-cn/web/api/document/pictureinpictureelement/index.md

@@ -2,7 +2,7 @@
 title: Document：pictureInPictureElement 属性
 slug: Web/API/Document/pictureInPictureElement
 l10n:
-  sourceCommit: 4cbb657f882495b1cd18cbbaa8d1c5237bce4eb8
+  sourceCommit: 20e15ad6027f10c7bdd48f36776876cd1aa3a63c
 ---
 
 {{APIRef("Picture-in-Picture API")}}
@@ -13,7 +13,9 @@ l10n:
 
 ## 值
 
-对于当前处在画中画模式 {{domxref("Element")}} 对象的引用；如果 `document` 在当前并未使用画中画模式，则返回值是 `null`。
+对当前处于画中画模式的 {{domxref("Element")}} 对象的引用。
+
+如果文档没有处于画中画模式的相关元素，则返回 `null`。例如，没有画中画元素，或者画中画元素来自 iframe 中。
 
 ## 示例
 

files/zh-cn/web/api/htmlvideoelement/enterpictureinpicture_event/index.md

@@ -2,7 +2,7 @@
 title: HTMLVideoElement：enterpictureinpicture 事件
 slug: Web/API/HTMLVideoElement/enterpictureinpicture_event
 l10n:
-  sourceCommit: 4cbb657f882495b1cd18cbbaa8d1c5237bce4eb8
+  sourceCommit: 73b2b6ee411ac094b9fc57dafac6f9c232fc20d9
 ---
 
 {{APIRef("Picture-in-Picture API")}}

files/zh-cn/web/api/htmlvideoelement/leavepictureinpicture_event/index.md

@@ -2,7 +2,7 @@
 title: HTMLVideoElement：leavepictureinpicture 事件
 slug: Web/API/HTMLVideoElement/leavepictureinpicture_event
 l10n:
-  sourceCommit: 4cbb657f882495b1cd18cbbaa8d1c5237bce4eb8
+  sourceCommit: 73b2b6ee411ac094b9fc57dafac6f9c232fc20d9
 ---
 
 {{APIRef("HTMLVideoElement")}}

files/zh-cn/web/api/picture-in-picture_api/index.md

@@ -1,20 +1,22 @@
 ---
-title: 画中画（Picture-in-Picture）API
+title: 画中画 API
 slug: Web/API/Picture-in-Picture_API
 l10n:
-  sourceCommit: 7c1f91ddd9cd584b041d18a916ab850a226824ad
+  sourceCommit: bb4d21e3c6e71db4e0ba983a450d6ed628e82670
 ---
 
 {{DefaultAPISidebar("Picture-in-Picture API")}}
 
-**画中画 API** 允许网站总是在其他窗口之上创建一个浮动的视频，以便用户在其他内容站点或者设备上的应用程序交互时可以继续播放媒体。
+**画中画 API**（Picture-in-Picture API）允许网站总是在其他窗口之上创建一个浮动的视频，以便用户在其他内容站点或者设备上的应用程序交互时可以继续播放媒体。
 
 > **备注：** [文档画中画 API](/zh-CN/docs/Web/API/Document_Picture-in-Picture_API) 扩展了画中画 API，使其能够将*任意* HTML 内容（而不仅仅是视频）呈现在始终置顶的窗口中。
 
 ## 接口
 
 - {{DOMxRef("PictureInPictureWindow")}}
   - : 表示浮动的视频窗口；包含 {{domxref("PictureInPictureWindow/width", "width")}} 和 {{domxref("PictureInPictureWindow/height", "height")}} 属性，以及一个 {{domxref("PictureInPictureWindow/onresize", "onresize")}} 事件处理器属性。
+- {{DOMxRef("PictureInPictureEvent")}}
+  - : 表示画中画相关事件，包括 {{domxref("HTMLVideoElement/enterpictureinpicture_event", "enterpictureinpicture")}}、{{domxref("HTMLVideoElement/leavepictureinpicture_event", "leavepictureinpicture")}} 和 {{domxref("PictureInPictureWindow/resize_event", "resize")}}。
 
 ## 实例方法
 
@@ -60,17 +62,17 @@ _画中画 API 定义了三个事件，它们可以用来检测画中画模式
 - {{domxref("PictureInPictureWindow.resize_event", "resize")}}
   - : 当 {{DOMxRef("PictureInPictureWindow")}} 大小改变时触发该事件。
 
-## 添加控制
+## 添加控件
 
-如果通过[媒体会话 API](/zh-CN/docs/Web/API/Media_Session_API) 设置了媒体操作处理器，则浏览器会在画中画叠加层中自动添加相应操作的控制。例如，如果已设置 `"nexttrack"` 动作，则画中画视图中可能会显示跳过按钮。但该特性不支持添加自定义 HTML 按钮或控件。
+如果通过[媒体会话 API](/zh-CN/docs/Web/API/Media_Session_API) 设置了媒体操作处理器，则浏览器会在画中画叠加层中自动添加相应操作的控件。例如，如果已设置 `"nexttrack"` 动作，则画中画视图中可能会显示跳过按钮。但该特性不支持添加自定义 HTML 按钮或控件。
 
 ## 控制样式
 
 [CSS](/zh-CN/docs/Web/CSS) [伪类](/zh-CN/docs/Web/CSS/Pseudo-classes) [`:picture-in-picture`](/zh-CN/docs/Web/CSS/:picture-in-picture) 匹配当前进入画中画模式的视频元素，并允许你配置样式表，以便视频在画中画或者传统播放模式来回切换时自动调整内容的大小、样式或布局。
 
 ## 控制访问权限
 
-可以使用[权限策略](/zh-CN/docs/Web/HTTP/Permissions_Policy)控制画中画的可用性。全屏模式的特性由字符串 `"picture-in-picture"` 标识，默认的允许列表的值是 `"self"`，意味着在顶级文档上下文以及从与最顶层文档相同的来源加载的嵌套浏览上下文中允许画中画模式。
+可以使用[权限策略](/zh-CN/docs/Web/HTTP/Permissions_Policy)控制画中画的可用性。全屏模式的特性由字符串 `"picture-in-picture"` 标识，默认的允许列表的值是 `*`，意味着在顶级文档上下文以及从与最顶层文档相同的来源加载的嵌套浏览上下文中允许画中画模式。
 
 ## 示例
 
@@ -80,7 +82,7 @@ _画中画 API 定义了三个事件，它们可以用来检测画中画模式
 
 ### 切换画中画模式
 
-当使用者点击“Toggle Picture-in-Picture”按钮时，这段代码将会由一个点击处理程序调用：
+当使用者点击“Toggle Picture-in-Picture”按钮时，这段代码将会由一个点击处理器调用：
 
 ```js
 function togglePictureInPicture() {

files/zh-cn/web/api/pictureinpicturewindow/index.md

@@ -2,7 +2,7 @@
 title: PictureInPictureWindow
 slug: Web/API/PictureInPictureWindow
 l10n:
-  sourceCommit: acfe8c9f1f4145f77653a2bc64a9744b001358dc
+  sourceCommit: 73b2b6ee411ac094b9fc57dafac6f9c232fc20d9
 ---
 
 {{APIRef("Picture-in-Picture API")}}
@@ -31,7 +31,7 @@ _`PictureInPictureWindow` 接口不继承任何方法。_
 _`PictureInPictureWindow` 接口不继承任何事件。_
 
 - {{domxref("PictureInPictureWindow.resize_event", "resize")}}
-  - : 当浮动视频窗口的大小改变时，发送给 {{DOMxRef("PictureInPictureWindow")}}。
+  - : 当浮动视频窗口的大小改变时，发送给 `PictureInPictureWindow`。
 
 ## 示例
 

files/zh-cn/web/api/shadowroot/pictureinpictureelement/index.md

@@ -0,0 +1,36 @@
+---
+title: ShadowRoot：pictureInPictureElement 属性
+slug: Web/API/ShadowRoot/pictureInPictureElement
+l10n:
+  sourceCommit: bb4d21e3c6e71db4e0ba983a450d6ed628e82670
+---
+
+{{APIRef("Picture-in-Picture API")}}
+
+{{domxref("ShadowRoot")}} 接口的 **`pictureInPictureElement`** 只读属性返回此影子树中当前以画中画模式呈现的 {{domxref("Element")}}，如果当前未使用画中画模式，则返回 `null`。
+
+## 值
+
+对当前处于画中画模式的 {{domxref("Element")}} 对象的引用。
+
+如果影子树在画中画模式中没有关联元素，则返回 `null`。例如，没有画中画元素，或者画中画元素不在影子树中。
+
+## 示例
+
+```js
+let customElem = document.querySelector("my-shadow-dom-element");
+let shadow = customElem.shadowRoot;
+let pipElem = shadow.pictureInPictureElement;
+```
+
+## 规范
+
+{{Specifications}}
+
+## 浏览器兼容性
+
+{{Compat}}
+
+## 参见
+
+- {{domxref("Document.pictureInPictureElement")}}

files/zh-cn/web/http/headers/permissions-policy/picture-in-picture/index.md

@@ -1,24 +1,28 @@
 ---
 title: "Permissions-Policy: picture-in-picture"
 slug: Web/HTTP/Headers/Permissions-Policy/picture-in-picture
+l10n:
+  sourceCommit: 0880a90f3811475d78bc4b2c344eb4146f25f66c
 ---
 
 {{HTTPSidebar}} {{SeeCompatTable}}
 
-HTTP 标头 {{HTTPHeader("Permissions-Policy")}} 的 `picture-in-picture` 指令表示是否允许当前的文档通过相应的 API 以画中画模式播放视频。
+HTTP {{HTTPHeader("Permissions-Policy")}} 标头 `picture-in-picture` 指令控制是否允许当前文档以{{domxref("Picture-in-Picture API", "画中画", "", "nocode")}}模式播放视频。
+
+具体而言，如果定义的策略阻止使用此特性，则 {{domxref("HTMLVideoElement.requestPictureInPicture()")}} 调用将抛出类型为 `SecurityError` 的 {{domxref("DOMException")}} 错误。
 
 ## 语法
 
 ```http
-Permissions-Policy: picture-in-picture <allowlist>;
+Permissions-Policy: picture-in-picture=<allowlist>;
 ```
 
-- \<allowlist>
-  - : 允许使用该功能的来源列表。参见 [`Permissions-Policy`](/zh-CN/docs/Web/HTTP/Headers/Permissions-Policy#语法)。
+- `<allowlist>`
+  - : 允许使用该特性的来源列表。有关更多详细信息，参阅 [`Permissions-Policy` > 语法](/zh-CN/docs/Web/HTTP/Headers/Permissions-Policy#语法)。
 
 ## 默认策略
 
-截至 2019 年 6 月，[规范草案](https://wicg.github.io/picture-in-picture/#feature-policy) 和 [Google Chrome](https://bugs.chromium.org/p/chromium/issues/detail?id=806249#c17) 将允许列表默认设置为 `*`。
+`picture-in-picture` 的默认允许列表是 `*`。
 
 ## 规范
 
@@ -31,5 +35,4 @@ Permissions-Policy: picture-in-picture <allowlist>;
 ## 参见
 
 - {{HTTPHeader("Permissions-Policy")}} 标头
-- [Permission Policy](/zh-CN/docs/Web/HTTP/Feature_Policy)
-- [Using Permission Policy](/zh-CN/docs/Web/HTTP/Feature_Policy/Using_Feature_Policy)
+- [权限策略](/zh-CN/docs/Web/HTTP/Permissions_Policy)