[GlobalStep - 4.3 RC2] Products block fails to display in "Full width" on Preview and Publish screen.

[gglobalstep]

Bug Description:

Products block fails to display in Full width on Preview and Publish screen.

Environment:

Windows 10
Browser: Chrome(Version 83.0.4103.61 (64-bit))
Browser: Firefox(Version 77.0.1)(64-bit)

Steps to Reproduce:

1. Launch any of the 5 test sites.
2. Sign In with valid credentials.
3. Go to Pages->Add New.
4. Add All Product/Any Product grid based block.
5. Change block alignment to Full width.
6. Click on Preview.
7. Observe that Product block fails to display in full width.

Actual Result:

Products block fails to display in Full width on Preview and Publish screen.

Expected Result:

Products block should display in Full width on Preview and Publish screen.

Artifacts:

#2801.zip

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 address (URL): https://lw.testwc.com
Site address (URL): https://lw.testwc.com
WC Version: 4.3.0
REST API Version: ✔ 1.0.10
WC Blocks Version: ✔ 2.7.1
Action Scheduler Version: ✔ 3.1.6
WC Admin Version: ✔ 1.3.0-rc.2
Log Directory Writable: ✔
WP Version: 5.4.2
WP Multisite: –
WP Memory Limit: 256 MB
WP Debug Mode: –
WP Cron: ✔
Language: en_US
External object cache: –

Server Environment

Server Info: nginx/1.14.0
PHP Version: 7.2.30-1+ubuntu18.04.1+deb.sury.org+1
PHP Post Max Size: 200 MB
PHP Time Limit: 300
PHP Max Input Vars: 1000
cURL Version: 7.58.0
OpenSSL/1.1.1g

SUHOSIN Installed: –
MySQL Version: 5.6.47-87.0
Max Upload Size: 200 MB
Default Timezone is UTC: ✔
fsockopen/cURL: ✔
SoapClient: ✔
DOMDocument: ✔
GZip: ✔
Multibyte String: ✔
Remote Post: ✔
Remote Get: ✔

Database

WC Database Version: 4.3.0
WC Database Prefix: wp_
Total Database Size: 9.07MB
Database Data Size: 6.69MB
Database Index Size: 2.38MB
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.06MB + 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.39MB + Index: 0.28MB + 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.20MB + Index: 0.20MB + Engine InnoDB
wp_affiliate_wp_affiliatemeta: Data: 0.02MB + Index: 0.03MB + Engine InnoDB
wp_affiliate_wp_affiliates: Data: 0.02MB + Index: 0.02MB + Engine InnoDB
wp_affiliate_wp_campaigns: Data: 0.00MB + Index: 0.00MB + Engine
wp_affiliate_wp_creatives: Data: 0.02MB + Index: 0.02MB + Engine InnoDB
wp_affiliate_wp_customermeta: Data: 0.02MB + Index: 0.03MB + Engine InnoDB
wp_affiliate_wp_customers: Data: 0.02MB + Index: 0.03MB + Engine InnoDB
wp_affiliate_wp_direct_links: Data: 0.02MB + Index: 0.03MB + Engine InnoDB
wp_affiliate_wp_payouts: Data: 0.02MB + Index: 0.02MB + Engine InnoDB
wp_affiliate_wp_referrals: Data: 0.02MB + Index: 0.02MB + Engine InnoDB
wp_affiliate_wp_rest_consumers: Data: 0.02MB + Index: 0.02MB + Engine InnoDB
wp_affiliate_wp_visits: Data: 0.02MB + Index: 0.02MB + Engine InnoDB
wp_commentmeta: Data: 0.02MB + Index: 0.03MB + Engine InnoDB
wp_comments: Data: 0.06MB + Index: 0.09MB + Engine InnoDB
wp_links: Data: 0.02MB + Index: 0.02MB + Engine InnoDB
wp_mailchimp_carts: Data: 0.02MB + Index: 0.00MB + Engine InnoDB
wp_mailchimp_jobs: Data: 0.02MB + Index: 0.00MB + Engine InnoDB
wp_options: Data: 3.13MB + Index: 0.09MB + Engine InnoDB
wp_postmeta: Data: 0.33MB + Index: 0.28MB + Engine InnoDB
wp_posts: Data: 1.52MB + Index: 0.13MB + 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_wcs_payment_retries: Data: 0.02MB + Index: 0.02MB + 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_wpmerge_options: Data: 0.02MB + Index: 0.02MB + Engine InnoDB

Post Type Counts

attachment: 57
log_emails_log: 71
nav_menu_item: 5
page: 17
post: 24
product: 28
product_variation: 1
revision: 224
shop_coupon: 1
shop_order: 32
shop_order_refund: 1
shop_subscription: 6
wp_block: 1

Security

Secure connection (HTTPS): ✔
Hide errors from visitors: ✔

Active Plugins (11)

Akismet Anti-Spam: by Automattic – 4.1.6
Astra Pro: by Brainstorm Force – 2.5.1
Facebook for WooCommerce: by Facebook – 1.11.4 – Installed version not tested with active version of WooCommerce 4.3.0
Jetpack by WordPress.com: by Automattic – 8.6.1
Log Emails: by WebAware – 1.3.1
Password Protected: by Ben Huson – 2.3
WooCommerce Beta Tester: by WooCommerce – 2.0.1 – Installed version not tested with active version of WooCommerce 4.3.0
WooCommerce Stripe Gateway: by WooCommerce – 4.5.0 – Installed version not tested with active version of WooCommerce 4.3.0
WooCommerce Services: by Automattic – 1.23.2 – Installed version not tested with active version of WooCommerce 4.3.0
WooCommerce Subscriptions: by WooCommerce – 3.0.5 – Installed version not tested with active version of WooCommerce 4.3.0
WooCommerce: by Automattic – 4.3.0-rc.2

Inactive Plugins (4)

Classic Editor: by WordPress Contributors – 1.5
Compress JPEG & PNG images: by TinyPNG – 3.2.1
Google Ads for WooCommerce: by Kliken – 1.0.4 – Installed version not tested with active version of WooCommerce 4.3.0
Mailchimp for WooCommerce: by Mailchimp – 2.4.1 – Installed version not tested with active version of WooCommerce 4.3.0

Must Use Plugins (4)

Liquid Web Managed WordPress: by Liquid Web support@liquidweb.com – 1.4
Liquid Web Managed WordPress Configuration: by Liquid Web – 1.0.0
Liquid Web Managed WordPress Platform Manager: by Liquid Web – 1.1.0
Liquid Web Update Manager: by Liquid Web support@liquidweb.com – 1.0

Settings

API Enabled: –
Force SSL: –
Currency: USD ($)
Currency Position: left
Thousand Separator: ,
Decimal Separator: .
Number of Decimals: 2
Taxonomies: Product Types: 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: ✔

WC Pages

Shop base: #28 - /shop/
Cart: #6 - /cart/
Checkout: #7 - /checkout/
My account: #8 - /my-account/
Terms and conditions: ❌ Page not set

Theme

Name: Storefront
Version: 2.5.7
Author URL: https://woocommerce.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: –

Subscriptions

WCS_DEBUG: ✔ No
Subscriptions Mode: ✔ Live
Subscriptions Live URL: https://lw.testwc.com
Subscription Statuses: wc-active: 6
WooCommerce Account Connected: ✔ Yes
Active Product Key: ✔ Yes
Custom Retry Rules: ✔ No
Custom Retry Rule Class: ✔ No
Custom Raw Retry Rule: ✔ No
Custom Retry Rule: ✔ No
Retries Migration Status: ✔ Completed
Report Cache Enabled: ✔ Yes
Cache Update Failures: ✔ 0 failure

Store Setup

Country / State: United States (US) — California

Subscriptions by Payment Gateway

Stripe: wc-active: 6

Payment Gateway Support

Stripe: products
refunds
tokenization
add_payment_method
subscriptions
subscription_cancellation
subscription_suspension
subscription_reactivation
subscription_amount_changes
subscription_date_changes
subscription_payment_method_change
subscription_payment_method_change_customer
subscription_payment_method_change_admin
multiple_subscriptions
pre-orders

Action Scheduler

Complete: 850
Oldest: 2020-05-31 15:41:01 +0000
Newest: 2020-07-01 14:01:14 +0000

Pending: 8
Oldest: 2020-07-01 15:01:14 +0000
Newest: 2020-08-17 21:54:26 +0000

`

</details>

[nerrad]

I'm not able to reproduce this with Storefront on a full width page template. I'm assuming the cause of the report here is that the tests are done on a page template with sidebar and in that context, full width is just the width of the post-content container (which doesn't vary from the existing width).

This isn't really a blocks plugin problem but strays more into themes (and where they add support for the various width settings) and even Gutenberg to a degree (the control comes from Gutenberg).