fix: 修复Markdown文章编辑模式判定
This commit is contained in:
parent
1672b9f446
commit
b813af5af7
@ -31,8 +31,11 @@ class FakeEditor {
|
||||
|
||||
public commands = {
|
||||
focus: () => true,
|
||||
setContent: (value: string) => {
|
||||
setContent: (value: string, options?: { emitUpdate?: boolean }) => {
|
||||
this.html = value;
|
||||
if (options?.emitUpdate !== false) {
|
||||
this.options.onUpdate?.({ editor: this });
|
||||
}
|
||||
return true;
|
||||
},
|
||||
};
|
||||
@ -316,6 +319,8 @@ describe('ktTiptapHtmlEditor', () => {
|
||||
);
|
||||
await nextTick();
|
||||
|
||||
expect(wrapper.emitted('update:modelValue')).toHaveLength(1);
|
||||
expect(wrapper.emitted('change')).toHaveLength(1);
|
||||
expect(wrapper.emitted('update:modelValue')?.at(-1)).toEqual([
|
||||
'<h2>新标题</h2><p>新正文</p>',
|
||||
]);
|
||||
|
||||
@ -540,7 +540,7 @@ export default defineComponent({
|
||||
return;
|
||||
}
|
||||
|
||||
currentEditor.commands.setContent(value);
|
||||
currentEditor.commands.setContent(value, { emitUpdate: false });
|
||||
emitHtmlChange(readEditorHtml(currentEditor, value), previousHtml);
|
||||
}
|
||||
|
||||
@ -557,7 +557,7 @@ export default defineComponent({
|
||||
if (nextHtml === currentHtml.value) return;
|
||||
|
||||
currentHtml.value = nextHtml;
|
||||
editor.value?.commands.setContent(nextHtml);
|
||||
editor.value?.commands.setContent(nextHtml, { emitUpdate: false });
|
||||
},
|
||||
);
|
||||
|
||||
|
||||
@ -19,7 +19,7 @@ describe('blog article form helpers', () => {
|
||||
const values = getBlogArticleEditFormValues({
|
||||
categories: ['技术'],
|
||||
contentHtml:
|
||||
'<pre class="wp-block-code hljs-codeblock"><code class="hljs sql">select 1;</code></pre>',
|
||||
'<pre class="wp-block-code hljs-codeblock"><code class="hljs sql"><table class="hljs-ln"><tbody><tr><td class="hljs-ln-line hljs-ln-code">select 1;</td></tr></tbody></table></code><div class="hljs-control"></div></pre>',
|
||||
contentMarkdown: '```sql\nselect 1;\n```',
|
||||
excerpt: '摘要',
|
||||
id: '50',
|
||||
@ -34,6 +34,43 @@ describe('blog article form helpers', () => {
|
||||
expect(values.content).toContain('hljs-codeblock');
|
||||
});
|
||||
|
||||
it('keeps existing markdown articles in markdown mode when rendered html is present', () => {
|
||||
const values = getBlogArticleEditFormValues({
|
||||
categories: [],
|
||||
contentHtml: '<h1>标题</h1><p>正文</p>',
|
||||
contentMarkdown: '# 标题\n\n正文',
|
||||
excerpt: '',
|
||||
id: '52',
|
||||
slug: 'markdown-post',
|
||||
status: 'publish',
|
||||
tags: [],
|
||||
title: 'Markdown 文章',
|
||||
});
|
||||
|
||||
expect(values.editorMode).toBe('markdown');
|
||||
expect(values.contentFormat).toBe('markdown');
|
||||
expect(values.content).toBe('# 标题\n\n正文');
|
||||
});
|
||||
|
||||
it('keeps markdown fenced code articles in markdown mode after Argon base rendering', () => {
|
||||
const values = getBlogArticleEditFormValues({
|
||||
categories: [],
|
||||
contentHtml:
|
||||
'<pre class="wp-block-code hljs-codeblock"><code class="hljs typescript">const a = 1;</code></pre>',
|
||||
contentMarkdown: '```ts\nconst a = 1;\n```',
|
||||
excerpt: '',
|
||||
id: '53',
|
||||
slug: 'markdown-code-post',
|
||||
status: 'publish',
|
||||
tags: [],
|
||||
title: 'Markdown 代码文章',
|
||||
});
|
||||
|
||||
expect(values.editorMode).toBe('markdown');
|
||||
expect(values.contentFormat).toBe('markdown');
|
||||
expect(values.content).toBe('```ts\nconst a = 1;\n```');
|
||||
});
|
||||
|
||||
it('edits plain HTML articles with the rich HTML editor by default', () => {
|
||||
const values = getBlogArticleEditFormValues({
|
||||
categories: [],
|
||||
|
||||
@ -16,8 +16,9 @@ export const BLOG_ARTICLE_HTML_TEXTAREA_CLASS =
|
||||
'blog-article-form__html-source';
|
||||
export const BLOG_ARTICLE_MARKDOWN_MIN_HEIGHT = 560;
|
||||
|
||||
const ARGON_HTML_PATTERN =
|
||||
/\b(?:wp-block-|hljs-codeblock|hljs-ln|hljs-control|fancybox-wrapper|lazyload|collapse-block)/;
|
||||
const ARGON_BASE_CODEBLOCK_PATTERN = /\b(?:wp-block-code|hljs-codeblock)\b/;
|
||||
const SOURCE_ONLY_HTML_PATTERN =
|
||||
/\b(?:hljs-ln|hljs-control|fancybox-wrapper|lazyload|collapse-block|wp-block-(?!code\b)[\w-]+)/;
|
||||
const HTML_TAG_PATTERN = /<\/?[a-z][\s\S]*>/i;
|
||||
|
||||
/**
|
||||
@ -118,16 +119,18 @@ export function getContentFormatForEditorMode(
|
||||
}
|
||||
|
||||
/**
|
||||
* Chooses the editor mode for an existing article without forcing imported Argon HTML through Tiptap or Markdown.
|
||||
* Chooses the editor mode for an existing article without forcing Markdown source or imported Argon HTML into the wrong editor.
|
||||
* @param article Article row returned by the local blog API.
|
||||
* @returns Source HTML for Argon runtime snapshots, rich HTML for plain tags, otherwise Markdown.
|
||||
* @returns Markdown for source-backed articles, source HTML for strong runtime DOM, rich HTML for plain tags.
|
||||
*/
|
||||
export function getBlogArticleEditorMode(
|
||||
article?: Partial<WordpressBlogApi.Article>,
|
||||
): BlogArticleEditorMode {
|
||||
const html = getRenderedValue(article?.contentHtml || article?.content);
|
||||
if (!html) return 'markdown';
|
||||
if (ARGON_HTML_PATTERN.test(html)) return 'html-source';
|
||||
if (SOURCE_ONLY_HTML_PATTERN.test(html)) return 'html-source';
|
||||
if (hasMarkdownSource(article)) return 'markdown';
|
||||
if (ARGON_BASE_CODEBLOCK_PATTERN.test(html)) return 'html-source';
|
||||
return HTML_TAG_PATTERN.test(html) ? 'html-rich' : 'markdown';
|
||||
}
|
||||
|
||||
@ -241,6 +244,15 @@ function getRenderedValue(value?: string | WordpressBlogApi.RenderedField) {
|
||||
return value.raw || value.rendered || '';
|
||||
}
|
||||
|
||||
/**
|
||||
* Detects whether the article still owns an editable Markdown source snapshot.
|
||||
* @param article Article row returned by the local blog API.
|
||||
* @returns true when Admin should prefer Milkdown unless strong runtime-only HTML is present.
|
||||
*/
|
||||
function hasMarkdownSource(article?: Partial<WordpressBlogApi.Article>) {
|
||||
return !!article?.contentMarkdown?.trim();
|
||||
}
|
||||
|
||||
/**
|
||||
* Chooses editable Markdown from an API rendered field and its explicit Markdown source.
|
||||
* @param value Rendered field or string value.
|
||||
|
||||
Loading…
Reference in New Issue
Block a user