fix(payment): 导入提示不再使用 WP notice 类,避免被 common.js 搬到页面顶部

真因:wp-admin/js/common.js 在 DOM 就绪时执行
  $('div.updated, div.error, div.notice').not('.inline, .below-h2').insertAfter($headerEnd)
它会把页面上所有「非 inline」的 notice 搬到 .wp-header-end(不存在时取 .wrap 内首个
h1/h2)之后。提示块原先输出 class="aksrt-submsg notice notice-warning",被判定为
notice,于是在求值之后被整块搬到页头:既脱离「添加方式—卡密数据」之间的字段区,
又因为搬迁发生在 evalDeps 之后,行内显隐逻辑无从纠正。

这也是同一现象反复出现的真因:四条提示都可见时会被整体搬到页面最上方;给提示块
补上初始隐藏后看起来像「提示不见了」;改为全文档求值后则表现为「提示显示在页面
最顶部」。此前的 foster-parenting 判断有误——服务端输出的表格结构始终合法。

改动:
- submessage_row() 只输出自有类名 aksrt-submsg,不再复用 .notice / .notice-warning。
- 外观(底色 #fef8ee + 左侧 4px #f0b849 色条)改由 .aksrt-submsg 自带,与参考主题
  CSF content 字段的做法一致;元素内联样式只保留初始隐藏状态。
- 新增契约用例:提示块不得带 notice;.aksrt-submsg 必须自带 background 与 border-left;
  并确认页面级错误通知仍正常使用 notice(不误伤其它通知输出)。
This commit is contained in:
2026-09-17 12:19:25 +08:00
parent 45c7a4a59c
commit d787f3ff97
2 changed files with 44 additions and 10 deletions
+31 -4
View File
@@ -203,15 +203,42 @@ test('两种行渲染都接入服务端预隐藏,避免首帧铺开', () => {
assert.match(page, /private function field_row\([\s\S]*?\$hidden\s*=\s*\(\$deps && !\$this->deps_visible\(\$deps\)\)/);
assert.match(page, /private function submessage_row\([\s\S]*?\$hidden\s*=\s*\$this->deps_visible\(\$deps\)/);
assert.match(script, /document\.addEventListener\('DOMContentLoaded', evalDeps\)/);
// 提示块必须自带 data-dep 与初始隐藏状态:脱离所在行时(表格解析器把非法节点
// foster-parent 到 <table> 之前)仍能被求值并保持隐藏。
// 提示块必须自带 data-dep 与初始隐藏状态:即使提示块脱离所在行(WP 的
// wp-admin/js/common.js 会把页面上的 notice 搬到页头,见下一条用例),
// 它仍能被求值并保持隐藏。
assert.match(page, /<td colspan="2"><div'\s*\.\s*\$dep_attr/, '提示块必须自带 data-dep');
assert.match(page, /style="margin:6px 0;padding:6px 12px;'\s*\.\s*\$hidden/, '提示块必须自带初始隐藏状态');
// 求值范围不限域:提示块被解析器移出表格/表单子树后仍必须被求值。
assert.match(page, /class="aksrt-submsg"'\s*\.\s*\$hidden/, '提示块必须自带初始隐藏状态');
// 求值范围不限域:提示块被移出表格/表单子树后仍必须被求值。
assert.match(script, /querySelectorAll\('\[data-dep\]'\)/, '求值必须全文档查找 data-dep');
assert.doesNotMatch(script, /querySelectorAll\('\.aksrt-cardpass-form \[data-dep\]'\)/, '求值不得限域在表单内');
});
test('导入提示不得使用 WP 的 .notice 类(否则被 common.js 搬到页面顶部)', () => {
// wp-admin/js/common.js 在 DOM 就绪时执行:
// $('div.updated, div.error, div.notice').not('.inline, .below-h2').insertAfter($headerEnd)
// 会把页面上所有非 inline 的 notice 搬到 .wp-header-end(不存在时取 .wrap 内首个 h1/h2)之后。
// 提示块一旦带 .notice,就会脱离「添加方式—卡密数据」之间的字段区跑到页面顶部,
// 且搬迁发生在 evalDeps 之后,行内显隐逻辑无法纠正(历史故障:提示一直显示在页面最上方)。
assert.match(
page,
/private function submessage_row\([\s\S]*?class="aksrt-submsg"/,
'提示块只应带自有类名 aksrt-submsg'
);
assert.doesNotMatch(
page,
/class="aksrt-submsg[^"]*\bnotice\b/,
'提示块不得带 notice 类:会被 common.js 搬到页面顶部'
);
// 外观改由自有类名承担,删掉样式规则会让提示失去底色与左侧色条。
assert.match(
page,
/\.aksrt-submsg \{[^}]*background:[^}]*border-left:/,
'.aksrt-submsg 必须自带 background 与 border-left 外观'
);
// 允许(且要求)真正需要置顶的提示保留 notice:确认本用例没有误伤其它通知输出。
assert.match(page, /class="notice notice-error"/, '页面级错误通知仍应使用 notice');
});
test('行内脚本不再保留解析期的空操作求值(死代码)', () => {
assert.doesNotMatch(script, /evalDeps\(\);\s*\}\)\(\);/);
assert.match(script, /document\.addEventListener\('change'/);