Tel: link are being removed [Actually, selecting an existing hyperlink doesn't always work right if mouseup ends outside the text field - edited title]

🆘 Support
1

Describe the issue:

  • Please include any relevant error messages, screenshots, and troubleshooting you’ve already tried.
  • If this has to do with your website, what framework and version are you using (Next.js, Astro, Svelte, etc.)?

There is an issue when using a tel: link, it get removed when saving the record

(Recommended) What’s the URL of the record or model in question?

  • Being able to see the issue in your real project is you for very helpful for troubleshooting. If you don’t provide the URL upfront, we’ll often have to ask you for it anyway, which just slows down our response time for you.
  • If you’re concerned about privacy, you can email us at support@datocms.com instead of posting here.

https://met-7818.admin.datocms.com/editor/item_types/Wl7EYgn1Rw2_vna7RD5Pjw/items/Vey_f5z-S0ayEKkLq_Cdbw/edit

(Optional) Do you have any sample code you can provide?

I’ve made a video so you can see the issue more easily:

2

Hi @dev4,

Hmm, this seems to be a bug with our default HTML editor. Sorry about that! I’ll report it to the devs and let you know once it’s fixed.

3

Hi @dev4,

Actually, this seems to be an issue with the text selection, rather than the URI itself. Could you please just click on the hyperlink, like this, instead of selecting it with a drag?

That should let you reliably edit the link every time.

[EDIT: This was incorrect. See following post instead.]

The underlying issue wasn’t that there was anything wrong with the hyperlink, but that you encountered an edge state when you…

Clicked elsewhere in the text field. Quickly (within a second or so) selected the text. The debouncing system didn’t realize that you were selecting something that was already a link, so when you click the link button, it’s adding a new one instead of editing the existing one

I’ll let the devs know about that issue, separately. But if you just click on the hyperlink, it will hopefully work for you every time.

4

Lol, it’s actually even stranger than that… it’s not a timing issue either, but apparently a matter of where you mouseup.

If you start selecting the hyperlink but then move the cursor out of the textbox, the “existing hyperlink” detection doesn’t work right.

You might’ve found the corner-iest of corner cases :slight_smile: I’ll let the devs know!

5

lol, thanks to my impatience by clicking fast everywhere x’)

Good luck to your devs

8

We have a preliminary fix for this under review now. I’ll let you know once it passes code review and gets deployed.

The underlying issue is that the toolbar buttons (like the hyperlink) weren’t getting properly notified on mouse leave events. So when you click quickly and the mouse leaves the textbox, the link button doesn’t know to check to see if your selection is already a hyperlink, and so assumes you’re creating a new one (which is why it looked like the existing one was gone… it was still there all along, but that button wasn’t seeing your selection properly and so assumed you were creating a new one).

If you click the hyperlink instead of dragging, you can avoid this issue for now. But it should be fixed soon.

Thanks again for the report!

9

Thanks for the quick reply and the clear breakdown of the issue, always interesting to learn what’s happening under the hood

1 Like