Sourcecode editor randomly drops spaces on "Save and Replace" #178

Closed
salicyl opened this Issue Mar 10, 2012 · 14 comments

Comments

Projects
None yet
6 participants

salicyl commented Mar 10, 2012

When viewing a document's HTML source, then hitting save & replace, Mercury will randomly drop or add spaces in the document (it won't touch nbsps).

To reproduce, this works best when copy-pasting a long text from one source view to another, then watching the differences in WYSIWYG mode.

Contributor

swistak commented May 25, 2012

IS this really an issue? html is pretty white space insensitive.

salicyl commented May 31, 2012

To clarify, it doesn't drop whitespaces in the HTML source (well, it does, but that's not the real problem). It rather drops them in the rendered view, which oftentimes results in unreadable text.

Contributor

swistak commented Jun 1, 2012

Are you using anything to sanitize input/ clean up tags? I'd suspect it's not editor fault.

Petah commented Jun 1, 2012

Also, on a side note, white space after a heading tag in IE 6 sometimes will be rendered, where as any other browser will not render it.

Owner

jejacks0n commented Jun 6, 2012

Can anyone provide an exact way to reproduce this?

salicyl commented Jun 7, 2012

@swistak yes, but not in the relevant part. For testing, I removed the cleanup script and it still happened the same way.

@jejacks0n take some sort of long, properly formatted text and post it in WYSIWYG mode. Then enter HTML edit mode and (without actually editing anything) hit "Save and Replace". The editor will now drop spaces seemingly at random throughout the text.

Owner

jejacks0n commented Jun 7, 2012

I'm not seeing this happen.. I asked for _exact_ replication instructions. What browser, what os, what content, type of region, etc.

salicyl commented Jun 7, 2012

Browser is Chrome (up to date), Client OS is Win7. Region is "editable region".

Content is the following:

"Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas auctor eros et purus suscipit euismod. Suspendisse imperdiet hendrerit diam quis sodales. Aliquam congue mi eu leo feugiat vitae sodales leo interdum. Aliquam erat volutpat. Cras lectus felis, varius id blandit ac, ultricies nec ligula. Morbi lacus magna, volutpat mattis porttitor vestibulum, tempor at enim. Nunc porttitor nibh massa. Fusce interdum mattis lacus, blandit rutrum arcu commodo ac. Aenean adipiscing imperdiet erat vel facilisis. Pellentesque et metus eget urna suscipit egestas vitae sit amet lacus.

Phasellus tempor ullamcorper tellus id pharetra. Proin ut urna mi, ut laoreet dolor. Proin molestie est mi, quis porttitor est. Aliquam dictum eleifend felis, eu volutpat metus dictum mollis. Nam accumsan, diam ac tempus tincidunt, velit sapien euismod ligula, ac vulputate massa lectus in mi. Nam feugiat vehicula mi sed faucibus. Etiam vestibulum, nisi sed rhoncus viverra, lacus lorem cursus magna, ac venenatis leo est in quam. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed non nunc diam, ut pellentesque ipsum. Nunc pretium volutpat enim non convallis. Ut at sapien nec lacus lobortis convallis in vitae nibh. Nam ultrices, ligula sit amet mollis tempus, mauris nulla aliquet nisl, quis varius metus mauris at mi. Aliquam sed tristique risus. Donec vestibulum, orci eget hendrerit lacinia, felis justo tempus diam, in vestibulum augue magna quis nunc. Morbi enim odio, posuere non dignissim non, volutpat aliquam nunc. Ut elementum dignissim nisl, nec vestibulum elit suscipit sed.

Donec ultricies felis eu quam dapibus venenatis. Fusce scelerisque ornare malesuada. Integer aliquet felis at lacus lobortis sodales. Maecenas convallis aliquam elit vel tempus. Sed dui velit, adipiscing eu scelerisque eu, tristique at lacus. Donec mollis consequat vehicula. Cras ullamcorper, velit fermentum vulputate consequat, libero dolor volutpat urna, nec varius sem ipsum vel sapien. Sed lectus mauris, pulvinar aliquet aliquam eu, mattis id nulla. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus sit amet orci eu justo eleifend rutrum in id purus. Praesent nulla elit, pellentesque ac sodales tristique, hendrerit eget libero.

Phasellus vulputate vehicula nisi, eget fringilla erat adipiscing vel. Proin ut mauris quis nulla adipiscing tincidunt in et arcu. Maecenas non rutrum sem. Ut id arcu in dui aliquet aliquet. Aliquam pulvinar ornare elit, sed tristique nulla eleifend vitae. In convallis auctor egestas. Donec a elit a purus luctus feugiat. Ut accumsan pulvinar dui vehicula gravida. Donec dolor odio, elementum a porttitor id, aliquam a neque. Morbi sollicitudin, tellus ac suscipit commodo, mi enim suscipit dui, eu vestibulum massa leo ut ipsum. Cras tempus enim a enim volutpat venenatis. Nunc rutrum commodo ultricies. Nullam ultricies porttitor sapien, vitae ultricies nisl lacinia sed. Vestibulum sagittis augue adipiscing odio pharetra fringilla. Integer a orci nisl. Praesent ultrices neque sed erat molestie elementum viverra ipsum tristique.

Sed placerat egestas laoreet. Nunc a nisl sed sem porttitor porta ac sed nunc. Etiam eleifend leo eu massa ornare id rhoncus metus sodales. Donec posuere tempor elit, in molestie lectus mattis vitae. Nam porta commodo odio, a vestibulum tellus porttitor quis. Donec facilisis augue eu tellus vehicula ut imperdiet nunc tristique. Donec accumsan rhoncus pharetra. Aenean ullamcorper lacinia arcu. Nunc suscipit lobortis magna, in eleifend lectus vestibulum in. Vivamus arcu lacus, condimentum a iaculis vitae, sollicitudin non dolor. Sed iaculis nulla id purus faucibus et ultricies ligula dignissim. Curabitur vitae diam velit, ut rhoncus felis. Duis vitae nulla ut risus malesuada scelerisque. Morbi a aliquam odio. Pellentesque semper sagittis euismod. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.

Morbi aliquam tincidunt arcu non malesuada. Integer porttitor porttitor lectus non convallis. Nulla sit amet sollicitudin leo. Vivamus cursus rhoncus ullamcorper. Nunc in mi id nibh vestibulum lobortis sit amet quis augue. Aliquam pellentesque, leo eu egestas hendrerit, nisl odio mollis odio, non pharetra sem augue eu elit. Nam id dui sit amet nulla porttitor pharetra. In ultricies ante et lorem varius condimentum commodo velit commodo. Nullam eu nulla enim, quis vestibulum purus. Pellentesque arcu libero, egestas at molestie quis, tempus a metus. Nam sit amet turpis sit amet dolor blandit mattis eu et neque. Phasellus tristique sollicitudin quam at gravida. Proin augue arcu, posuere sit amet iaculis quis, ultricies vel felis. Donec mollis consectetur mollis.

Integer vitae neque diam. Quisque vel lorem non sapien imperdiet vestibulum in vel eros. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Donec nisi nibh, malesuada a congue eu, fermentum in augue. Nam consequat nibh nulla, non fermentum mauris. Etiam ullamcorper massa et magna tempus auctor. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nunc magna justo, dignissim nec commodo ac, convallis non eros. Pellentesque aliquam malesuada mauris, quis placerat mi porta quis.

Cras in porta mi. Nullam eu nisi quis sapien blandit suscipit. Praesent tincidunt tempor orci nec commodo. In mollis convallis sem, eu scelerisque velit ornare vel. Donec sed justo sit amet ante elementum dapibus in ut lorem. Nam auctor massa lectus. Nam euismod, felis vel laoreet vulputate, libero velit pretium ante, in lacinia leo arcu id nisl. Suspendisse eu est faucibus metus hendrerit semper. Sed id velit lacus. Sed facilisis ornare ante, in posuere ante placerat vel. Morbi euismod tincidunt vulputate. Aliquam erat volutpat. Curabitur augue lacus, molestie ut fringilla nec, tristique sit amet nulla. Suspendisse potenti. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae;

Proin vel turpis ac elit bibendum luctus. Maecenas condimentum aliquam sem ut mollis. Phasellus eu sodales mi. Nullam vitae leo felis, ut tincidunt arcu. Aliquam erat volutpat. Duis non neque a ligula dignissim tincidunt in id nulla. Maecenas ante ante, egestas quis aliquet eget, tempor et augue. Nullam vel magna turpis, ultricies condimentum orci. Vivamus at purus et metus viverra placerat vel non orci. Quisque eget semper magna. Aliquam eget risus ac turpis sagittis porta aliquet a lectus.

Sed fermentum massa eu enim consectetur laoreet. Cras facilisis dolor ut sapien malesuada a consequat odio tincidunt. Donec suscipit dui non est tempor sit amet posuere elit euismod. Mauris non metus lacus. Nulla facilisi. Morbi tincidunt, nisl sit amet sollicitudin congue, mi sem sodales nisl, eget vulputate velit purus id velit. Morbi elementum imperdiet dapibus. Pellentesque nunc nunc, fermentum quis tristique quis, gravida suscipit purus. Nunc ut mauris eget dui iaculis condimentum et euismod mauris.

Phasellus in sapien nec orci eleifend tincidunt eu ac tellus. Proin rhoncus semper sapien sit amet tristique. Pellentesque sit amet lorem a felis cursus venenatis. Aliquam id lorem lorem, quis lacinia lorem. Cras vel ligula vitae tellus semper fermentum. Pellentesque sit amet laoreet enim. Nam suscipit hendrerit nibh, id dictum nunc consectetur bibendum. Mauris eget arcu vitae mauris consectetur porttitor. Praesent urna tortor, pulvinar non auctor eu, aliquet in nibh. Vestibulum ac augue dui. In elit massa, imperdiet faucibus rhoncus ac, sodales sit amet enim. Nulla facilisi. Nunc accumsan viverra accumsan. Fusce id diam scelerisque purus luctus lobortis.

Nullam quis lorem vitae ipsum dapibus ultrices eget a felis. Nunc ut nulla quis sapien interdum ultricies. Aliquam malesuada libero ac diam fringilla rhoncus. Nunc pulvinar luctus libero nec convallis. Suspendisse ac quam orci, et iaculis risus. Aenean id nisi elit. Praesent viverra dui eget purus pharetra in tincidunt felis molestie. Praesent bibendum, nibh et placerat vulputate, enim nunc bibendum ipsum, a scelerisque ipsum lectus vitae felis. Aenean ullamcorper hendrerit hendrerit. Vivamus a sapien neque. Suspendisse nisl purus, tincidunt pharetra dictum id, elementum et dui. Mauris molestie elit eget tortor volutpat sed iaculis quam eleifend. Suspendisse potenti.

Aenean non libero quis massa congue molestie. Praesent elementum magna a mauris fringilla posuere. Vestibulum eget dolor eget turpis laoreet vehicula a eu tortor. In hac habitasse platea dictumst. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Etiam magna diam, pretium in elementum et, dignissim at justo. Integer eu justo ut elit gravida faucibus. Phasellus nibh enim, dignissim ut aliquam sit amet, mollis eu nisi.

Ut a congue eros. Nunc convallis neque sit amet eros congue id consectetur neque sagittis. Aliquam tempor mi non urna fringilla fringilla. Aenean sagittis nulla vel nisi sollicitudin sed porta eros euismod. Nunc non neque sed ipsum dignissim rhoncus vitae nec urna. Mauris ac leo vitae lacus tempor dictum. Cras interdum, urna eu varius molestie, felis eros sagittis metus, quis eleifend augue mi in erat.

Praesent feugiat metus eget nisl molestie commodo. Quisque blandit congue justo sed malesuada. Donec sit amet diam augue. Suspendisse vehicula nulla ac augue iaculis varius lobortis justo sagittis. Nulla eleifend, lacus viverra volutpat auctor, turpis ipsum euismod nibh, eu ultricies odio nisl at magna. Donec sit amet sem augue. Pellentesque et felis consectetur elit faucibus consectetur. Phasellus non erat nunc. Vivamus placerat, ipsum id tristique ornare, massa orci dignissim nibh, posuere eleifend leo dui quis nisl.

Mauris et nibh eget magna imperdiet dictum. Aenean imperdiet accumsan sodales. Mauris pretium, lacus non ornare tincidunt, risus nulla porttitor ipsum, id accumsan dui odio ac ipsum. Proin ultricies ante eu libero interdum fringilla. In hac habitasse platea dictumst. Nunc rutrum, nisi in bibendum tincidunt, ipsum mauris elementum justo, sit amet bibendum ipsum nisi eu orci. Sed sodales blandit ante id viverra. Suspendisse justo nisl, mattis nec fermentum quis, tincidunt sed arcu. Duis condimentum pharetra mi, a bibendum tellus auctor ac. Vestibulum commodo mi ut mi accumsan ut mollis dui congue. Fusce cursus fermentum justo, a interdum nisl mattis vitae. Aliquam feugiat elementum orci, non posuere ipsum aliquam eu.

Sed sodales congue sem eleifend ullamcorper. Nulla facilisis pellentesque dignissim. Nunc turpis velit, tincidunt ac laoreet a, ultrices ut enim. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Sed sodales, nulla a mattis ornare, neque ante imperdiet eros, accumsan ornare lacus risus ac ante. Duis fringilla dolor sed metus ultricies euismod. Morbi dignissim mi ultrices massa pharetra eget ultricies dolor eleifend. In hac habitasse platea dictumst. Curabitur varius nunc quis eros molestie id ornare sem lobortis. Proin auctor dapibus tincidunt. Duis vel orci in odio lobortis imperdiet. Aenean pharetra posuere fringilla.

Nunc congue, turpis ac bibendum dignissim, libero tortor pellentesque lorem, placerat accumsan erat sem non mi. Morbi sed turpis nisl. Suspendisse odio dui, auctor quis pretium ac, laoreet nec risus. Fusce a turpis eros. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Vivamus et purus quis mi malesuada rhoncus non at quam. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos.

Etiam sagittis congue vehicula. Morbi non lectus lacus. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Sed diam diam, gravida suscipit vestibulum vitae, iaculis in enim. Nam eros libero, convallis vitae volutpat ac, ultricies ut diam. Nulla nulla neque, laoreet tincidunt vestibulum a, sagittis ut dui. Morbi venenatis porttitor interdum. Nunc egestas tempus urna. Etiam accumsan lacus id arcu mollis mollis. Pellentesque auctor ullamcorper purus nec bibendum.

Vestibulum hendrerit aliquam molestie. Aenean mattis vehicula sollicitudin. Vivamus sem tortor, dictum eget laoreet eu, hendrerit at quam. Proin accumsan, justo sed laoreet rhoncus, nunc libero blandit nunc, vitae feugiat odio nunc eu nulla. Nam id nulla velit. Duis a auctor arcu. Donec lobortis turpis at sapien cursus vulputate eu non metus. Ut feugiat mi velit."

Copy/pasted in EXACTLY that format from http://www.lipsum.com/ (20 paragraphs starting with "Lorem ipsum dolor sit amet...")

I've then saved the document (i.e. exited the region), re-entered it, entered HTML edit mode and clicked "Save and Replace" without doing anything to the text at all.

Mercury then drops spaces between "quis" and "sodales" and "sodales" and "." and "Aliquam" in lines 2/3, and between "Pellentesque" and "et" in ll. 7/8 and several others.

When I then repeat the sequence again (on the altered text), Mercury further drops several spaces between lines 1 and 8, e.g. in 3 ("Aliquamerat", "volutpat") or 5/6 ("Nunc", "portittor").

It looks random, but I think it may have something to do with the end of a line in HTML mode. I may be wrong on this, but the dropped spaces were always on the end of lines!

Edit: I just noticed; the editor will add a space when sub- or superscripting, between the regular text and the sub/superscripted text. This can't be removed, as it will appear again after exiting the editable area. Specs are the same as above (should I create a separate issue for this?)

salicyl commented Jun 12, 2012

Any news?

Owner

jejacks0n commented Jun 12, 2012

Trying to resolve it now.. unable to reproduce os x lion (chrome 19.0.1084.56).. also booted up my windows 7 vm (chrome 19.0.1084.56 m) and wasn't able to reproduce it there either . I'll leave the issue open for another few weeks, and hope that you can use your programmer chops and figure out why you're seeing this.

If anybody else is seeing this please chime in -- otherwise I have to assume it's something to do with your stylesheet or encoding or something? Sorry. :-/

This is happening to me also New lines are dropped in htmlEditor. I have gem version '0.8.0'.

It happens on latest Chrome and Firefox. It appears that htmlEditor is replacing newlines with empty space upon submitting "Save and Replace'. See line 11 mercury / app / assets / javascripts / mercury / modals / htmleditor.js.coffee. This makes html code unreadable by removing all newlines.

There may be a reason for removing newlines in 'full' regions but not sure what it is. Maybe for 'simple' or other areas. It should happen to everyone right out of the box unless I am mistaken.

The question is can this be handled in mercury.js by setting some config parameter to not remove newlines in 'full' regions?

@Mercury.modalHandlers.htmlEditor = ->

fill the text area with the content

content = Mercury.region.content(null, true, false)
@element.find('textarea').val(content)

replace the contents on form submit

@element.find('form').on 'submit', (event) =>
event.preventDefault()
------> value = @element.find('textarea').val().replace(/\n/g, '')-
Mercury.trigger('action', {action: 'replaceHTML', value: value})
@hide()

cjastram commented Aug 6, 2012

YES! This is a terrible problem for me. I am supporting non-technical users, and technical users (who want to go into the source view). The technical users go nuts because the newlines are all wiped whenever they save, and if the newline is important, it goes away! It makes the HTML editor nearly unusable.

It's wildly easy to duplicate: Wrap a word in <span> tags, and put a newline directly after the closing tag, like this.

<p>Alice was beginning to get very <span>tired</span>
of sitting by her sister on the bank...</p>

When you click save, you get this:

Alice was beginning to get very tiredof sitting by her sister on the bank...

Why is the newline stripped? For certain types of content, you need to keep newlines. Generally, unless there is some wildly necessary reason for the newline to be stripped, can it be left in place? Or at least controlled via a setting?

I have removed that .replace() call, and it seems to fix the html editor so it works, and I have experienced no problems with anything else as a result of this change. However, I am reluctant to push this fix into the code stream without knowing why it was there to start with.

Owner

jejacks0n commented Aug 6, 2012

just added a change.. try it out.. you can just modify the line that does that in your own file.. let me know if that works.

@jejacks0n jejacks0n closed this in 09fe628 Aug 6, 2012

cjastram commented Aug 6, 2012

Yup! This looks like it fixes my problem, not sure about salicyl, but it should fix their problem as well.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment