woocommerce / woocommerce-admin

(Deprecated) This plugin has been merged to woocommerce/woocommerce
https://woocommerce.github.io/woocommerce-admin/#/
Other
362 stars 144 forks source link

Browser's autofill in Country/Region field in the setup wizard isn't helpful #7617

Closed sanzeeb3 closed 3 years ago

sanzeeb3 commented 3 years ago

Prerequisites (mark completed items with an [x]):

Describe the bug There’s an annoying auto-fill by the browser in the Country/Region field in the setup wizard. The auto-fill isn’t correct and disturbing to move ahead with the setup.

Expected behavior Autocomplete in that field can be turned off.

Current behaviour Autocomplete for that field is off but I found that:

autocomplete still works on an despite having autocomplete=”off”, but you can change off to a random string, like nope.

so, <input autocomplete="nope" does fix the issue.

Steps to reproduce the bug (We need to be able to reproduce the bug in order to fix it.) Steps to reproduce the bug:

  1. Go to 'Setup Wizard'.
  2. Click on 'Country/Region' field.
  3. See the autocomplete in that field that isn't helpful.

Screenshots https://ibb.co/4Np8YrY

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

WordPress Environment

` ### WordPress Environment ### WordPress address (URL): http://dev.test Site address (URL): http://dev.test WC Version: 5.2.2 REST API Version: ✔ 5.2.2 WC Blocks Version: ✔ 4.7.2 Action Scheduler Version: ✔ 3.1.6 WC Admin Version: ✔ 2.1.5 Log Directory Writable: ✔ WP Version: 5.7.1 WP Multisite: – WP Memory Limit: 512 MB WP Debug Mode: ✔ WP Cron: ✔ Language: en_US External object cache: – ### Server Environment ### Server Info: Apache/2.4.35 (Win64) OpenSSL/1.1.1b PHP/7.2.19 PHP Version: 7.2.19 PHP Post Max Size: 2 GB PHP Time Limit: 36000 PHP Max Input Vars: 1000 cURL Version: 7.64.0 OpenSSL/1.1.1b SUHOSIN Installed: – MySQL Version: 5.7.24 Max Upload Size: 2 GB 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: 5.2.2 WC Database Prefix: wp_ Total Database Size: 7.55MB Database Data Size: 6.03MB Database Index Size: 1.52MB 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.08MB + Engine InnoDB wp_links: Data: 0.02MB + Index: 0.02MB + Engine InnoDB wp_options: Data: 5.05MB + Index: 0.06MB + Engine InnoDB wp_postmeta: Data: 0.02MB + Index: 0.03MB + Engine InnoDB wp_posts: Data: 0.02MB + 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 wp_wpforms_entries: Data: 0.02MB + Index: 0.02MB + Engine InnoDB wp_wpforms_entry_fields: Data: 0.02MB + Index: 0.05MB + Engine InnoDB wp_wpforms_entry_meta: Data: 0.02MB + Index: 0.02MB + Engine InnoDB wp_wpforms_logs: Data: 0.02MB + Index: 0.00MB + Engine InnoDB wp_wpforms_tasks_meta: Data: 0.02MB + Index: 0.00MB + Engine InnoDB wp_wpmailsmtp_emails_log: Data: 0.02MB + Index: 0.03MB + Engine InnoDB wp_wpmailsmtp_tasks_meta: Data: 0.02MB + Index: 0.00MB + Engine InnoDB ### Post Type Counts ### attachment: 1 page: 6 post: 2 revision: 2 wpforms: 1 ### Security ### Secure connection (HTTPS): ❌ Your store is not using HTTPS. Learn more about HTTPS and SSL Certificates. Hide errors from visitors: ✔ ### Active Plugins (5) ### File Upload Types: by WPForms – 1.2.1 WooCommerce: by Automattic – 5.2.2 WP Force SSL: by WebFactory Ltd – 1.57 WP Mail SMTP Pro: by WPForms – 2.7.0 WPForms: by WPForms – 1.6.6 ### Inactive Plugins (6) ### Akismet Anti-Spam: by Automattic – 4.1.9 AMP: by AMP Project Contributors – 2.0.11 Delete Me: by Clinton Caldwell – 3.0 Hello Dolly: by Matt Mullenweg – 1.7.2 WPForms Lite: by WPForms – 1.6.6 WP Mail SMTP: by WPForms – 2.7.0 ### 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: woocommerce/woocommerce#6 - /shop/ Cart: woocommerce/woocommerce#7 - /cart/ Checkout: woocommerce/woocommerce#8 - /checkout/ My account: woocommerce/woocommerce#9 - /my-account/ Terms and conditions: ❌ Page not set ### Theme ### Name: Twenty Twenty-One Version: 1.3 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 ### Complete: 18 Oldest: 2021-04-22 08:56:19 +0000 Newest: 2021-04-25 03:31:29 +0000 Pending: 7 Oldest: -0001-11-30 00:00:00 +0000 Newest: 2021-04-30 17:08:31 +0000 ### Status report information ### Generated at: 2021-04-25 03:32:10 +00:00 `
zhongruige commented 3 years ago

Hi @sanzeeb3,

Thank you for submitting the issue. However, I can’t reproduce it using the steps you provided. Everything is working as expected on my end.

I tested in both the latest Chrome and the latest Firefox (each without any plugins or extensions installed), using a fresh install of WooCommerce (5.2.2) and WordPress 5.7.1, both on macOS:

Chrome

Screen Shot 2021-04-26 at 2 36 59 PM

Firefox

Screen Shot 2021-04-26 at 2 37 50 PM

Please provide us with more details about the issue which may help us to evaluate it further.

For example, if you can let us know which which browser/OS was used in the screenshot that was provided in the initial report, that can help us further investigate. Thank you!

sanzeeb3 commented 3 years ago

I'm also using the latest Chrome and without any other plugins or extensions installed. Just to note, you'll need to click on the input and not on the Country/Region label, or simply double-click. Also, you probably don't have anything to autofill.

AashikP commented 3 years ago

Hello @sanzeeb3

I could not replicate the behavior as well

  1. When autocomplete is disabled in Chrome:

    https://d.pr/i/2HMuZo+

  2. When it is enabled:

    https://d.pr/i/I8hff4+

Browser:

https://d.pr/i/olczg6+

Am I missing any step there, or are there other steps to replicate the issue that we're missing?

sanzeeb3 commented 3 years ago

That's all the steps. Maybe you're missing that you need to click on the 'Country/Region' field when there is a text cursor not when there's a hand cursor. I just tested on a clean install with only WC active and incognito mode in Chrome and there's still the issue. If it's helpful, here's the screencast video: https://a.supportally.com/EvPQ2d. The auto-fill would be helpful if you can fill, it's only displaying the country, but it can't autofill with it.

AashikP commented 3 years ago

@sanzeeb3 Thanks again for the screen recording. Interestingly, I could replicate this behavior on a different test site:

https://d.pr/i/McT91v+

When the City and Zipcode fields were automatically filled, the country wasn't.

I'm wondering if this is because the field accepts entries in Country / State / Region format and the browser isn't able to recognize the way it is currently set up.

Also, this looks like it should belong in the WooCommerce Admin Repo.

It requires further feedback from the WooCommerce Core team. I am adding the needs developer feedback label to this issue so that the Core team could take a look.

Please note it may take a few days for them to get to this issue. Thank you for your patience.

vedanshujain commented 3 years ago

Agree with the suggestion here, ideally autocomplete should work for more convenience. Moving this to WooCommerce Admin repo as they are correct team to handle this.

joelclimbsthings commented 3 years ago

This is behaving a little different on my end.

After manually enabling address autocompletion in the latest Chrome (v92.0.4515.131), and adding an address, the drop-down appears for every field except for country. If I choose to select the autocomplete in those fields, all fields (including country) populate correctly.

I'm not sure we actually even want the browser autocomplete displaying over our existing autocompletion on the country field?

That said, are there any other details that made the difference in triggering this behavior @AashikP ? Is autocompletion working correctly on the other fields?

AashikP commented 3 years ago

@joelclimbsthings I agree that we can let the browser field intact. That said, other fields are not reliable / consistent as well. For example:

https://d.pr/i/0LfsCm+

Is it likely that the Country field is blocking autocomplete of other fields as well? For example, when I place the cursor on the first field, the city/zip code is not automatically filled.

louwie17 commented 3 years ago

Is it likely that the Country field is blocking autocomplete of other fields as well? For example, when I place the cursor on the first field, the city/zip code is not automatically filled.

@AashikP I was able to reproduce this issue as well, and I think your case above might be correct that the typeahead autocomplete was blocking the rest of the fields. This is not the case for every address and must be related to the format of the country and state.

I did make some recent changes to the Country/Region field that address most of the issues mentioned in this issue as part of https://github.com/woocommerce/woocommerce-admin/issues/5523.

country-region-typeahead

These changes will be released as part of WC Admin 2.7, you can test the changes out in this beta version here. @AashikP when I re-tested the above scenario it was working correctly with the 2.7 beta. I also disabled typeahead on the country/region field which should fix the issue @sanzeeb3 was facing.

We can leave this open until 2.7 is officially released, but let us know if you do notice other issues with the changes above.

AashikP commented 3 years ago

@louwie17 Sorry for the delay in response here.

I can confirm that things are working as expected with WooCommerce Admin 2.7 installed:

https://d.pr/i/5zIRkN+

joshuatf commented 3 years ago

Thanks for checking, @AashikP! Closing this issue, feel free to reopen if the problem persists.