tinymce-angular icon indicating copy to clipboard operation
tinymce-angular copied to clipboard

Excessive nested span tags generated when repeatedly copy-pasting text with white background color

Open cyxysky opened this issue 7 months ago • 0 comments

Bug Description

When using TinyMCE with Angular, repeatedly copy-pasting text segments with white background color results in excessive nested <span> tags being generated in the editor content.

Steps to Reproduce

  1. Initialize TinyMCE editor in Angular application
  2. Input a paragraph of text in the editor
  3. Select all text and set background color to white
  4. Randomly select a portion of text from the middle of the paragraph
  5. Copy the selected text (Ctrl+C)
  6. Position cursor at a fixed location in the editor
  7. Paste the copied text (Ctrl+V)
  8. repeat 5-7 more times

Image

Expected Behavior

The pasted text should maintain clean HTML structure with minimal nested tags, similar to:

<p><span style="background-color: white;">Your text content</span></p>

Actual Behavior

After multiple copy-paste operations, the HTML structure becomes heavily nested with multiple <span> tags:

<p>
  <span style="background-color: white;">
    <span style="background-color: white;">
      <span style="background-color: white;">
        <span style="background-color: white;">
          Your text content
        </span>
      </span>
    </span>
  </span>
</p>

This will reproduce in your example your example

cyxysky avatar Jul 03 '25 06:07 cyxysky