Support login forms in Shadow DOM

[Bruceforce]

I tried to use keepassxc browser extension for my home assistant login, but it can't detect the login fields. Neither automatically nor with "custom login fields" option. I think this is because of the polymer login fields using shadow dom like described in https://github.com/home-assistant/home-assistant-polymer/issues/1622.

Expected Behavior

Browser extension should detect login fields automatically

Current Behavior

Browser extension does not detect login fields and login fields and "custom login fields" is also not working

Steps to Reproduce (for bugs)

• Spin up a docker container with home assistant and try to login or
• Use this example page http://youssef06.github.io/polymer-login-form/demo.html (should be the same issue I think)

Debug info

KeePassXC - Version 2.4.0 Revision: c51752d KeePassXC-Browser Version: 1.3.2 Browser: Chrome

Libraries:

• Qt 5.12.1
• libgcrypt 1.8.4

Operating system: Windows 10 (10.0) CPU architecture: x86_64 Kernel: winnt 10.0.17134

Enabled extensions:

• Auto-Type
• Browser Integration
• SSH Agent
• KeeShare (signed and unsigned sharing)
• YubiKey

[varjolintu]

1.7.0 will have a support for dynamically added input fields in the Shadow DOM.

[teras]

Guys I have the same problem. Any hints how to solve it? I do have the 1.7.8.1 of the plugin, but this doesn't solve my issues. Should I do something specifically?

[varjolintu]

@teras As said above, it's only partially supported.

[teras]

Thank you @varjolintu

[philpagel]

Another homeassistant user here. Would be great if this worked.

[varjolintu]

https://github.com/home-assistant/frontend/issues/3133 According to this Home Assistant has fixed the issue.

[yktoo]

Is there any progress on supporting elements under a shadow root?

I'm trying to convert Comentario comment threads into a web component, but KeepassXC fails to find any field under the shadow root, it wouldn't even highlight them when I click on "Choose custom login fields".

And that seems to be an issue serious enough to stop that transition.

[varjolintu]

Is there any progress on supporting elements under a shadow root?

I'm trying to convert Comentario comment threads into a web component, but KeepassXC fails to find any field under the shadow root, it wouldn't even highlight them when I click on "Choose custom login fields".

And that seems to be an issue serious enough to stop that transition.

The best thing I can do is to enable the fields when using the Custom Login Fields. If Shadow DOM elements are not instantly identified, the only way to recognize them is the parse all elements in the page (which of course change all the time..) and check if there's Shadow DOM present. That's too time consuming for normal browsing.

When making pages, if there's no reason to put input fields under Shadow DOM.. don't.

[yktoo]

The best thing I can do is to enable the fields when using the Custom Login Fields.

Well that'll be useful anyway I believe.

I agree that monitoring the DOM and all shadow roots in it might be too heavy on the browser, but can't keepassxc make a full scan once when "Redetect login fields" button is clicked? I could live with that.

On a side note, I believe we're entering the era of web components so we'll see websites using them more and more often. And they often come with a shadow root. So one way or another, this problem will need a solution sooner or later.

[varjolintu]

I agree that monitoring the DOM and all shadow roots in it might be too heavy on the browser, but can't keepassxc make a full scan once when "Redetect login fields" button is clicked? I could live with that.

This could be included to the fix. It's a manual trigger after all.