1631186 - Video tag does not get selected when using Element Picker

Status: NEW

(DevTools :: Inspector, defect, P3)

Description

[aditniru]

User Agent: Mozilla/5.0 (X11; Ubuntu; Linux x86_64; rv:75.0) Gecko/20100101 Firefox/75.0

Steps to reproduce:

1. Open the console (ctrl + shift + c)
2. attempt to select a video element in the page from the top left "pick an element" option

(tried in ubuntu 19.10, in firefox 75.0)

Actual results:

Nothing happened, no element was selected, the "pick an element" cannot find the video element, clicking on the element deselects all elements

Expected results:

the video element should've gotten selected

Comment 1

[Clara Guerrero ( Need Info Brindusa Tot Please)]

Hi,

Can you please attach a video demostrating what you mean on the bug description?

I was not able to reproduce on ubuntu 18.0 , I tried on the following versions:

Firefox Nightly version 77.0a1 (2020-04-22) (64-bit)
Beta 76.0b5 (64-bit)
Release 75.0 (64-bit)

I'm using this link https://www.w3schools.com/tags/tryit.asp?filename=tryhtml5_video

Same thing with videos from youtube.

Thanks for the report!
Best,

Clara

Comment 2

[aditniru]

Attachment: simplescreenrecorder-2020-04-22_20.20.00.mp4

this shows the "pick an element" not working for the browser

Comment 3

[aditniru]

this video shows the selection not working,

thanks for the help in advance!

Comment 4

[Clara Guerrero ( Need Info Brindusa Tot Please)]

Thanks for the video! I was able to replicate on ubuntu 18.0 and windows 10 pro, I tried on the following versions:

Firefox Nightly version 77.0a1 (2020-04-22) (64-bit)
Beta 76.0b5 (64-bit)
Release 75.0 (64-bit)

I've noticed chrome is working as expected, so I will move this over to a component so developers can take a look over it. If is not the correct component please feel free to change it to an appropriate one. (I've tried older versions and cannot find a FF with this working, was it working for you before any updates? Please let me know)

Thanks for the report.

Best regards, Clara.

Comment 5

[aditniru]

I don't remember if this ever worked with firefox, I'm sorry, I only noticed it very recently

Thanks for taking my report Clara

Best Regards + Stay safe, Aditya Shankar

Comment 6

[Razvan Caliman [:rcaliman]]

Hi,

Thanks for filing!

The Element Picker seems to go deep inside the shadow root of the <video> element. You can see this in the breadcrumbs bar of the Elements pane. It is picking the right element. But too precisely :)

What the user wants is the shadow host, the <video> element. Note, the right click + Inspect Element action does select the correct element. Only the Element Picker is piercing into the shadow root.

Steps to reproduce:

• Open https://www.w3schools.com/html/html5_video.asp
• Open DevTools
• Click the Element Picker icon in the top-left
• Click the on the playing video

Expected:
The <video> element is marked selected

Actual results:
The div#controlsSpacer element inside the video's shadow root is selected. See the breadcrumbs bar under the markup panel.

Comment 7

[Firefox Bug Husbandry Bot]

Because this bug's Severity has not been changed from the default since it was filed, and it's Priority is P3 (Backlog,) indicating it has been triaged, the bug's Severity is being updated to S3 (normal.)