fix(comments): restore syntax highlighting for comment code blocks

Comment [code] blocks rendered as bare <pre><code> with only Bootstrap's
grey box — no syntax colours, unlike the reference.

The runtime gates EnlighterJS on `_win.highlight_kg`, which was hardcoded to
false. With that false the selector degrades to `pre code.gl, pre code.special`,
and comment code carries neither class, so it never highlighted. The admin
already exposes 「全局功能 → 代码高亮」 (default on), and jioData.codeHighlight
reads it — only the runtime payload disagreed.

- _win.highlight_kg / highlight_hh / highlight_zt (plus white/dark theme
  names) now come from Settings::get_code_highlight_config(); the initial
  theme follows cookie → mode → time-auto via initial_theme_mode()
- define those values before the _win localize (it sits above jioData in the
  same method)
- inject the reference's two head rules the runtime path was missing:
  max-height from `highlight_maxheight`, and
  `.enlighter-toolbar{display:none}` when `highlight_btn` is off

Tests: comment-image-upload contract gains cases pinning the settings-backed
booleans (and their definition order) and the two inline CSS rules; suite
837/838 with the pre-existing frontend-lifecycle failure.

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
This commit is contained in:
kate522andClaude Opus 5 committed 2026-11-03 17:31:42 +08:00
1 parent 0007e78bfe
commit 451b04160b
3 files changed
+90 -7

No files matched your search

@@ -106,3 +106,52 @@ test('上传按钮提供定位上下文,并去掉自造的静态细条覆盖',
);
assert.doesNotMatch(shell, /height: 3px;[\s\S]{0,80}#comments \.comment-image-upload \.progress/, '自造的 3px 细条已删除');
});
test('评论区代码块随全局代码高亮设置一起高亮(与参考主题一致)', () => {
const scripts = read('src/Core/ScriptsPart1c.php');
// 旧实现把 highlight_* 硬编码为 false,导致 [code] 输出的 <pre><code>
// 不匹配 'pre code:not(.enlighter-origin)',评论区代码块永远无高亮。
assert.doesNotMatch(
scripts,
/'highlight_kg'\s*=>\s*false/,
'highlight_kg 不得再硬编码为 false'
);
assert.match(scripts, /get_code_highlight_config\(\)/, '代码高亮必须读取后台设置');
assert.match(
scripts,
/'highlight_kg'\s*=>\s*\$code_highlight\['enabled'\]/,
'highlight_kg 应来自设置'
);
assert.match(
scripts,
/'highlight_hh'\s*=>\s*\$code_highlight\['lineNumbers'\]/,
'行号开关应来自设置'
);
assert.match(
scripts,
/'highlight_zt'\s*=>\s*\$highlight_theme\['current'\]/,
'初始主题应按当前明暗模式选择'
);
// 变量必须先于 _win 的 wp_localize_script 定义。
const winLocalize = scripts.indexOf("wp_localize_script(");
const codeHighlightAssign = scripts.indexOf('$code_highlight = class_exists');
assert.ok(codeHighlightAssign > 0 && codeHighlightAssign < winLocalize, '$code_highlight 必须先于 _win 定义');
// 注释里的 [code] 输出 <pre><code>,需要匹配运行时的高亮选择器。
const runtime = read('assets/js/runtime/main.js');
assert.match(runtime, /pre code:not\(\.enlighter-origin\)/, '运行时高亮选择器需覆盖裸 pre>code');
});
test('代码高亮的最大高度与按钮开关由后台设置驱动(含评论区 runtime 路径)', () => {
const part1b = read('src/Core/ScriptsPart1b.php');
assert.match(part1b, /get_code_highlight_config\(\)/, '应读取统一的代码高亮配置');
assert.match(
part1b,
/max-height:' \. \$max_height_css \. 'px;overflow-y:auto !important;/,
'最大高度应按设置注入(参考主题同款规则)'
);
assert.match(part1b, /\.enlighter-toolbar\{display:none !important;\}/, '关闭扩展按钮时隐藏工具栏');
assert.match(part1b, /if \(empty\(\$code_highlight_css\['showButtons'\]\)\)/, '仅在按钮开关关闭时隐藏工具栏');
});