Issue #1949Opened April 8, 2019by arachnosoft0 reactions

[Bug] With keepEmptyTextNodes Parser option enabled, a dragged block is dropped above targeted position

Question

Hi @artf ,

Following your tip to enable the "keepEmptyTextNodes" option on the Parser to fix my #1915 issue (grapesjs stripping   between tags), we found the following (weird) side effect, using the latest 0.14.57:

With this option enabled, when dragging & dropping some blocks on a given HTML structure (mostly table>tr>td), the dragged block is dropped ABOVE the targeted position, not where you dropped it.

I reproduced this on the online demo, by setting the option on runtime using the JavaScript console, as follows: grapesjs.editors[0].Parser.getConfig().keepEmptyTextNodes = true

And using the following HTML code in the canvas:

<table align="center" border="0" cellpadding="0" cellspacing="0" width="680" style="box-sizing: border-box;"> <tbody style="box-sizing: border-box;"> <tr style="box-sizing: border-box;"> <td style="box-sizing: border-box; padding: 10px 0 10px 0;"> <table border="0" cellpadding="0" cellspacing="0" width="100%" style="box-sizing: border-box; border-collapse: collapse; font-family: Roboto, Helvetica, Arial, sans-serif; margin-top: 5px;"><tbody style="box-sizing: border-box;"><tr style="box-sizing: border-box;"><td width="100%" style="box-sizing: border-box; padding: 10px;"><div data-highlightable="1" style="box-sizing: border-box; padding: 5px;"><label>TEXT</label>&nbsp;<label>Text</label>&nbsp;Text Text Text TEXT </div></td></tr></tbody></table></td></tr></tbody></table>

As you can see in the below screenshot:

  • prior enabling this option, the &nbsp tags between the <label> tags are stripped once you validate the Import template window, but the button I'm dropping below the text from my above sample is correctly inserted where I wanted to
  • after enabling the option, reimporting the same HTML code does not strip the &nbsp; anymore, but if I drop the button on the exact same place as before, the button is put above the text, not below!

keepEmptyTextNodes leads to bad block position

I guess this has something to do with that continue; statement executed on the Parser code when the option is NOT true, and that the code located immediately after (when keepEmptyTextNodes is true) may break something related to block drop position calculation... but I've been unable to figure that out on my own.

Could you tell me whether you could reproduce this on your side, and if it could be an easy fix or not? We need this keepEmptyTextNodes option to remain enabled.

Thanks!

Answers (2)

artfApril 10, 20190 reactions

Ok, the issue I think is in the Sorter, it doesn't count textnode nodes as children (with keepEmptyTextNodes you keep all of them)

lock[bot]April 25, 20200 reactions

This thread has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.

Related Questions and Answers

Continue research with similar issue discussions.

Paid Plugins That Match This Issue

Curated by issue keywords and label relevance to help you ship faster.

View all plugins

Loading paid plugin recommendations...

Browse Plugin Categories

Jump directly to plugin category pages on the marketplace.