Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Squire] Editor behaves strangely #1389

Closed
hampoelz opened this issue Jan 14, 2024 · 18 comments
Closed

[Squire] Editor behaves strangely #1389

hampoelz opened this issue Jan 14, 2024 · 18 comments
Labels
bug Something isn't working

Comments

@hampoelz
Copy link

hampoelz commented Jan 14, 2024

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.

@sm-boogie
Copy link

sm-boogie commented Jan 24, 2024

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

@codiflow
Copy link

codiflow commented Feb 14, 2024

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:

Peek.2024-02-14.13-10.mp4
Peek.2024-02-14.13-17.mp4

@phsc84
Copy link

phsc84 commented Feb 26, 2024

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:
9eb5646
809fca7

@the-djmaze the-djmaze added the bug Something isn't working label Mar 1, 2024
@the-djmaze the-djmaze changed the title Editor behaves strangely [Squire] Editor behaves strangely Mar 18, 2024
@phsc84
Copy link

phsc84 commented Apr 17, 2024

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
Copy link

phsc84 commented Jun 27, 2024

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

@the-djmaze
Copy link
Owner

Any chance we get Quill as an alternative?

I will look into it

@koffienl
Copy link

koffienl commented Aug 4, 2024

The recent behavior of #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?

@BiglifeMatt
Copy link

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

@mohsensaeedi
Copy link

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?

@the-djmaze
Copy link
Owner

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

@codiflow
Copy link

codiflow commented Oct 2, 2024

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?

@the-djmaze
Copy link
Owner

the-djmaze commented Oct 2, 2024

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 😄
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.

@codiflow
Copy link

codiflow commented Oct 2, 2024

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💪😎

@phsc84
Copy link

phsc84 commented Oct 15, 2024

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

@the-djmaze
Copy link
Owner

You can already test with v2.38.2

@phsc84
Copy link

phsc84 commented Oct 17, 2024

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
Copy link

phsc84 commented Nov 17, 2024

Tested it now for quite a while. Looks all good so far. So I guess this issue could be closed, if you agree.

@the-djmaze
Copy link
Owner

@phsc84 thanks for testing!

I will close this as no one else reports further issues.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug Something isn't working
Projects
None yet
Development

No branches or pull requests

8 participants