Password visibility toggle doesn't work correctly in My account > Account details page

[haszari]

Describe the bug
Originally reported by @slavicd in Storefront repository: woocommerce/storefront#1290

In the Account details page, the password visibility toggle button (the "eye" icon) only toggles on the first click (to reveal the password). Subsequent clicks don't work - the password cannot be unseen. Note this doesn't affect the login page password field.

To Reproduce

• Visit My account > Account details page /my-account/edit-account/.
• Type in the New password field.
• Click the password visibility toggle icon to show the password.
• Click again to re-hide the password.

Reproduced on Storefront and Twenty Nineteen themes.

Screenshots

Expected behavior
Can easily toggle visibility of passwords in all password fields :)

Isolating the problem (mark completed items with an [x]):

• I have deactivated other plugins and confirmed this bug occurs when only WooCommerce plugin is active.
• This bug happens with a default WordPress theme active, or Storefront.
• I can reproduce this bug consistently using the steps above.

WordPress Environment

``` ### WordPress Environment ###

WordPress address (URL): http://localhost:8222
Site address (URL): http://localhost:8222
WC Version: 4.1.0
REST API Version: ✔ 1.0.7
WC Blocks Version: ✔ 2.6.0-dev
Action Scheduler Version: ✔ 3.1.4
WC Admin Version: ✔ 1.0.3
Log Directory Writable: ❌ To allow logging
make /var/www/html/wp-content/uploads/wc-logs/ writable or define a custom WC_LOG_DIR.

WP Version: 5.3.2
WP Multisite: –
WP Memory Limit: 256 MB
WP Debug Mode: –
WP Cron: ✔
Language: en_US
External object cache: –

Server Environment

Server Info: Apache/2.4.38 (Debian)
PHP Version: 7.3.14
PHP Post Max Size: 8 MB
PHP Time Limit: 30
PHP Max Input Vars: 1000
cURL Version: 7.64.0
OpenSSL/1.1.1d

SUHOSIN Installed: –
MySQL Version: 5.7.29
Max Upload Size: 2 MB
Default Timezone is UTC: ✔
fsockopen/cURL: ✔
SoapClient: ❌ Your server does not have the SoapClient class enabled - some gateway plugins which use SOAP may not work as expected.
DOMDocument: ✔
GZip: ✔
Multibyte String: ✔
Remote Post: ✔
Remote Get: ✔

Database

WC Database Version:
WC Database Prefix: wp_
Total Database Size: 3.54MB
Database Data Size: 2.10MB
Database Index Size: 1.44MB
wp_woocommerce_sessions: Data: 0.02MB + Index: 0.02MB + Engine InnoDB
wp_woocommerce_api_keys: Data: 0.02MB + Index: 0.03MB + Engine InnoDB
wp_woocommerce_attribute_taxonomies: Data: 0.02MB + Index: 0.02MB + Engine InnoDB
wp_woocommerce_downloadable_product_permissions: Data: 0.02MB + Index: 0.06MB + Engine InnoDB
wp_woocommerce_order_items: Data: 0.02MB + Index: 0.02MB + Engine InnoDB
wp_woocommerce_order_itemmeta: Data: 0.02MB + Index: 0.03MB + Engine InnoDB
wp_woocommerce_tax_rates: Data: 0.02MB + Index: 0.06MB + Engine InnoDB
wp_woocommerce_tax_rate_locations: Data: 0.02MB + Index: 0.03MB + Engine InnoDB
wp_woocommerce_shipping_zones: Data: 0.02MB + Index: 0.00MB + Engine InnoDB
wp_woocommerce_shipping_zone_locations: Data: 0.02MB + Index: 0.03MB + Engine InnoDB
wp_woocommerce_shipping_zone_methods: Data: 0.02MB + Index: 0.00MB + Engine InnoDB
wp_woocommerce_payment_tokens: Data: 0.02MB + Index: 0.02MB + Engine InnoDB
wp_woocommerce_payment_tokenmeta: Data: 0.02MB + Index: 0.03MB + Engine InnoDB
wp_woocommerce_log: Data: 0.02MB + Index: 0.02MB + Engine InnoDB
wp_actionscheduler_actions: Data: 0.02MB + Index: 0.11MB + Engine InnoDB
wp_actionscheduler_claims: Data: 0.02MB + Index: 0.02MB + Engine InnoDB
wp_actionscheduler_groups: Data: 0.02MB + Index: 0.02MB + Engine InnoDB
wp_actionscheduler_logs: Data: 0.02MB + Index: 0.03MB + Engine InnoDB
wp_commentmeta: Data: 0.02MB + Index: 0.03MB + Engine InnoDB
wp_comments: Data: 0.02MB + Index: 0.09MB + Engine InnoDB
wp_links: Data: 0.02MB + Index: 0.02MB + Engine InnoDB
wp_options: Data: 1.11MB + Index: 0.06MB + Engine InnoDB
wp_postmeta: Data: 0.13MB + Index: 0.06MB + Engine InnoDB
wp_posts: Data: 0.06MB + Index: 0.06MB + Engine InnoDB
wp_termmeta: Data: 0.02MB + Index: 0.03MB + Engine InnoDB
wp_terms: Data: 0.02MB + Index: 0.03MB + Engine InnoDB
wp_term_relationships: Data: 0.02MB + Index: 0.02MB + Engine InnoDB
wp_term_taxonomy: Data: 0.02MB + Index: 0.03MB + Engine InnoDB
wp_usermeta: Data: 0.02MB + Index: 0.03MB + Engine InnoDB
wp_users: Data: 0.02MB + Index: 0.05MB + Engine InnoDB
wp_wc_admin_notes: Data: 0.02MB + Index: 0.00MB + Engine InnoDB
wp_wc_admin_note_actions: Data: 0.02MB + Index: 0.02MB + Engine InnoDB
wp_wc_category_lookup: Data: 0.02MB + Index: 0.00MB + Engine InnoDB
wp_wc_customer_lookup: Data: 0.02MB + Index: 0.03MB + Engine InnoDB
wp_wc_download_log: Data: 0.02MB + Index: 0.03MB + Engine InnoDB
wp_wc_order_coupon_lookup: Data: 0.02MB + Index: 0.03MB + Engine InnoDB
wp_wc_order_product_lookup: Data: 0.02MB + Index: 0.06MB + Engine InnoDB
wp_wc_order_stats: Data: 0.02MB + Index: 0.05MB + Engine InnoDB
wp_wc_order_tax_lookup: Data: 0.02MB + Index: 0.03MB + Engine InnoDB
wp_wc_product_meta_lookup: Data: 0.02MB + Index: 0.09MB + Engine InnoDB
wp_wc_reserved_stock: Data: 0.02MB + Index: 0.00MB + Engine InnoDB
wp_wc_tax_rate_classes: Data: 0.02MB + Index: 0.02MB + Engine InnoDB
wp_wc_webhooks: Data: 0.02MB + Index: 0.02MB + Engine InnoDB

Post Type Counts

attachment: 25
customize_changeset: 1
page: 9
post: 2
product: 19
product_variation: 7
revision: 11
shop_coupon: 2

Security

Secure connection (HTTPS): ❌
Your store is not using HTTPS. Learn more about HTTPS and SSL Certificates.
Hide errors from visitors: ✔

Active Plugins (2)

WooCommerce Blocks: by Automattic – 2.6.0-dev – Not tested with the active version of WooCommerce
WooCommerce: by Automattic – 4.1.0-dev

Inactive Plugins (2)

Akismet Anti-Spam: by Automattic – 4.1.3
Hello Dolly: by Matt Mullenweg – 1.7.2

Settings

API Enabled: –
Force SSL: –
Currency: GBP (£)
Currency Position: left
Thousand Separator: ,
Decimal Separator: .
Number of Decimals: 2
Taxonomies: Product Types: external (external)
grouped (grouped)
simple (simple)
variable (variable)

Taxonomies: Product Visibility: exclude-from-catalog (exclude-from-catalog)
exclude-from-search (exclude-from-search)
featured (featured)
outofstock (outofstock)
rated-1 (rated-1)
rated-2 (rated-2)
rated-3 (rated-3)
rated-4 (rated-4)
rated-5 (rated-5)

Connected to WooCommerce.com: –

WC Pages

Shop base: #5 - /shop/
Cart: ❌ Page does not contain the shortcode.
Checkout: #7 - /checkout/
My account: #8 - /my-account/
Terms and conditions: ❌ Page not set

Theme

Name: Twenty Nineteen
Version: 1.4
Author URL: https://wordpress.org/
Child Theme: ❌ – If you are modifying WooCommerce on a parent theme that you did not build personally we recommend using a child theme. See: How to create a child theme
WooCommerce Support: ✔

Templates

Overrides: –

Action Scheduler

Canceled: 1
Oldest: 2020-03-19 21:46:23 +0000
Newest: 2020-03-19 21:46:23 +0000

Complete: 3
Oldest: 2020-03-19 21:46:24 +0000
Newest: 2020-03-23 22:52:14 +0000

Pending: 1
Oldest: 2020-03-24 22:52:14 +0000
Newest: 2020-03-24 22:52:14 +0000

</details>

[dphyled]

Similar issue for the Password Reset fields:
#25624

PR added on Feb 11th

[juliaamosova]

Hi @haszari,

Thank you for reporting the issue. It is indeed had been reported previously here #25624 (with PR pending author's feedback). We are closing your issue in favor of the previously submitted. Please continue sharing your feedback there if needed.

[haszari]

@juliaamosova Just to be clear - there are two places this issue occurs, the lost/reset password flow and the my account page (change password flow).

I'll add a comment to #25627 to ensure both flows are tested – hopefully the PR covers both cases :)

[juliaamosova]

Noted, thanks a lot @haszari!