beacon_live_admin
beacon_live_admin copied to clipboard
Visual Editor: disable interacting with iframes
Issue #196: Embedded video elements should display attrs when selected
Description
Embedded video elements couldn't be selected, because the iframe that is being used to render this embedded content is catching all cursor events. This will apply to basically any embedded content, and for a lot of reasons we don't want the user to interact with the iframe while in visual editing mode. Although being able to test a video to check whether it's the right one, we decided it might be best to disable any interaction because we never know what content is being rendered in the embedded element.
Changes
Disable interacting with iframes, so selection for the element is being captured
Testing
Make sure your app has a component which embed external content, like a YouTube video.
- Go to edit a page (and if it doesn't already have one, add the embedded component/section)
- Verify: you are able to selected the embedded element by clicking
- Verify: the embedded element is selected and shows the expected selection state
- Verify: you're not able to interact with the embedded content, like start playing the video
Screenshots
Before | After |
---|---|
It either plays/stops the video or opens it. Not being able to select the element. | Cannot interact with the embedded content. Element can be selected |