2026 远程 Mac 前端发布验收：
CSS Anchor Positioning 与 Popover 组合 — Safari 与 Chromium 对照表及渐进增强三步清单
Anchor Positioning 与 Popover 联用时，仅测 Chromium 易漏 WebKit 在滚动、合成与顶层上的组合差异。本文含分栏探测、差异表、三步渐进增强与回退上限、真机/远程验证流程。延伸阅读 Popover 验收、Import Maps 与 ESM、构建与 Safari 核验；资费、购买、博客列表。
01 特性探测：锚点与 Popover 分栏
三层分栏：Popover（showPopover / invoker）、锚点注册、所用 anchor() 数学；各用 CSS.supports 实串，忌单一布尔。invoker 与上文 Popover 清单同宽表；锚点用最小 harness（anchor-name: --qa + top: anchor(bottom)）——层不随锚盒动则未通。表列：popover / anchor 核心 / anchor 进阶 / 降级。
02 Safari 与 Chromium 差异表
下表作讨论锚点；以目标 WebKit 在租用 Mac 实测为准。
| 主题 | Safari / WebKit | Chromium（Blink） |
|---|---|---|
| 锚点注册 | flex/grid、可滚动子树里验 anchor-name；overflow 可裁锚盒。 |
DevTools 易框锚盒；须用产品 DOM 重跑滚动。 |
anchor() 等 |
逐关键字；RTL、竖屏手测。 | 实验面常更前；开关对齐 Safari 对外版。 |
| Popover + 锚定层 | 顶层与锚定并存时，易与 modal、视频、第三方高 z 出 z 序/点击差。 | 第三方注入高 z 时差异更明显。 |
| 滚动/包含块 | 橡皮筋、嵌套滚、粘性栏、transform 祖先改锚盒；远程录屏贴近用户。 | 同脚本跑触摸路径；几何闪则导出 Trace。 |
先查 动效与间距，再查锚点；角标 构建号。
03 渐进增强三步与回退策略
一无锚点基线：Popover 或浮层用 inset/逻辑属性/居中模态。二锚点分两级：进阶关键字不可时先简边，必要时 ResizeObserver 粗纠。三JS 止于粗校正，禁重建锚点解析图；不稳则减动效或改静态落点。SW 缓存 CSS 时先清壳再验。
npx playwright test --project=webkit --project=chromium
04 真机与远程验证流程
同一预发 URL+SHA，清站点数据后隐私窗复跑。远程 Mac：开触发、窄视口、嵌套滚、Esc、Tab、触控板/鼠标轻点关；争议处录屏；附 Playwright 与控制台/Trace。文末 免登录可看资费、帮助并下单。
05 FAQ
Anchor Positioning 与 Popover 要分开探测吗？
要。可能先后落地，分列才写得清降级。
为何仅 Linux Chromium CI 不够？
WebKit 合成与滚动行为不同；须 Apple 硬件或远程 Mac。
JavaScript 回退应写到什么程度？
只纠明显错位；勿复刻锚点模型，可简化落点或提示升级。
Popover 与锚点分栏探测；同构建、双引擎、清缓存再签字。
更多文章：博客列表。