[5.x]: Routes Overlay: input field not working properly after adding a token

[olsp]

What happened?

Description

When adding/editing a route via the CP it's difficult to add text after adding a token. One needs to click right next to the token for being able to add text after it. Otherwise the caret is positioned at the start.

Steps to reproduce

1. Click on "Add route"
2. Add a token
3. try to focus the input field again by clicking in the right part of it (not close to the token)

Expected behavior

The input field should be focusable no matter where you click inside the field

Actual behavior

The caret moves to the very left of the input field. If you want to set it after the tag, you need to click next to the tag, not more than some pixels right of it.

Here is a video of it:
https://github.com/craftcms/cms/assets/1073442/0c6a1ee9-7b8a-4cec-aae7-0a393818456c

Craft CMS version

5.0.5

PHP version

No response

Operating system and version

No response

Database type and version

No response

Image driver and version

No response

Installed plugins and versions

[brandonkelly]

Thanks for pointing that out!

Just made a few improvements for Craft 4.9 and 5.1:

• Clicking anywhere to the right of the text will move the focus to the end of the text
• Pressing Ctrl/Command + ←/→ anywhere within the URI input will move focus all the way to the beginning/end of the input. (Previously it would only move to the beginning/end of the selected text node, or default to the browser’s Back/Forward navigation if a token was selected.)
• Fixed a focus bug that could occur when the modal was first opened.

[brandonkelly]

Craft 4.9 and 5.1 are out now with those changes.