Twenty Twenty-Two & Quadrat: Adding a variable product to cart does not work

[ralucaStan]

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

• I have carried out troubleshooting steps and I believe I have found a bug.
• I have searched for similar bugs in both open and closed issues and cannot find a duplicate.

Describe the bug
Adding a variable product to cart on the Twenty Twenty-Two theme fails.

Expected behavior
On the product page, when the user selects the variations and clicks Add to cart the product should be added to the cart

Actual behavior
On the product page, when the user selects the variations and clicks Add to cart he sees a warning Please choose product options... although the options were chosen

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

• Make sure you have WP 5.9.0 beta and choose the Twenty Twenty-Two theme (use Beta tester for updating WP )
• Add the WC sample products for testing

1. Go to a variable product page (V-Neck T-Shirt)
2. Select options for the product (Color & size)
3. Click on Add to cart
4. Notice the warning saying Please choose product options by visiting V-Neck T-Shirt
5. Notice that the product was not added to the cart

Screenshots
If applicable, add screenshots to help explain your problem.

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
We use the WooCommerce System Status Report to help us evaluate the issue.
Without this report we won't be able to fully evaluate this issue.

``` The System Status Report is found in your WordPress admin under **WooCommerce > Status**. Please select “Get system report”, then “Copy for support”, and then paste it here. ``` ` ### WordPress Environment ###

WordPress address (URL): http://woo-blocks.local
Site address (URL): http://woo-blocks.local
WC Version: 5.9.0
REST API Version: ✔ 5.9.0
WC Blocks Version: ✔ 6.5.0-dev
Action Scheduler Version: ✔ 3.3.0
WC Admin Version: ✔ 2.8.0
Log Directory Writable: ✔
WP Version: 5.9-beta1
WP Multisite: –
WP Memory Limit: 256 MB
WP Debug Mode: ✔
WP Cron: ✔
Language: en_US
External object cache: –

Server Environment

Server Info: nginx/1.16.0
PHP Version: 7.3.5
PHP Post Max Size: 1,000 MB
PHP Time Limit: 1200
PHP Max Input Vars: 4000
cURL Version: 7.54.0
LibreSSL/2.6.5

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

Database

WC Database Version: 5.9.0
WC Database Prefix: wp_
Total Database Size: 5.79MB
Database Data Size: 4.25MB
Database Index Size: 1.54MB
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.05MB + Index: 0.13MB + 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: 3.03MB + Index: 0.06MB + Engine InnoDB
wp_postmeta: Data: 0.27MB + Index: 0.14MB + Engine InnoDB
wp_posts: Data: 0.09MB + Index: 0.06MB + 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_termmeta: Data: 0.02MB + Index: 0.03MB + Engine InnoDB
wp_terms: 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_note_actions: Data: 0.02MB + Index: 0.02MB + Engine InnoDB
wp_wc_admin_notes: Data: 0.05MB + Index: 0.00MB + 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: 29
customize_changeset: 2
page: 7
post: 2
product: 19
product_variation: 7
revision: 2
shop_order: 9
shop_subscription: 3
wp_global_styles: 1
yaymail_template: 15

Security

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

Active Plugins (9)

Query Monitor: by John Blackbourn – 3.7.1
WooCommerce Additional Variation Images: by WooCommerce – 1.9.0
WooCommerce Email Customizer: by WooCommerce – 1.3.0
WooCommerce Stripe Gateway: by WooCommerce – 5.8.1
WooCommerce Blocks: by Automattic – 6.5.0-dev
WooCommerce Subscriptions Core: by Automattic – 1.1.0
WooCommerce Subscriptions: by WooCommerce – 3.1.6
WooCommerce: by Automattic – 5.9.0
WordPress Beta Tester: by Peter Westwood
Andy Fragen – 3.1.4

Inactive Plugins (1)

Akismet Anti-Spam: by Automattic – 4.2.1

Dropin Plugins (1)

db.php: Query Monitor Database Class

Settings

API Enabled: –
Force SSL: –
Currency: EUR (€)
Currency Position: right_space
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: 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-Two
Version: 1.0
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: ❌ Not declared

Templates

Overrides: –

Subscriptions

WCS_DEBUG: ✔ No
Subscriptions Mode: ✔ Live
Subscriptions Live URL: http://woo-blocks.local
Subscription Statuses: wc-active: 3
WooCommerce Account Connected: ❌ No
Report Cache Enabled: ✔ Yes
Cache Update Failures: ✔ 0 failure

Store Setup

Country / State: Germany

Subscriptions by Payment Gateway

Stripe: wc-active: 3

Payment Gateway Support

Direct bank transfer: products
Check payments: products
Cash on delivery: products
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

Action Scheduler

Complete: 78
Oldest: 2021-11-23 16:48:58 +0000
Newest: 2021-12-07 10:04:34 +0000

Pending: 4
Oldest: 2021-12-07 10:42:57 +0000
Newest: 2021-12-31 09:52:34 +0000

Status report information

Generated at: 2021-12-07 10:40:54 +00:00
`

[tjcafferkey]

Can confirm this happens when using the Block Template. When using the Core PHP template this works as expected. Going to investigate further.

[tjcafferkey]

This is occurring because the code that enqueues the required script is running before the code that registers the required script.

This is only an issue for block templates because we are getting the block template html by running get_the_block_template_html which enqueues the required scripts, before we run wp_head(), which registers the required scripts here. Resulting in a scenario where we are trying to enqueue scripts before they are registered, meaning they don't get included on the frontend.