search

ckeditor / ckeditor4

The best enterprise-grade WYSIWYG editor. Fully customizable with countless features and plugins.
https://ckeditor.com/ckeditor-4
Other
5.79k stars 2.48k forks source link

Using `<svg>` in editor causes `<p>&nbsp;</p>` to be injected between block elements #1410

Open wimleers opened 6 years ago

wimleers commented 6 years ago

Are you reporting a feature request or a bug?

Bug

Provide detailed reproduction steps (if any)

First reported at https://www.drupal.org/project/drupal/issues/2934332.

  1. Click "Source" toolbar button.
  2. Paste <svg class="icon-svg" height="200" width="200"><use xlink:href="/themes/mytheme/images/svg-defs.svg?v=1.0#icon-name"></use></svg>
  3. Click "Source" toolbar button again, to switch out of source mode.
  4. Click "Source" toolbar button twice, to switch in and out of source mode.

Expected result

Only the entered HTML exists.

Actual result

Observe <p>&nbsp;</p> appearing, and hence many empty paragraphs appearing. Without them ever having been entered.

Other details

msamsel commented 6 years ago

Minimal code which is needed to paste to reproduce the error:

<svg></svg>
<p>&nbsp;</p>

Example:

https://codepen.io/msamsel/pen/RxxKGK

Steps to reproduce:

  1. Visit page from example
  2. Switch multiple times between sourcearea and wysiwyg
  3. Observe amount of paragraphs
f1ames commented 6 years ago

See also #1379 for different use cases.

googabeast commented 6 years ago

Other issues exist with SVGs where if a embeded SVG anchor tags contains "xlink:href"

Ex: <a xlink:href="/index.html">Home</a>

the editor will strip off the xlink resulting in

<a href="/index.html" xlink:="">Home</a>

diskortsev commented 5 years ago

Any progress on this issue?

f1ames commented 5 years ago

@diskortsev No progress on this issue as we have other priorities at the moment.

diskortsev commented 5 years ago

Good news. Just discovered that the bug is not reproducible in CKeditor 4.12.1

f1ames commented 5 years ago

@diskortsev Are you sure? It still seems to be reproducible on https://codepen.io/f1ames/pen/JQQoyY. Can you confirm?

diskortsev commented 5 years ago

@f1ames In your codepen I could reproduce it as well. I have found the situation when it is not reproducible. The should be in the end and there should be no any newline after it. <textarea name="" id="editor" cols="30" rows="10"><svg></svg></textarea> https://codepen.io/anon/pen/pXXyZy

gebiss commented 3 years ago

A solution that will blow your mind ;-) Just wrap your <svg>with <div> and it will not be adding <p>&nbsp;</p> anymore. <div><svg></svg></div>