Dragging the buttons will add URLs to the text editor

[microbit-carlos]

If the buttons are accidentally dragged to the editor, they will drop the link URL into the text, which can be confusing:

[ZanderBrown]

I successfully reproduced this in Firefox

From a web platform point of view this probably counts as 'expected behaviour' as the buttons are in fact <a href="#"> (related: Use button if you mean it)

Not sure much can be done with this but someone may have some JS insanity somewhere

[microbit-carlos]

I think it would be enough to add a draggable tag to the a element: https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/draggable

Good link btw, thanks! we probably won't be using buttons in this case due to the way the design has the round images and icons, but we must certainly make these more accessible and that article has some good tips.

[ZanderBrown]

That seems to work on plain links but not links containing an image

Perhaps draggable="false" has to be explicit on children as well?

[microbit-carlos]

Yeah, looks like in Chrome it's fine to add it to the parent a, but in firefox even if I add it to all the children I can still drag the image/icon. Might have to use something different: https://stackoverflow.com/questions/26356877/html5-draggable-false-not-working-in-firefox-browser