search

woocommerce / woocommerce-blocks

(Deprecated) This plugin has been merged into woocommerce/woocommerce
https://wordpress.org/plugins/woo-gutenberg-products-block/
GNU General Public License v3.0
405 stars 218 forks source link

[GlobalStep] "Shipping" and "Local Pickup" options in the "Shipping Method" section fails to appear with 50% width on the "Editor" page with the Checkout block. #10621

Closed gglobalstep closed 1 year ago

gglobalstep commented 1 year ago

Bug Description:

"Shipping" and "Local Pickup" options in the "Shipping Method" section fails to appear with 50% width on the "Editor" page with the Checkout block.

Environment:

Woocommerce Version: 8.1.0-dev WordPress version: 6.3 PHP version: 8.0.30

PC: Windows 10 Chrome(Version 116.0.5845.97) Firefox (Version 116.0.2)

Steps To Reproduce:

  1. Create any test site.
  2. Install and activate all the required plugins.
  3. Install an activate Woocommerce 8.1.0-dev plugin.
  4. Install and activate Tsubaki theme.
  5. Go to "Woocommerce > Settings > Advanced > Page setup"
  6. Edit "Checkout page" option and replace Classic checkout page to Checkout block.
  7. Go to "Woocommerce > Settings > Shipping" tab.
  8. Click "Local Pickup" link and enable "Local pickup"
  9. Go to Pages > Add new.
  10. Create a new test page and add Checkout block using Inserter.
  11. Observe that, "Shipping" and "Local Pickup" options in the "Shipping Method" section fails to appear with 50% width on Editor page.

Note:

  1. On Frontend, "Shipping" and "Local Pickup" options in the "Shipping Method" section appears as expected.
  2. Colors for "Shipping" and "Local Pickup" options appears different on "Editor" and "Frontend".

Actual Result:

"Shipping" and "Local Pickup" options in the "Shipping Method" section fails to appear with 50% width on the "Editor" page with the Checkout block.

Expected Result:

"Shipping" and "Local Pickup" options in the "Shipping Method" section should appear with 50% width on the "Editor" page with the Checkout block.

Screenshot:

Editor: #10621 1

Frontend: #10621 2

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

` ### WordPress Environment ### WC Version: 8.0.0 REST API Version: ✔ 8.0.0 WC Blocks Version: ✔ 10.6.5 Action Scheduler Version: ✔ 3.6.1 Log Directory Writable: ✔ WP Version: 6.3 WP Multisite: – WP Memory Limit: 512 MB WP Debug Mode: – WP Cron: ✔ Language: en_US External object cache: ✔ ### Server Environment ### Server Info: nginx PHP Version: 8.0.30 PHP Post Max Size: 2 GB PHP Time Limit: 1200 PHP Max Input Vars: 6144 cURL Version: 8.0.1 OpenSSL/1.1.1n SUHOSIN Installed: – MySQL Version: 10.4.28-MariaDB-log Max Upload Size: 2 GB Default Timezone is UTC: ✔ fsockopen/cURL: ✔ SoapClient: ✔ DOMDocument: ✔ GZip: ✔ Multibyte String: ✔ Remote Post: ✔ Remote Get: ✔ ### Database ### WC Database Version: 8.0.1 WC Database Prefix: wp_ Total Database Size: 21.26MB Database Data Size: 14.88MB Database Index Size: 6.38MB wp_woocommerce_sessions: Data: 0.06MB + 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.22MB + Index: 0.14MB + 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: 2.48MB + Index: 1.36MB + 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: 1.52MB + Index: 0.70MB + Engine InnoDB wp_automatewoo_abandoned_carts: Data: 0.02MB + Index: 0.08MB + Engine InnoDB wp_automatewoo_customers: Data: 0.02MB + Index: 0.09MB + Engine InnoDB wp_automatewoo_customer_meta: Data: 0.02MB + Index: 0.03MB + Engine InnoDB wp_automatewoo_events: Data: 0.02MB + Index: 0.05MB + Engine InnoDB wp_automatewoo_guests: Data: 0.02MB + Index: 0.06MB + Engine InnoDB wp_automatewoo_guest_meta: Data: 0.02MB + Index: 0.03MB + Engine InnoDB wp_automatewoo_logs: Data: 0.02MB + Index: 0.05MB + Engine InnoDB wp_automatewoo_log_meta: Data: 0.02MB + Index: 0.03MB + Engine InnoDB wp_automatewoo_queue: Data: 0.02MB + Index: 0.05MB + Engine InnoDB wp_automatewoo_queue_meta: Data: 0.02MB + Index: 0.03MB + Engine InnoDB wp_commentmeta: Data: 0.05MB + Index: 0.03MB + Engine InnoDB wp_comments: Data: 0.06MB + Index: 0.09MB + Engine InnoDB wp_gla_attribute_mapping_rules: Data: 0.02MB + Index: 0.00MB + Engine InnoDB wp_gla_budget_recommendations: Data: 0.22MB + Index: 0.14MB + Engine InnoDB wp_gla_merchant_issues: Data: 0.02MB + Index: 0.00MB + Engine InnoDB wp_gla_shipping_rates: Data: 0.02MB + Index: 0.03MB + Engine InnoDB wp_gla_shipping_times: Data: 0.02MB + Index: 0.02MB + Engine InnoDB wp_links: Data: 0.02MB + Index: 0.02MB + Engine InnoDB wp_mailpoet_automations: Data: 0.02MB + Index: 0.00MB + Engine InnoDB wp_mailpoet_automation_runs: Data: 0.02MB + Index: 0.08MB + Engine InnoDB wp_mailpoet_automation_run_logs: Data: 0.02MB + Index: 0.05MB + Engine InnoDB wp_mailpoet_automation_run_subjects: Data: 0.02MB + Index: 0.03MB + Engine InnoDB wp_mailpoet_automation_triggers: Data: 0.02MB + Index: 0.00MB + Engine InnoDB wp_mailpoet_automation_versions: Data: 0.02MB + Index: 0.02MB + Engine InnoDB wp_mailpoet_custom_fields: Data: 0.02MB + Index: 0.02MB + Engine InnoDB wp_mailpoet_dynamic_segment_filters: Data: 0.02MB + Index: 0.02MB + Engine InnoDB wp_mailpoet_feature_flags: Data: 0.02MB + Index: 0.02MB + Engine InnoDB wp_mailpoet_forms: Data: 0.02MB + Index: 0.00MB + Engine InnoDB wp_mailpoet_log: Data: 0.02MB + Index: 0.00MB + Engine InnoDB wp_mailpoet_migrations: Data: 0.02MB + Index: 0.02MB + Engine InnoDB wp_mailpoet_newsletters: Data: 0.02MB + Index: 0.03MB + Engine InnoDB wp_mailpoet_newsletter_links: Data: 0.02MB + Index: 0.05MB + Engine InnoDB wp_mailpoet_newsletter_option: Data: 0.02MB + Index: 0.02MB + Engine InnoDB wp_mailpoet_newsletter_option_fields: Data: 0.02MB + Index: 0.02MB + Engine InnoDB wp_mailpoet_newsletter_posts: Data: 0.02MB + Index: 0.02MB + Engine InnoDB wp_mailpoet_newsletter_segment: Data: 0.02MB + Index: 0.02MB + Engine InnoDB wp_mailpoet_newsletter_templates: Data: 2.52MB + Index: 0.00MB + Engine InnoDB wp_mailpoet_scheduled_tasks: Data: 0.02MB + Index: 0.03MB + Engine InnoDB wp_mailpoet_scheduled_task_subscribers: Data: 0.02MB + Index: 0.02MB + Engine InnoDB wp_mailpoet_segments: Data: 0.02MB + Index: 0.03MB + Engine InnoDB wp_mailpoet_sending_queues: Data: 0.02MB + Index: 0.03MB + Engine InnoDB wp_mailpoet_settings: Data: 0.02MB + Index: 0.02MB + Engine InnoDB wp_mailpoet_statistics_bounces: Data: 0.02MB + Index: 0.00MB + Engine InnoDB wp_mailpoet_statistics_clicks: Data: 0.02MB + Index: 0.05MB + Engine InnoDB wp_mailpoet_statistics_forms: Data: 0.02MB + Index: 0.02MB + Engine InnoDB wp_mailpoet_statistics_newsletters: Data: 0.02MB + Index: 0.03MB + Engine InnoDB wp_mailpoet_statistics_opens: Data: 0.02MB + Index: 0.08MB + Engine InnoDB wp_mailpoet_statistics_unsubscribes: Data: 0.02MB + Index: 0.05MB + Engine InnoDB wp_mailpoet_statistics_woocommerce_purchases: Data: 0.02MB + Index: 0.06MB + Engine InnoDB wp_mailpoet_stats_notifications: Data: 0.02MB + Index: 0.03MB + Engine InnoDB wp_mailpoet_subscribers: Data: 0.02MB + Index: 0.23MB + Engine InnoDB wp_mailpoet_subscriber_custom_field: Data: 0.02MB + Index: 0.02MB + Engine InnoDB wp_mailpoet_subscriber_ips: Data: 0.02MB + Index: 0.02MB + Engine InnoDB wp_mailpoet_subscriber_segment: Data: 0.02MB + Index: 0.03MB + Engine InnoDB wp_mailpoet_subscriber_tag: Data: 0.02MB + Index: 0.03MB + Engine InnoDB wp_mailpoet_tags: Data: 0.02MB + Index: 0.02MB + Engine InnoDB wp_mailpoet_user_agents: Data: 0.02MB + Index: 0.02MB + Engine InnoDB wp_mailpoet_user_flags: Data: 0.02MB + Index: 0.02MB + Engine InnoDB wp_options: Data: 2.09MB + Index: 0.06MB + Engine InnoDB wp_postmeta: Data: 0.52MB + Index: 0.31MB + Engine InnoDB wp_posts: Data: 1.45MB + 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.06MB + Index: 0.03MB + Engine InnoDB wp_users: Data: 0.02MB + Index: 0.05MB + Engine InnoDB wp_wc_admin_notes: Data: 0.06MB + Index: 0.00MB + Engine InnoDB wp_wc_admin_note_actions: Data: 0.05MB + 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_bundle_lookup: Data: 0.02MB + Index: 0.09MB + 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_attributes_lookup: Data: 0.02MB + Index: 0.02MB + Engine InnoDB wp_wc_product_download_directories: Data: 0.02MB + Index: 0.02MB + Engine InnoDB wp_wc_product_meta_lookup: Data: 0.02MB + Index: 0.09MB + Engine InnoDB wp_wc_rate_limits: Data: 0.02MB + Index: 0.02MB + 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_woocommerce_bis_activity: Data: 0.02MB + Index: 0.05MB + Engine InnoDB wp_woocommerce_bis_notifications: Data: 0.02MB + Index: 0.09MB + Engine InnoDB wp_woocommerce_bis_notificationsmeta: Data: 0.02MB + Index: 0.03MB + Engine InnoDB wp_woocommerce_bundled_itemmeta: Data: 0.02MB + Index: 0.03MB + Engine InnoDB wp_woocommerce_bundled_items: Data: 0.02MB + Index: 0.03MB + Engine InnoDB wp_woocommerce_gc_activity: Data: 0.02MB + Index: 0.06MB + Engine InnoDB wp_woocommerce_gc_cards: Data: 0.02MB + Index: 0.06MB + Engine InnoDB wp_woocommerce_gc_cardsmeta: Data: 0.02MB + Index: 0.03MB + Engine InnoDB wp_woocommerce_prl_deploymentmeta: Data: 0.02MB + Index: 0.03MB + Engine InnoDB wp_woocommerce_prl_deployments: Data: 0.02MB + Index: 0.06MB + Engine InnoDB wp_woocommerce_prl_frequencies: Data: 0.02MB + Index: 0.02MB + Engine InnoDB wp_woocommerce_prl_tracking_conversions: Data: 0.02MB + Index: 0.05MB + Engine InnoDB wp_wpml_mails: Data: 1.52MB + Index: 0.02MB + Engine InnoDB ### Post Type Counts ### attachment: 60 jetpack_migration: 2 jp_img_sitemap: 3 jp_pay_product: 2 jp_sitemap: 3 jp_sitemap_master: 3 mailpoet_page: 1 page: 16 post: 6 product: 40 product_variation: 9 revision: 44 shop_coupon: 4 shop_order: 47 wp_global_styles: 2 wp_navigation: 2 wp_template: 2 wp_template_part: 2 ### Security ### Secure connection (HTTPS): ✔ Hide errors from visitors: ✔ ### Active Plugins (28) ### Query Monitor: by John Blackbourn – 3.13.1 Akismet Anti-Spam: Spam Protection: by Automattic - Anti Spam Team – 5.2 AutomateWoo: by WooCommerce – 6.0.2 Crowdsignal Forms: by Automattic – 1.7.0 Facebook for WooCommerce: by Facebook – 3.0.31 WordPress.com Editing Toolkit: by Automattic – 3.75083 Google Listings and Ads: by WooCommerce – 2.5.2 Gutenberg: by Gutenberg Team – 16.4.0 Jetpack: by Automattic – 12.5-a.7 Layout Grid: by Automattic – 1.8.4 Page Optimize: by Automattic – 0.5.3 Pinterest for WooCommerce: by WooCommerce – 1.3.7 Crowdsignal Polls & Ratings: by Automattic Inc. – 3.0.11 TikTok: by TikTok – 1.1.6 Woo AI: by WooCommerce – 0.2.0 WooCommerce Back In Stock Notifications: by WooCommerce – 1.6.3 WooCommerce Brands: by WooCommerce – 1.6.56 WooCommerce Gift Cards: by WooCommerce – 1.16.3 WooCommerce Google Analytics Integration: by WooCommerce – 1.8.4 WooCommerce Min/Max Quantities: by WooCommerce – 4.1.0 WooCommerce Payments: by Automattic – 6.3.0 WooCommerce Product Add-ons: by WooCommerce – 6.4.5 WooCommerce Product Bundles: by WooCommerce – 6.22.2 WooCommerce Product Recommendations: by WooCommerce – 2.4.2 WooCommerce Shipping & Tax: by WooCommerce – 2.3.2 WooCommerce Shipment Tracking: by WooCommerce – 2.3.5 WooCommerce: by Automattic – 8.1.0-dev WP Mail Logging: by WP Mail Logging Team – 1.12.0 ### Inactive Plugins (12) ### Avalara AvaTax: by Avalara – 2.5.1 Classic Editor: by WordPress Contributors – 1.6.3 MailPoet: by MailPoet – 4.24.0 TaxJar - Sales Tax Automation for WooCommerce: by TaxJar – 4.1.5 WooCommerce Australia Post Shipping: by WooCommerce – 2.5.4 WooCommerce Canada Post Shipping: by WooCommerce – 2.8.1 WooCommerce EU VAT Number: by WooCommerce – 2.8.6 WooCommerce FedEx Shipping: by WooCommerce – 3.8.2 WooCommerce Royal Mail: by WooCommerce – 2.9.0 WooCommerce UPS Shipping: by WooCommerce – 3.5.3 WooCommerce USPS Shipping: by WooCommerce – 4.7.2 WP Crontrol: by John Blackbourn & crontributors – 1.15.3 ### Dropin Plugins (3) ### advanced-cache.php: advanced-cache.php db.php: Query Monitor Database Class (Drop-in) object-cache.php: Memcached ### Must Use Plugins (1) ### WP.com Site Helper: by – ### Settings ### API Enabled: – Force SSL: – Currency: USD ($) Currency Position: left Thousand Separator: , Decimal Separator: . Number of Decimals: 2 Taxonomies: Product Types: bundle (bundle) external (external) grouped (grouped) simple (simple) subscription (subscription) variable (variable) variable subscription (variable-subscription) 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: ✔ Enforce Approved Product Download Directories: ✔ HPOS feature screen enabled: – HPOS feature enabled: – Order datastore: WC_Order_Data_Store_CPT HPOS data sync enabled: – ### WC Pages ### Shop base: #45 - /shop/ Cart: #46 - /cart/ Checkout: #47 - /checkout/ My account: #48 - /my-account/ Terms and conditions: ❌ Page not set ### Theme ### Name: Tsubaki Version: 1.2.2 Author URL: https://automattic.com/ 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: /srv/htdocs/wp-content/plugins/woocommerce/packages/woocommerce-blocks/templates/notices/error.php /srv/htdocs/wp-content/plugins/woocommerce/packages/woocommerce-blocks/templates/notices/notice.php /srv/htdocs/wp-content/plugins/woocommerce/packages/woocommerce-blocks/templates/notices/success.php ### Subscriptions ### WCS_DEBUG: ✔ No Subscriptions Mode: ✔ Live Subscriptions Live URL: https://woo-really-teenage-gladiator.wpcomstaging.com Subscriptions-core Library Version: 6.0.0 Subscription Statuses: – WooCommerce Account Connected: ✔ Yes Active Product Key: ❌ No ### Store Setup ### Country / State: United States (US) — California ### Subscriptions by Payment Gateway ### ### Payment Gateway Support ### Cash on delivery: products Check payments: products Direct bank transfer: products ### Back In Stock ### Database Version: 1.6.3 Loopback Test: ✔ ### Gift Cards ### Database Version: 1.16.3 Loopback Test: ✔ Task Queueing Test: ✔ ### Product Bundles ### Database Version: 6.22.2 Loopback Test: ✔ Template Overrides: – ### Admin ### Enabled Features: activity-panels analytics product-block-editor coupons core-profiler customer-effort-score-tracks import-products-task experimental-fashion-sample-products shipping-smart-defaults shipping-setting-tour homescreen marketing mobile-app-banner onboarding onboarding-tasks remote-inbox-notifications remote-free-extensions payment-gateway-suggestions shipping-label-banner subscriptions store-alerts transient-notices woo-mobile-welcome wc-pay-promotion wc-pay-welcome-page Disabled Features: customize-store minified-js navigation new-product-management-experience product-variation-management settings async-product-editor-category-field Daily Cron: ✔ Next scheduled: 2023-08-17 07:02:47 +01:00 Options: ✔ Notes: 70 Onboarding: skipped ### WooCommerce Payments ### Version: 6.3.0 Connected to WPCOM: Yes Blog ID: 220476338 Account ID: - ### Action Scheduler ### Canceled: 1 Oldest: 2023-08-02 23:51:38 +0100 Newest: 2023-08-02 23:51:38 +0100 Complete: 4,036 Oldest: 2023-07-21 01:05:07 +0100 Newest: 2023-08-16 14:06:16 +0100 Failed: 465 Oldest: 2023-06-28 21:10:01 +0100 Newest: 2023-08-16 14:04:33 +0100 Pending: 19 Oldest: 2023-08-16 14:06:18 +0100 Newest: 2023-08-18 13:21:53 +0100 ### Product Recommendations ### Database Version: 2.4.2 Loopback Test: ✔ Task Queueing Test: ✔ Page Cache Test: Cache in use ### Status report information ### Generated at: 2023-08-16 14:06:20 +01:00 `
senadir commented 1 year ago

I'm unable to test this as I can't get access to the Tsubaki theme but it looks fine on other themes. @nielslange you initially triaged this, on what theme did you reproduce this?

nielslange commented 1 year ago

I'm unable to test this as I can't get access to the Tsubaki theme but it looks fine on other themes. @nielslange you initially triaged this, on what theme did you reproduce this?

I was using the Twenty Twenty-Three theme, @senadir. The problem only occurred when viewing the Checkout block within the page editor on a page that hasn't been defined as the checkout page via /wp-admin/admin.php?page=wc-settings&tab=advanced. That said, I can no longer reproduce this issue at the moment. Initially, this issue had been reported in p1691674360740079-slack-C011ENB20Q1 and that's where I troubleshot this issue and mentioned my findings.

ralucaStan commented 1 year ago

No longer applicable

Screenshot 2023-11-10 at 17 04 53