TinyMCE opening page with embedded SVG

Mark Barratt <[email protected]> Mon, 20 Apr 2015 09:30:31 +0100
Newsgroups gmane.comp.web.zope.plone.user
Message-ID <[email protected]>
I’m seeing some puzzling behaviour with TinyMCE and I’d be grateful if anyone can tell me what’s going on.

For various reasons I want to be able to output XML with embedded SVG files from my Plone CMS (4.3).

Getting SVG into pages so far has meant

- adding svg tags to ‘HTML Filtering’ in the Plone control panel (this made little difference).

- switching off ‘safe_html’ through the ZMI in portal transforms (initially made no difference, then updated TinyMCE to 1.4.0 so it listens to the portal transforms switch).

At this point I can paste a valid SVG element into the HTML view in TinyMCE, update and see it rendered in the editor, then save the page and see it rendered and scaled in the view.

However, if I then call ‘Edit’ then TinyMCE rewrites the SVG element to the edit view with some markup rendered as literals and lots of ‘badref’ attributes with no value. So this (a fragment):

<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
	 viewBox="0 0 164 165.2" enable-background="new 0 0 164 165.2" xml:space="preserve" height="250" width="250">
<g>
	<rect y="108.9" fill="#4A4949" width="21" height="56.3"/>
	<rect x="7" y="151.9" fill="none" width="8.3" height="12"/>
	<text transform="matrix(1 0 0 1 7.0002 160.9924)" fill="#FFFFFF" font-family="'OpenSans-CondensedBold'" font-size="12">1</text>
	<rect x="4.3" y="107.9" fill="none" width="11.3" height="38.3"/>
	
		<text transform="matrix(4.489659e-11 -1 1 4.489659e-11 13.4533 146.2059)" fill="#FFFFFF" font-family="'OpenSans-CondensedBold'" font-size="12">follow</text>
	<rect x="23.3" y="90.1" fill="#4A4949" width="21" height="75.1"/>
	<rect x="30.3" y="151.9" fill="none" width="8.3" height="12"/>
	<text transform="matrix(1 0 0 1 30.3335 160.9924)" fill="#FFFFFF" font-family="'OpenSans-CondensedBold'" font-size="12">2</text>
	<rect x="27.7" y="107.9" fill="none" width="11.3" height="38.3"/>
	
		<text transform="matrix(4.489659e-11 -1 1 4.489659e-11 36.7866 146.2059)" fill="#FFFFFF" font-family="'OpenSans-CondensedBold'" font-size="12">assist</text>

becomes this sort of thing (a fragment:

<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewbox="0 0 164 165.2" enable-background="new 0 0 164 165.2" xml:space="preserve" height="250" width="250"> <g> <rect y="108.9" fill="&lt;span class=" badref=""></rect></g></svg><span class="badref"><span class="badref"><span class="badref"><span class="badref"><span class="badref"><span class="badref">#4</span></span></span></span></span></span>A4949" width="21" height="56.3"&gt;

Anyone have any ideas on what is happening and how I can resolve it?

Many thanks

--
Mark Barratt

------------------------------------------------------------------------------
BPM Camp - Free Virtual Workshop May 6th at 10am PDT/1PM EDT
Develop your own process in accordance with the BPMN 2 standard
Learn Process modeling best practices with Bonita BPM through live exercises
http://www.bonitasoft.com/be-part-of-it/events/bpm-camp-virtual- event?utm_
source=Sourceforge_BPM_Camp_5_6_15&utm_medium=email&utm_campaign=VA_SF
_______________________________________________
Plone-Users mailing list
[email protected]
https://lists.sourceforge.net/lists/listinfo/plone-users