ToggleEvent 的 newState 属性对 popover 完全无效，因其仅由 元素触发，popover 不派发 toggle 事件；监听状态应改用 matches(':popover-open') 或 MutationObserver，并确保初始 display: none 且通过 showPopover() 激活。
ToggleEvent 的 newState 属性对 popover 完全无效，不能和 :popover-open 一起用作状态判断或动画触发依据。 这是当前（2026年10月）最常被误用的前提——ToggleEvent 只属于 <details></details>，popover 元素既不派发该事件，也不存在 newState 属性。
为什么给 popover 绑 toggle 事件没反应
直接写 popoverElement.addEventListener('toggle', handler) 不会执行，因为浏览器根本不会为 <div popover> 派发 <code>toggle 事件。这不是兼容性问题，而是规范层面的缺失：HTML 标准中 ToggleEvent 接口仅由 <details></details> 实现。
- 检查控制台是否报错：不会报错，但 handler 永远不会被调用
- 想监听 popover 状态变化，必须改用
popovertarget触发后的 DOM 变化，或轮询matches(':popover-open') - 注意：
:popover-open是伪类，不是属性，无法通过getAttribute或dataset读取
用 :popover-open 实现打开/关闭动画的正确姿势
:popover-open 是唯一可靠的 CSS 状态钩子，但它有硬性前提：必须是 Chromium 114+（Chrome/Edge 125+），且 popover 必须通过 showPopover() 或 popovertargetaction="toggle" 激活，不能靠 display: block 强行模拟。
- 初始状态必须设为
display: none，否则:popover-open无法生效（这是最常漏掉的一步） - 动画需同时作用于进入和退出：用
transition+opacity/transform，而非只写:popover-open下的样式 - 示例关键代码：
div[popover] { display: none; opacity: 0; transform: scale(0.95); transition: opacity 0.2s, transform 0.2s; } div[popover]:popover-open { display: block; opacity: 1; transform: scale(1); }
想监听状态变化？别碰 ToggleEvent，改用 MutationObserver 或 matches
如果你需要在 JS 中响应 popover 开合（比如做日志、联动其他组件），matches(':popover-open') 是目前最轻量、最可靠的方式，比轮询性能好，也比监听 click/outside 更准确。
生成可在 deepbi 沙箱 iframe 内运行或作为独立文件运行的交互式 HTML 页面，使用 `window.deepbi` JS SDK 实现数据查询、空间管理、文件浏览及用户操作。当用户提出以下需求时启用该能力： - 创建 KPI 仪表盘、数据表格、文件浏览器、成员列表、管理页面； - 明确要求“转成 dhtml”、“转译成 HTML”、“把 XX 页面转成……”、“控制台页面”、“管理后台”、“DeepBI 页面迁移”； - 提及位于 `apps/console/src/featur
立即学习“前端免费学习笔记（深入）”；
- 不要在
mouseenter后立刻console.log(pop.matches(':popover-open'))—— 此时 DOM 还未更新，要加requestAnimationFrame延迟一帧 - 更稳妥的做法是用
MutationObserver监听popover元素的classList或attributes变化（虽然它本身没 class，但某些 polyfill 会加） - 避免用
setTimeout(..., 0)，它不可靠；requestAnimationFrame才能确保读到渲染后的真实状态
真正容易被忽略的是：:popover-open 不是“只要 popover 元素存在就生效”，它只在浏览器原生生命周期内有效——手动设置 style.display = 'block'、或用 popover="manual" 配合 JS 控制，都会让这个伪类彻底失效。动画逻辑必须和原生 API 绑定，不能绕开。
