CODEWITHSUNDEEP
tinymcetinymce-5
Gary Lapointe
Gary Lapointe

Reputation: 91

TinyMCE stripping style tags when set to inline

I'm trying to get TinyMCE (v5.6.2) to allow style tags when used in inline mode but it's not working. Here's a sample which demonstrates the problem:

tinymce.init({
  selector: 'div#default',
  inline: true,
  schema: 'html5',
  valid_children: '+body[style]',
  fixed_toolbar_container: '#container',
  plugins: 'code',
  toolbar: 'code'
});
<script src="https://cdn.tiny.cloud/1/qagffr3pkuv17a8on1afax661irst1hbr4e6tbv888sz91jc/tinymce/5/tinymce.min.js"></script>
<div id="container">
  </div>
<div id="default">test</div>
<p>sample</p>

If you edit the source of the text and add a style tag such as (p{color:red}) it's removed as soon as you save the source (so edit the source again and it's gone). But if you change inline mode to false then it works as expected.

I believe this is a bug with TinyMCE but would love to know if anyone else has encountered this and if there's any sort of work around?

Upvotes: 1

Views: 757

Answers (1)

Gary Lapointe
Gary Lapointe

Reputation: 91

Turns out the solution was pretty simple. Because it's inline and the container I used was a div the valid_children property actually needs to be set to "+div[style]". I incorrectly interpreted the docs as meaning that the style tag did not need to be a direct descendent of the body tag and could be anywhere in the descendent tree; of course I know now that this is incorrect as it must be a direct descendent.

Upvotes: 1

Related Questions