apostrophecms / apostrophecms/apostrophe
UX bug: Cursor jumps around when editing Slug field
- Dominant language
- JavaScript
- Stars
- 4.6k
- Forks
- 650
- Avg merge
- 19h 21m
- Merged PRs (30d)
- 23
Description
## To Reproduce
1. Click into Pages and edit a page
2. On Basics pane, edit the Slug field
3. Enter a slug with 3 or more words separated by hyphens (ie "my-great-field")
4. Use delete key to remove the middle word ("great") from the slug
5. When the word is removed, cursor jumps to the end of the slug field.
## Expected behavior
When editing a parameter in a text field, I would expect the text cursor to stay in the same position no matter what edit was made.
## Describe the bug
I first noticed this when editing a Form, but it also applies to editing Pages, Users, and any area that uses the Slug field.
Text cursor jumps to the end of the slug value when editing the Slug field. This only appears to happen when 3 or more words, separated by hyphens, are in the slug value and a user edits the slug.
If the slug is "my-great-field" and I remove "great" from the value, we're left with "my-field" and the text cursor jumps to the end of the line instead of remaining in position.
## Details
**Version of Node.js:**
17.7.2
**Server Operating System:**
Arch Linux x64, kernel 5.16.14
**Additional context:**
Using Google Chrome on desktop
Contributor guide
Research direction
Reproduce the issue in the Pages editor's Basics pane using Chrome, then trace the shared Slug field used by Pages, Forms, and Users. Confirm the behavior with a slug such as "my-great-field" and verify that deleting the middle word leaves the cursor in its editing position rather than moving it to the end.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- javascript, node.js
- Domain
- frontend
- Issue type
- Bug
- Difficulty
- 3/5
- Estimated time
- 1-2 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 35/100