<p>用 data-test-id 验证多语言切换需绑定语言行为与 data-* 属性变化，为元素添加 data-test-id（如 <h1 data-test-id="welcome-title" data-i18n="home.welcome">），测试仅断言该 ID；切换后查 data-lang-ready="true" 或 dataset.i18n 键名存在，而非依赖 textContent；SSR 页面需等 window.__I18N_READY 同步；验证 lang 属性应调用 get_attribute("lang")，非 is_selected() 或 element.lang；监听 data-i18n 更新须用 MutationObserver 并配置 attributeFilter: ["data-i18n"] 和 attributes: true。</p>
怎么用 data-test-id 验证多语言切换是否生效
不能靠肉眼检查文字变了没，得用自动化脚本确认 DOM 状态真实更新。核心是把语言切换行为和 data-* 属性变化绑定起来，再用稳定选择器断言。
- 给每个可翻译元素加
data-test-id，比如<h1 data-test-id="welcome-title" data-i18n="home.welcome">欢迎</h1>，测试只认这个 ID，不依赖文本内容 - 切换语言后，立刻查
el.dataset.status或自定义状态属性（如data-lang-ready="true"），而不是等innerText渲染完成——后者受字体加载、CSS 动画影响，不可靠 - 避免用
get_attribute("textContent")断言，它返回空字符串；应调用get_attribute("data-i18n")确认键名存在，再查语言包里对应值是否已注入 - SSR 页面首次 hydration 后，
data-i18n属性还在，但textContent可能还是服务端语言；需等 JS 执行完再断言，可用window.__I18N_READY全局标记做同步点
为什么 get_attribute("lang") 比 is_selected() 更适合验证语言状态
浏览器对 lang 属性的处理是原生且确定的：它直接影响字体回退、标点宽度、屏幕阅读器朗读方式。而 is_selected() 是专为表单控件设计的 property 判断，跟语言无关。
-
document.documentElement.lang必须在切换时同步更新，否则辅助技术仍按旧语言解析；测试脚本应直接调用driver.get_attribute("lang")获取当前值，不是读 JS 变量 - 如果页面有局部
<p lang="ja">，也要单独验证其lang值是否随主语言变更而更新，否则日语段落可能被读成中文音调 -
get_attribute("lang")返回的是 HTML attribute 字符串（如"zh"），而element.lang是 JS property，可能被框架覆盖；自动化测试必须走 DOM 规范路径 - 别用
find_element_by_xpath("//[@lang='en']")这类模糊匹配——XPath 不区分大小写，EN和en都会命中，导致误判
MutationObserver 怎么监听 data-i18n 更新完成
语言包加载和 DOM 替换是异步过程，轮询 innerText 容易漏判或超时。MutationObserver 能精准捕获属性变更，但默认不响应初始 HTML 中的 data-i18n 值。
- 初始化 Observer 时必须设
attributeFilter: ["data-i18n"]，且attributes: true，否则监听不到属性变化 - 首次检查要在
DOMContentLoaded后立即读一次所有data-i18n元素的dataset.i18n，因为 Observer 只捕获 JS 后续修改 - 如果用了自定义元素（如
<lang-switcher>），需在类中声明static get observedAttributes() { return ["data-lang"]; }，回调里attr是完整字符串"data-lang"，不是"lang" - Observer 回调里别直接操作 DOM，先收集变更节点，统一用
requestIdleCallback批量处理，避免触发重排
requests-html 解析多语言页面时 encoding 怎么不翻车
requests-html 的 encoding 属性看似自动，但实际依赖 HTML meta、HTTP header、fallback 三级判断。中文、阿拉伯文、越南文页面最容易在这里出错，导致乱码或解析中断。
立即学习“前端免费学习笔记（深入）”；
- 不要信任
response.html.encoding的初始值——它可能还没扫描完 meta 标签；应在response.html.render()后再读，确保 HTML 已解析 - 遇到
UnicodeDecodeError时，手动设response.html._encoding = "utf-8"再试，比 catch 后 reload 更快 - 若页面含 BOM 头但声明了
charset=gbk，requests-html 会优先信 meta；此时要删掉 meta 标签再解析，或用response.content.decode("gbk")直接解码 - 提取文本时用
element.text，不是element.full_text——后者会拼接 script/style 内容，中文页面常含未转义的<导致截断
真实项目里最常被忽略的是：语言切换后，Intl.DateTimeFormat 实例不会自动更新，日期字段仍按旧 locale 格式化。这没法靠 DOM 测试发现，必须在 e2e 流程里加时间格式断言。
