Spans are stripped - unwanted behavior
Question
For example if I import <p><span style="font-size:50px;">hi</span></p> via grapesjs import command, the following is set as the component: <p data-highlightable="1">hi</p>. Losing my styles
Answers (3)
You can reproduce on http://grapesjs.com/demo-newsletter-editor.html
My issue is described here https://github.com/artf/grapesjs/issues/341
https://github.com/artf/grapesjs/blob/dev/src/parser/model/ParserHtml.js#L145
In my case it is preferable to not strip the <span> and leave it in the HTML. Why was it removed?
Be careful of things like:
<p style="font-size:12px;"><span style="font-size:50px;">hi</span> hey</p>
What should the expected output be after the parser?
Hi should be 50px, hey should be 12px. This is why the html parser should not remove spans
I agree with you Matt, indeed, as already mentioned, I'd like to remove it but need to find time to test it, to be sure it's not breaking other stuff. I close this in favor of #341
Related Questions and Answers
Continue research with similar issue discussions.
Issue #1169
[Question] Get and set some styles to active element (in components)
Is it possible to have some style attributes, for example, color, background-color, font-size, in component settings tab, together with tra...
Issue #1893
[QUESTION] Have to have all the blocks the same styles by definition
We are using blockManager, as you can see in the example posted to codesandbox, following the documentation related to custom render. The u...
Issue #774
Mimic customRTE behavior when parsing content
Hi @artf, I'd like to replicate this behavior when calling editor.setComponents("<div>This is a text component. <span style='font-size: 20p...
Issue #871
[BUG] Wrong stylemanager options first time a component/block is selected
Hello, I have noticed the following buggy behaviour on the style manager:Using a local copy of GrapesJS (ver 0.14.5) . Tested in Chrome and...
Paid Plugins That Match This Issue
Curated by issue keywords and label relevance to help you ship faster.
Loading paid plugin recommendations...
Browse Plugin Categories
Jump directly to plugin category pages on the marketplace.