tinymce / tinymce-vue

Official TinyMCE Vue component
MIT License
2.01k stars 202 forks source link

Why is the li tag inside the ol tag separated? #392

Open bang-star opened 8 months ago

bang-star commented 8 months ago

What is the current behavior? Describe the bug

The data was set as follows.

const content = `<ol>
 <li>ABCD</li>
 <li>BCDE</li>
</ol>`;

What is the expected behavior?

Here's what I expected it to look like:

<ol>
 <li>ABCD</li>
 <li>BCDE</li>
</ol>

But converted tag as follows.

<ol>
  <ol>
     <li>ABCD</li>
  </ol>
</ol>
<ol>
  <ol>
     <li>BCDE</li>
  </ol>
</ol>

Which versions of TinyMCE, and which browser / OS are affected by this issue? Did this work in previous versions of TinyMCE?

Environment

My Config

const init = {
selector: 'textarea',
  plugins: ['advlist autolink lists link image charmap print preview anchor nonbreaking imagetools autoresize media anchor paste bbcode code visualblocks mediaembed'],
  toolbar: 'code formatselect | align | forecolor | bold underline | link media | template | blockquote | undo redo | image',
  menu: {
    file: {title: '파일', items: ['newdocument', 'preview', 'print']},
    edit: {title: '수정', items: ['undo', 'redo', 'copy', 'cut', 'paste', 'selectall']},
    view: {title: '보기', items: ['visualaid', 'visualchars', 'visualblocks', 'spellchecker', 'preview', 'fullscreen']},
    insert: {title: '삽입', items: ['image', 'link', 'media', 'template', 'codesample', 'inserttable', 'charmap emoticons', 'hr', 'pagebreak', 'nonbreaking', 'anchor', 'toc', 'insertdatetime']},
    format: {title: '포맷', items: ['bold', 'italic', 'underline', 'strikethrough', 'superscript', 'subscript', 'codeformat', 'formats', 'blockformats', 'fontformats', 'fontsizes', 'align', 'lineheight', 'forecolor', 'backcolor', 'removeformat']},
    tool: {title: '도구', items: ['spellchecker', 'spellcheckerlanguage', 'code', 'wordcount']},
  },
  force_p_newlines: false,
  force_br_newlines: false,
  forced_root_block: '',
  newline_behavior: '',
  min_height: 1000,
  min_width: 400,
  max_width: 500,
  content_css: 'writer',
  content_style: `
      img { max-width: 100%; height: auto; }
      .mce-content-body { padding: 48px!important; }
      .media-outer {left: 0px; width: 100%; height: 0px; position: relative; padding-bottom: 56.25%;}
      span[data-mce-p-class='media-inner'] {top: 0; left: 0; width: 100%; height: 100%; position: absolute; border: 0;}
      span[data-mce-p-class='media-inner'] iframe { width: 100%; height: 100%; }
  `,
  statusbar: false,
  language: 'ko_KR',
  media_live_embeds: true,
  media_dimensions: false,         // 동영상 크기 수정
  image_file_types: 'jpg,svg,png', // IMAGE 파일 타입,
  resize: true,
  tiny_pageembed_classes: [
    { text: 'Big embed', value: 'my-big-class' },
    { text: 'Small embed', value: 'my-small-class' }
  ],
  remove_trailing_brs: true,
}
exalate-issue-sync[bot] commented 8 months ago

Ref: INT-3243