fix(submit): detect empty body without editor chrome and let body fill the frame

登录态实测(Edge + 真实 TinyMCE)复现了上一版没修好的两点:

1. 占位符仍不显示:editor-runtime 会把块级删除浮层插进 body,它带
   data-mce-bogus 但含「✕ 选中此块」文字,body.textContent 因此永远非空,
   data-jio-empty 一直没被打上。判断正文是否为空时先剔除 data-mce-bogus 节点。

2. 点空白落不到正文:body 高度只有 29px。`min-height:100%` 的父级 html
   没有确定高度,百分比退化成 auto。改为 html{height:100%} +
   body{min-height:100%},body 现在铺满 520px 的 iframe。

实测结果(登录态 https://localhost/submit/):
- 首次加载 data-jio-empty=1、::before 渲染「请输入正文」;
- 点击正文中部空白,光标落进 P 并可继续输入;
- 引用块内编辑后点空白,光标落到引用之后的段落;
- 清空内容后占位符恢复。

测试:新增「编辑器辅助节点不算正文」回归用例;900 → 901 全通过。

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
This commit is contained in:
kate522andClaude Opus 5 committed 2026-11-09 21:16:45 +08:00
1 parent 5afa7ab9df
commit 305896796c
5 files changed
+52 -10

No files matched your search

+18 -2
View File
@@ -40,16 +40,32 @@
return editor.getBody();
}
/**
* 正文自身的副本:剔除 TinyMCE 的辅助节点。
*
* 编辑器会把块级删除浮层(#jio-block-actions)之类带文字的工具节点插进
* body,它们都带 data-mce-bogus。直接读 body.textContent 会把「选中此块」
* 当成正文,导致空正文永远判成非空、占位符不显示。
*/
function contentClone(body) {
var clone = body.cloneNode(true);
Array.prototype.forEach.call(clone.querySelectorAll('[data-mce-bogus]'), function (node) {
node.parentNode && node.parentNode.removeChild(node);
});
return clone;
}
function isEmpty() {
var body = root();
if (!body) {
return false;
}
var content = contentClone(body);
// 图片 / 视频 / 表格这类块即使没有文字也算有内容。
if (body.querySelector(MEDIA)) {
if (content.querySelector(MEDIA)) {
return false;
}
return String(body.textContent || '').replace(/[\s ]+/g, '') === '';
return String(content.textContent || '').replace(/[\s ]+/g, '') === '';
}
/** 空正文标记交给 CSS 渲染提示文字。 */