nextcloud-libraries / nextcloud-libraries/nextcloud-vue
NcRichContenteditable: Unable to navigate to start/end of content containing NcMentionBubble on Firefox
Nobody has claimed this yet.
- Dominant language
- Vue
- Stars
- 246
- Forks
- 99
- Avg merge
- 1d 20h
- Merged PRs (30d)
- 103
Description
First reported in https://github.com/nextcloud/server/issues/35296 (which was itself a repost of https://github.com/nextcloud/server/pull/35187#pullrequestreview-1185707572), but after some testing, I believe this is more of a components issue rather than strictly a server issue (but you can correct me if I'm wrong).
Steps to reproduce
- Open https://nextcloud-vue-components.netlify.app/#/Components/NcRichContenteditable in Firefox.
- In either of the example boxes provided (doesn't matter which one), do the following steps:
Case 1
- Append a mention
@Test01after the example sentence. - Press Backspace to remove the space after the mention.
- Press Left to move the cursor to the left of the mention.
- Press Right.
Expected: the cursor should be directly to the right of the mention.
Actual: the cursor remains in place.
- In the other example box, click anywhere in the whitespace to the right to place the cursor at the end.
- Press Backspace to remove the space after the mention.
Expected: the cursor should be directly to the right of the mention.
Actual: the cursor disappears entirely.
The same also happens when you click in the whitespace again to try to place the cursor that way. This is the worst case as the mention can no longer be edited in this state (unless you undo with Ctrl-Z, but that's only if a previous state is available which may not always be the case).
Case 2
- Delete the example sentence and replace it with a mention
@Test01. - Press Backspace to remove the space after the mention.
- Press Left.
Expected: the cursor should be directly to the left of the mention.
Actual: the cursor remains in place.
- Click in the whitespace to the left of the mention.
Expected: the cursor should be directly to the left of the mention.
Actual: the cursor disappears entirely.
- In the other example box, click anywhere in the whitespace to the right to place the cursor at the end.
- Press Backspace to remove the space after the mention.
Expected: the cursor should be directly to the right of the mention.
Actual: the cursor disappears entirely, and the content is now un-editable (as above).
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Start with the NcRichContenteditable examples at the linked component demo and reproduce both mention-navigation cases in Firefox. Done means the cursor remains editable and moves directly to the left or right of NcMentionBubble after the described keyboard and whitespace interactions.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- javascript
- Domain
- frontend
- Issue type
- Bug
- Difficulty
- 3/5
- Estimated time
- 1-2 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 45/100