0

In the Google Chrome browser, I have installed the 'Roboform' extension. This extension creates some UI elements as shown in the below screenshot. See the popup (Localhost) near login username input.

enter image description here

Question: Is there a way to detect 'Roboform' created UI elements with JavaScript?

What I have tried

  • I tried to use dev tools to inspect the popup element. But I could not see/inspect.
  • I also tried to detect the extension using other methods. But could not get it to work.
Praveen Dias
  • 69
  • 8
  • If it's a DOM element, it can be inspected in devtools. If you installed a separate external utility then it's outside of the browser and you can't inspect it. – wOxxOm Sep 21 '22 at 20:11
  • @wOxxOm I installed an extension called 'Robofont' from the Chrome Web Store. I can't inspect its popup element with devtools. Therefore, it should be taken as a separate external utility (cannot use JavaScript to detect it). – Praveen Dias Sep 22 '22 at 01:26
  • What *exactly* do you hope to accomplish by detecting the presence of these UI elements? – esqew Sep 22 '22 at 01:28
  • @esqew If those UI elements are present, and that information can be sent with the sign-in form submission, then it will help to identify real users from spam. – Praveen Dias Sep 22 '22 at 02:00

1 Answers1

1

Steps

  1. Ctrl+Shift+I Or RightClick->Inspect to open dev tools
  2. Ctrl+Shift+C Or Click on the Selection Tool

enter image description here

  1. Select the UI component you want with the selection tool.
  2. You can see it is under a closed #shadow-root 'div.overlay-content-mini'

enter image description here

If you want to know more about Shadow DOM, read the following article.

What the Heck is Shadow DOM?

Note: Closed shadow roots are not very useful. Some developers will see closed mode as an artificial security feature. Read more here.

enter image description here

Kamal Surendra
  • 38
  • 6