Allow creating hard line breaks on mobile devices

[susnux]

• Resolves: #2761
• Target version: master

Summary

This is a proposal to resolve #2761, let me know what you think about this solution.

This allows to create hard line breaks on mobile, currently a hard line break could only created using shift + enter, but most mobile keyboards do not support the shift modifier. So on mobile devices pressing the enter key will trigger a hard line break and pressing it again will convert it to a new paragraph.

On desktop devices the behavior is unchanged, but documentation on how to add hard line breaks is added.

[juliusknorr]

I'm generally fine with the approach, thanks for the proposal. To me it seems still way more common to use paragraph breaks, but that might also include a bit of my personal usage behaviour of text. Would love to get some more input from @nextcloud/text and @nextcloud/designers

[max-nextcloud]

I think this is a good fix for the issue in question. I like it because it makes the hard breaks easy to discover. On the other hand it might make the paragraph breaks harder to discover / maybe people think they are just empty lines.

From my point of view the situation is kind of difficult to handle because a lot of people still think of an text editor like a drawing program... they type text and apply styling to it. Enter moves the text below down, spaces move it to the right, headings increase the font size etc. The more useful mental model is a semantic one (headings, paragraphs, hard breaks).

What i like about this fix is that it works for both mental models.

I don't like so much that it encourages hard breaks. I like to write markdown one sentence per line, or even one phrase per line. Since this relies on different rendering in editing and viewing mode it cannot be done in a meaningful way in a wysiwyg editor.

...and i just learned that github will render newlines as hard breaks in comments. :disappointed:

Anyway. I'm all for applying this fix. :+1:

[mejo-]

@jancborchardt and @nimishavijay what do you think about this topic?

[jancborchardt]

I replied in the original issue at https://github.com/nextcloud/text/issues/2761#issuecomment-1293862285

One thing I’d say specifically is that the experience should be the same on desktop and mobile when pressing enter, otherwise it’s highly confusing. :)

[cypress[bot]]

---

Test summary

106 • 3 • 0 • 0 • 2

---

Run details

Project	Text
Status	Failed
Commit	d2348c3134
Started	Dec 7, 2022 7:06 AM
Ended	Dec 7, 2022 7:13 AM
Duration	06:20 💡
OS	Linux Ubuntu -
Browser	Electron 106

View run in Cypress Dashboard ➡️

---

Failures

	sections.spec.js		2
1	Content Sections > Heading anchors > Anchor exists
2	Content Sections > Heading anchors > Anchor scrolls into view
	MenuBar.spec.js		1
1	Test the rich text editor menu bar > word count > multiple words

---

Flakiness

	workspace.spec.js		1
1	Workspace > formats text
	links.spec.js		1
1	test link marks > link preview > shows a link preview

---

This comment has been generated by cypress-bot as a result of this project's GitHub integration settings. You can manage this integration in this project's settings in the Cypress Dashboard

[susnux]

@jancborchardt I pushed a commit to unify the user experience on mobile and desktop. So you will have to press enter once for a hard line break "newline" and twice for a new paragraph.

I think this way is cleaner than the other way round, as then the cursor would jump up again.

We might want to think of a keyboard short cut for "new paragraph" on desktop (using shift+enter is not an option as this would confuse anyone I think.)

So this would also solve #2809

[susnux]

/compile

[susnux]

/compile amend

[max-nextcloud]

/compile

[max-nextcloud]

Hey @susnux Thanks a lot for tackling this and following up on it. I'm sorry for the bad news above and curious to hear if you can reproduce it. I can also try and write a cypress test for it if that helps.

Here's what the funny state of the heading looks like for me:

I noticed this does not happen if i start with a file with two paragraphs that was created previously. So my suspicion is that after pressing enter twice the document somehow differs from what it did in the past after pressing enter once.

[susnux]

I can reproduce this, there is a hardbreak within the heading (which is by the way not allowed following the commonmark rules).

But I noticed also some other usability issues, which make me think @juliushaertl was right about making paragraph breaks the default. Because after some testing I noticed you mostly need paragraph breaks. It is quite annoying to always have to press enter twice while typing markdown E.g. headlines:

• type test
• press enter once
• type # head
• --> does not work

By the way I discovered an other, unrelated, bug with newlines inside headings, I will file an issue.

[max-nextcloud]

I can reproduce this, there is a hardbreak within the heading

Yes. I think the hardbreak is already there before creating the heading and then the entire paragraph is converted so the heading also contains a hardbreak.

[max-nextcloud]

But I noticed also some other usability issues, which make me think @juliushaertl was right about making paragraph breaks the default. Because after some testing I noticed you mostly need paragraph breaks. It is quite annoying to always have to press enter twice while typing markdown E.g. headlines:

• type test
• press enter once
• type # head
• --> does not work

So what could we do to still enable hard breaks on mobile? Ideas that come to my mind:

1. have a button for inserting them in the menubar
2. have a button in a floating menu or line menu
3. make enter and then backspace result in a hard break (like with lists)

I think i like the 3rd one best - not sure if it's realistic though. What do you think?

[max-nextcloud]

#3568 superseeded this pr.