1Password lock button covering text field

donnywdavis

I ran across a site that has some unexpected behavior with 1Password X. The site is with my bank, N26. When you try to make a transfer they ask for a four digit transfer code to confirm the transaction. This transfer code is displayed as four separate fields and is sized as small squares around 29px x 28px. The input type for these fields is password, which I figured is why the 1P lock button shows up. However, since the field is so small the button completely covers the entire field. I have to click around the button to bring focus to the field so that I can type my code in it. Not really sure what, if any, approach could be taken here since it's actually working as expected. Just wanted to mention it just in case. :)

Here's the text fields without using 1Password X:

Here's the fields with 1Password X:

---

1Password Version: 1Password X 1.0.3
Extension Version: Not Provided
OS Version: Not Provided
Sync Type: Not Provided

AGAlumB

@donnywdavis: Oh... Thanks for getting in touch! I knew this would come up. I just don't have any logins myself with sites like that. :(

Indeed, the problem here is that the fields are just so puny, so the 1Password icon takes up the whole field. It sounds like you're saying that this is not actually a login page, so maybe it's something we could exclude explicitly, or try to detect the field size and not put 1Password there if it is too small. Can you tell us the URL, or possibly send a sanitized copy of the webpage itself?

You've probably already thought of this, but I bet you could use Tab to enter the appropriate information into the form in the mean time. Sorry for the inconvenience there, but I'm sure we'll figure something out. :)

dteare

Thanks for the report, @donnywdavis. We try to avoid showing the 1Password icon on fields that are too narrow but it looks like our algorithm is failing for this particular site for some reason.

Could you share the URL of the site you're seeing this on? With any luck someone on our team will have an account there so we can debug this locally.

donnywdavis

@brenty @dteare Hey guys. Sorry about the late reply. Between a big project at work and a new baby I had completely forgotten to follow up here. :|

The site is N26, https://my.n26.com/. It's currently only available in Europe. But if somebody on the team does have an account the section where the issue is is on the Transfers section in the sidebar.

Here's a snippet for one of the input fields that contains the 1P button. Hopefully it has something that will help. If I need to grab more from the Chrome inspector just let me know. :)

<op-button data-op-target="8" data-state="active" style="
        margin-left: 14px;
        margin-top: 12px;
        "></op-button><input type="password" class="pinf p1" placeholder="#" maxlength="1" data-op-id="8">

dteare

Thanks for the update, @donnywdavis. And congratulations on the new baby! It's a wonderful time – be sure to take the time to enjoy it :)

I've posted an internal announcement to see if anyone on our team has a N26 account. If no one does, we'll need to take you up on your Chrome Inspector offer :)