bug(material/Form Field Suffix): In Form Field suffix password input field example an extra eye icon is displayed along with the existing masking icon

[ArvindWip]

Is this a regression?

• Yes, this behavior used to work in the previous version

The previous version in which this bug was not present was

No response

Description

This issue is seen in mat form field suffix password control example. When icon is masked and when we start typing in the password, we are seeing an extra eye icon before the masking icon.

Example link: https://material.angular.io/components/form-field/overview#form-field-prefix-suffix

Reproduction

Steps to reproduce:

1. Go the example https://material.angular.io/components/form-field/overview#form-field-prefix-suffix
2. Try typing the password without unmasking the icon an extra eye icon will be displayed. If not see try clicking outside the input field and type again.
   

Expected Behavior

It should not display that extra icon.

Actual Behavior

When typing in the password with icon masked an extra icon is displayed.

Environment

• Angular:
• CDK/Material:
• Browser(s):
• Operating System (e.g. Windows, macOS, Ubuntu):

[Raphyyy]

I am pretty sure this is caused by a browser extension you are using. Try with a Guest session or Incognito mode (without any browser extension)

[ArvindWip]

This issue happening in Chrome browser. I have not installed any browser extension. Extension cannot be installed it is restricted.

[Raphyyy]

Could also be an anti-virus used by your company who had some scripts to your webpages.
I'm pretty sure this has nothing to do with Angular

[ArvindWip]

Actually, I am seeing this issue even in my Personal laptop where I don't have any extension installed.

[mocolicious]

I see this issue on so many websites. Dapperlabs and Spectrum both have the double password eye. On apps Ive built I just removed the second icon so only the left one is there but the component definitely needs work.