snappymail icon indicating copy to clipboard operation
snappymail copied to clipboard

[Squire] Editor behaves strangely

Open hampoelz opened this issue 1 year ago • 12 comments

I had to write a lot of emails recently and noticed some strange behaviors in the editor:

  • If I write in plain mode and then switch to HTML mode, an additional empty line is inserted after each line
  • If I save a mail written in plain mode as a draft and then open it again, the writing mode changes to HTML
  • Sometimes the undo (CTRL + Z) undoes a lot more than it should, but interestingly, the redo (CTRL + Y) allows me to go back to the stage I wanted with just one undo.
  • The font size and family behaves very strangely with pasted text (or text with different formats)

As an example, I have copied together the following simple text. No font size is displayed in the first line. In the second line, the font size is 16px. In the third line, the font size is also 16px, although the text is significantly smaller than in the second line. It makes no difference whether I just click in the text or whether I select it.

Screenshot from 2024-01-14 10-55-33 Screenshot from 2024-01-14 11-03-42 Screenshot from 2024-01-14 10-55-53

The source code for this text looks like this:

<div><span style="font-family: var(--font-face); font-size: var(--nc-default-font-size);">Test.</span><br></div><div><br></div><div><span style="font-family: var(--font-face); font-size: 13px;"><span style="font-size: 16px;">Test2.</span></span><br></div><div><br></div><div>Test3.<br></div><div><br></div>

Furthermore, if a text has different fonts / font sizes and I select the whole text, only the one that was selected first is shown in the selector. In this case, however, the selector should be empty so that you know that the whole text does not have the same font or font size.

Environment:

  • Browser: Chrome 120
  • SnappyMail Version: 2.32.0
  • Mode: Nextcloud 28.0.1

I also experienced the same problems on the snappymail demo page.

hampoelz avatar Jan 14 '24 10:01 hampoelz

I can confirm the insertion of extra new lines when opening a draft message for editing in plain text mode (set as default here). Prior to opening it, the message looks fine (correct amount of new lines) in the SnappyMail preview. Also it doesn't matter whether I have previously edited said message with SnappyMail or any other client.

Browser: Firefox 115.6.0 SnappyMail 2.33.0

sm-boogie avatar Jan 24 '24 17:01 sm-boogie

I can also confirm this strange behaviour but did not have time to look into this more in detail.

At least I noticed that for EVERY pasted text there is a new line inserted before and after the text – no matter if the copied text was HTML, plain text or whatever. I found my way to handle this but would really appreciate a fix here 😎

I recorded two videos showing some of the strange behaviour:

https://github.com/the-djmaze/snappymail/assets/43847817/a56535c3-7835-4c67-8d26-ee2e32cd758c

https://github.com/the-djmaze/snappymail/assets/43847817/b66407df-2ccf-4f1f-80ed-56684f25c283

codiflow avatar Feb 14 '24 12:02 codiflow

Is it already possible to switch from Squire to e.g. Quill? Maybe this would resolve these issues.

Just asking because I noticed the following commits: https://github.com/the-djmaze/snappymail/commit/9eb5646aeccc5c800535dcf39c522ac48f9f704f https://github.com/the-djmaze/snappymail/commit/809fca73a014449bc8aa7fe5fa00098242414345

phsc84 avatar Feb 26 '24 14:02 phsc84

Quill 2.0 has been released! https://slab.com/blog/announcing-quill-2-0/ https://github.com/quilljs/quill/releases/tag/v2.0.0

Are there any plans to replace Squire or at least offer Quill as an alternative? Would be happy to test! 😃

phsc84 avatar Apr 17 '24 14:04 phsc84

The behaviour of Squire is still a little bit annoying. Any chance we get Quill as an alternative?

phsc84 avatar Jun 27 '24 06:06 phsc84

Any chance we get Quill as an alternative?

I will look into it

the-djmaze avatar Jul 15 '24 12:07 the-djmaze

The recent behavior of https://github.com/the-djmaze/snappymail/issues/1666 is quite annoying, I see it is closed with a reference to this topic.

What is the current approach? Wait for the new editor or will there be a workaround to fix the linebreaks while waiting for the new editor?

koffienl avatar Aug 04 '24 10:08 koffienl

Yes, waiting for the fix. Is it being released soon or can we patch in the meantime?

BiglifeMatt avatar Aug 09 '24 16:08 BiglifeMatt

We have this problem for 2.38.0 and earlier version. first line have many problem and wrong behavior for many actions such alignment, direction, font and font size and ...

Any idea to fix this bug?

mohsensaeedi avatar Sep 29 '24 21:09 mohsensaeedi

I'm modifying Squire... https://github.com/the-djmaze/Squire/commits/snappymail/

the-djmaze avatar Oct 02 '24 18:10 the-djmaze

Great to hear that 🔥

Just a quick note: I noticed, that copy&pasting images directly into the editor does not work anymore since 2.38.0. Using the "Image button" in the menu bar still works and the image is pasted inline but the keyboard shortcut does not work anymore.

Maybe this has to do with the recent modifications?

codiflow avatar Oct 02 '24 20:10 codiflow

Maybe this has to do with the recent modifications?

It worked because i used a modified Squire. Yet people started submitting original Squire2 in plugins because they used the latest Squire2 version and "should" be better. So i threw away my modified Squire, forked Squire2 and now working in a branch to get most changes back, fix Squire2 issues and add improvements. This way i could merge commits from the main project into my fork.

The most annoying issue is the handling of <br>. Squire2 puts them everywhere! The <br> has an important purpose:

  1. Every empty block element (p, div, td, etc.) is NOT focus-able in Firefox
  2. Every empty block element (p, div, td, etc.) is focus-able in Chrome, but ONLY with a CSS hack that has no purpose outside SnappyMail (like Thunderbird, K9, Outlook, etc.) so also useless

By putting <br> inside the block element, it is focusable and editable :smile: But this is useless: <table><tr><td><BR></td><BR></tr><BR></table> as the BR is not valid in tr nor table, etc. etc. Same with converting <p>test<BR>test</p> into <p>test<div><BR></div>test</p> which is invalid HTML.

I will test the copy/paste, but maybe it is already solved in the demo as the demo has all current changes

And oh boy, the current changes make #962 blazing fast now, and renders it the correct way.

the-djmaze avatar Oct 02 '24 20:10 the-djmaze

Just tested it in the demo – copy&paste is currently not working there (I'm using Firefox).

Apart from that: Great work and thanks for the detailed explanation💪😎

codiflow avatar Oct 02 '24 22:10 codiflow

Can this already be tested with Snappymail 2.38.2 or are there still changes coming?

phsc84 avatar Oct 15 '24 19:10 phsc84

You can already test with v2.38.2

the-djmaze avatar Oct 15 '24 20:10 the-djmaze

I played around with 2.38.2. Looks much better now! Many thanks for the great work! Just one small glitch I encountered so far: #1815 Will continue testing...

phsc84 avatar Oct 17 '24 20:10 phsc84