fix(creator-studio): hide block-delete overlay inside the editor iframe
块级删除浮层插在 TinyMCE 的 iframe 里,但隐藏规则只写在父页面样式表, iframe 是独立文档、拿不到这些样式,于是 opacity:0 / position:absolute 全部 失效,✕ 退化成正文顶部的常显元素。 - 把 #jio-block-actions 的定位与隐藏规则移入 content_style,并给 body 加 position:relative 作为定位基准;隐藏时 pointer-events:none 避免挡住正文 - 浮层加 data-mce-bogus="all",让 TinyMCE 在序列化、字数和选区计算时跳过它, 否则 ✕ 会被写进保存内容 - 删除 _block-tools.scss 中作用于同一选择器的页面级死样式 - 契约测试锁定「样式必须在 content_style」与 bogus 属性 Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
This commit is contained in:
1 parent
1970db0b56
commit
3e48fdf61e
7 files changed
+77
-44
No files matched your search
@@ -265,6 +265,25 @@ test('top bar is masthead + centered toolbar, with no brand text in the toolbar
|
||||
assert.doesNotMatch(rest, /'home'\s*=>\s*esc_url_raw\(\$home\)/);
|
||||
});
|
||||
|
||||
test('block delete overlay lives inside the editor iframe and stays hidden', () => {
|
||||
const runtime = read('assets/creator-studio/src/editor-runtime.ts');
|
||||
const contentStyle = read('assets/creator-studio/src/editor-content-style.ts');
|
||||
const pageStyles = read('assets/creator-studio/src/styles/_block-tools.scss');
|
||||
|
||||
// 浮层插在 TinyMCE iframe 的 body 里。
|
||||
assert.match(runtime, /doc\.body\.appendChild\(bar\)/);
|
||||
assert.match(runtime, /bar\.id = 'jio-block-actions'/);
|
||||
// iframe 是独立文档:页面级样式表管不到它,隐藏规则必须写在 content_style。
|
||||
assert.match(contentStyle, /#jio-block-actions\s*\{[^}]*position:\s*absolute/);
|
||||
assert.match(contentStyle, /#jio-block-actions\s*\{[^}]*opacity:\s*0/);
|
||||
assert.match(contentStyle, /#jio-block-actions\.is-visible\s*\{[^}]*opacity:\s*1/);
|
||||
assert.match(contentStyle, /body\s*\{[^}]*position:\s*relative/);
|
||||
// 页面级 SCSS 不再重复定义 iframe 内部的选择器(否则只是死样式)。
|
||||
assert.doesNotMatch(pageStyles, /\.jio-creator__block-actions\s*\{/);
|
||||
// data-mce-bogus 让 TinyMCE 序列化、字数和选区都跳过这个浮层。
|
||||
assert.match(runtime, /setAttribute\('data-mce-bogus', 'all'\)/);
|
||||
});
|
||||
|
||||
test('creator studio build artifacts and contracts exist', () => {
|
||||
assert.ok(exists('assets/creator-studio/package.json'));
|
||||
assert.ok(exists('assets/creator-studio/package-lock.json'));
|
||||
|
||||
Reference in new issue
Block a user