Skip to content

Conversation

@mgascam
Copy link
Contributor

@mgascam mgascam commented Nov 21, 2025

Part 2 of 5: WC Blocks Checkout

Test Coverage

  • ✅ WC Blocks checkout failures
  • ✅ WC Blocks checkout purchase
  • ✅ WC Blocks saved card checkout and usage

Testing

The site that QIT spins needs an onboarded account. Follow this steps to get the JetPack tokens:

  1. Create a fresh JN with defaults plus:
    • WooCommerce
    • JetPack Debug helper
  2. Log in as admin
  3. Navigate to Admin > Payments
  4. Click Install next to Accept payments with Woo
  5. Choose your payment methods > Enable all > Continue
  6. Connect to Wordpress.com > Connect
  7. You're almost there — time to activate payments! > Test payments first, activate later > Test Payments
  8. You should be onboarded in test mode by this point
  9. Admin > Jetpack Debug > Jetpack Debug Tools > Enable Broken token Utilities and Save
  10. Admin > Jetpack Debug > Broken Token > Current token options being used by Jetpack:
  11. Note
    • Blog ID
    • Blog Token
    • User Tokens (note: it shows an array, but you need the value of the first element)
  12. You can now populate the vars in tests/qit/config/local.env with those values. You can use tests/qit/config/default.env as a template
    • E2E_JP_SITE_ID
    • E2E_JP_BLOG_TOKEN
    • E2E_JP_USER_TOKEN
  13. Note: some times tests due to an authentication issue. Please try to reconnect Jetpack in the JN site and try again with the new tokens

Run the tests

npm run test:qit-e2e // run all tests
npm run test:qit-e2e -- --tag=blocks // run only blocks tests
npm run test:qit-e2e shopper-wc-blocks-checkout-purchase.spec.ts // run single spec

All tests should pass ✅

Next Steps

Subsequent PRs will add more test specs:

  • PR 3: My account specs
  • PR 4: Multicurrency + pay for order specs
  • PR 5: Alternative payment methods

Migrates 3 WooCommerce Blocks checkout test specs to QIT:
- Blocks checkout failures
- Blocks checkout purchase
- Blocks saved card checkout and usage

Tests cover WooCommerce Blocks-based checkout flows including
the new checkout experience and saved payment methods.
@github-actions
Copy link
Contributor

github-actions bot commented Nov 21, 2025

Test the build

Option 1. Jetpack Beta

  • Install and activate Jetpack Beta.
  • Use this build by searching for PR number 11146 or branch name dev/qit-e2e-shopper-blocks in your-test.site/wp-admin/admin.php?page=jetpack-beta&plugin=woocommerce-payments

Option 2. Jurassic Ninja - available for logged-in A12s

🚀 Launch a JN site with this branch 🚀

ℹ️ Install this Tampermonkey script to get more options.


Build info:

  • Latest commit: 3ff0331
  • Build time: 2025-11-25 17:17:26 UTC

Note: the build is updated when a new commit is pushed to this PR.

@github-actions
Copy link
Contributor

github-actions bot commented Nov 21, 2025

Size Change: 0 B

Total Size: 876 kB

ℹ️ View Unchanged
Filename Size
release/woocommerce-payments/assets/css/admin.css 1.45 kB
release/woocommerce-payments/assets/css/admin.rtl.css 1.45 kB
release/woocommerce-payments/assets/css/success.css 1.06 kB
release/woocommerce-payments/assets/css/success.rtl.css 1.06 kB
release/woocommerce-payments/dist/blocks-checkout-rtl.css 3.05 kB
release/woocommerce-payments/dist/blocks-checkout.css 3.05 kB
release/woocommerce-payments/dist/blocks-checkout.js 54.6 kB
release/woocommerce-payments/dist/cart-block-rtl.css 113 B
release/woocommerce-payments/dist/cart-block.css 112 B
release/woocommerce-payments/dist/cart-block.js 16.7 kB
release/woocommerce-payments/dist/cart.js 5.27 kB
release/woocommerce-payments/dist/checkout-rtl.css 1.13 kB
release/woocommerce-payments/dist/checkout.css 1.13 kB
release/woocommerce-payments/dist/checkout.js 34.6 kB
release/woocommerce-payments/dist/express-checkout-rtl.css 367 B
release/woocommerce-payments/dist/express-checkout.css 367 B
release/woocommerce-payments/dist/express-checkout.js 16.9 kB
release/woocommerce-payments/dist/frontend-tracks.js 833 B
release/woocommerce-payments/dist/index-rtl.css 21.2 kB
release/woocommerce-payments/dist/index.css 21.2 kB
release/woocommerce-payments/dist/index.js 153 kB
release/woocommerce-payments/dist/multi-currency-analytics.js 1.08 kB
release/woocommerce-payments/dist/multi-currency-rtl.css 3.82 kB
release/woocommerce-payments/dist/multi-currency-switcher-block.js 18.2 kB
release/woocommerce-payments/dist/multi-currency.css 3.83 kB
release/woocommerce-payments/dist/multi-currency.js 24.8 kB
release/woocommerce-payments/dist/order-rtl.css 740 B
release/woocommerce-payments/dist/order.css 740 B
release/woocommerce-payments/dist/order.js 21.3 kB
release/woocommerce-payments/dist/plugins-page-rtl.css 484 B
release/woocommerce-payments/dist/plugins-page.css 484 B
release/woocommerce-payments/dist/plugins-page.js 2.64 kB
release/woocommerce-payments/dist/product-details-rtl.css 433 B
release/woocommerce-payments/dist/product-details.css 436 B
release/woocommerce-payments/dist/product-details.js 12.3 kB
release/woocommerce-payments/dist/settings-rtl.css 11.8 kB
release/woocommerce-payments/dist/settings.css 11.7 kB
release/woocommerce-payments/dist/settings.js 141 kB
release/woocommerce-payments/dist/subscription-edit-page.js 703 B
release/woocommerce-payments/dist/subscription-product-onboarding-modal-rtl.css 527 B
release/woocommerce-payments/dist/subscription-product-onboarding-modal.css 527 B
release/woocommerce-payments/dist/subscription-product-onboarding-modal.js 1.98 kB
release/woocommerce-payments/dist/subscription-product-onboarding-toast.js 730 B
release/woocommerce-payments/dist/subscriptions-empty-state-rtl.css 120 B
release/woocommerce-payments/dist/subscriptions-empty-state.css 120 B
release/woocommerce-payments/dist/subscriptions-empty-state.js 1.9 kB
release/woocommerce-payments/dist/success.js 6.03 kB
release/woocommerce-payments/dist/tos-rtl.css 235 B
release/woocommerce-payments/dist/tos.css 235 B
release/woocommerce-payments/dist/tos.js 3 kB
release/woocommerce-payments/dist/woopay-direct-checkout.js 5.68 kB
release/woocommerce-payments/dist/woopay-express-button.js 22.8 kB
release/woocommerce-payments/dist/woopay-rtl.css 4.27 kB
release/woocommerce-payments/dist/woopay.css 4.25 kB
release/woocommerce-payments/dist/woopay.js 70.8 kB
release/woocommerce-payments/includes/subscriptions/assets/css/plugin-page.css 625 B
release/woocommerce-payments/includes/subscriptions/assets/js/plugin-page.js 814 B
release/woocommerce-payments/vendor/automattic/jetpack-assets/build/i18n-loader.js 2.46 kB
release/woocommerce-payments/vendor/automattic/jetpack-assets/build/jetpack-script-data.js 957 B
release/woocommerce-payments/vendor/automattic/jetpack-assets/src/js/i18n-loader.js 1.02 kB
release/woocommerce-payments/vendor/automattic/jetpack-assets/src/js/script-data.js 69 B
release/woocommerce-payments/vendor/automattic/jetpack-connection/babel.config.js 163 B
release/woocommerce-payments/vendor/automattic/jetpack-connection/dist/identity-crisis.css 2.47 kB
release/woocommerce-payments/vendor/automattic/jetpack-connection/dist/identity-crisis.js 14.3 kB
release/woocommerce-payments/vendor/automattic/jetpack-connection/dist/identity-crisis.rtl.css 2.47 kB
release/woocommerce-payments/vendor/automattic/jetpack-connection/dist/jetpack-connection.css 10.1 kB
release/woocommerce-payments/vendor/automattic/jetpack-connection/dist/jetpack-connection.js 29.7 kB
release/woocommerce-payments/vendor/automattic/jetpack-connection/dist/jetpack-connection.rtl.css 10.1 kB
release/woocommerce-payments/vendor/automattic/jetpack-connection/dist/jetpack-sso-admin-create-user.css 198 B
release/woocommerce-payments/vendor/automattic/jetpack-connection/dist/jetpack-sso-admin-create-user.js 280 B
release/woocommerce-payments/vendor/automattic/jetpack-connection/dist/jetpack-sso-admin-create-user.rtl.css 198 B
release/woocommerce-payments/vendor/automattic/jetpack-connection/dist/jetpack-sso-login.css 625 B
release/woocommerce-payments/vendor/automattic/jetpack-connection/dist/jetpack-sso-login.js 333 B
release/woocommerce-payments/vendor/automattic/jetpack-connection/dist/jetpack-sso-login.rtl.css 626 B
release/woocommerce-payments/vendor/automattic/jetpack-connection/dist/jetpack-sso-users.js 417 B
release/woocommerce-payments/vendor/automattic/jetpack-connection/dist/jetpack-users-connection.js 161 B
release/woocommerce-payments/vendor/automattic/jetpack-connection/dist/tracks-ajax.js 521 B
release/woocommerce-payments/vendor/automattic/jetpack-connection/dist/tracks-callables.js 585 B
release/woocommerce-payments/vendor/automattic/jetpack-connection/src/sso/jetpack-sso-admin-create-user.css 215 B
release/woocommerce-payments/vendor/automattic/jetpack-connection/src/sso/jetpack-sso-admin-create-user.js 521 B
release/woocommerce-payments/vendor/automattic/jetpack-connection/src/sso/jetpack-sso-login.css 721 B
release/woocommerce-payments/vendor/automattic/jetpack-connection/src/sso/jetpack-sso-login.js 412 B
release/woocommerce-payments/vendor/automattic/jetpack-connection/src/sso/jetpack-sso-users.js 625 B
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/assets/css/about.css 1.04 kB
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/assets/css/admin-empty-state.css 294 B
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/assets/css/admin-order-statuses.css 408 B
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/assets/css/admin.css 3.59 kB
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/assets/css/checkout.css 301 B
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/assets/css/modal.css 746 B
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/assets/css/view-subscription.css 574 B
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/assets/css/wcs-upgrade.css 414 B
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/assets/js/admin/admin-pointers.js 543 B
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/assets/js/admin/admin.js 9.4 kB
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/assets/js/admin/jstz.js 6.78 kB
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/assets/js/admin/jstz.min.js 3.84 kB
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/assets/js/admin/meta-boxes-coupon.js 545 B
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/assets/js/admin/meta-boxes-subscription.js 2.52 kB
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/assets/js/admin/moment.js 22.2 kB
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/assets/js/admin/moment.min.js 11.7 kB
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/assets/js/admin/payment-method-restrictions.js 1.29 kB
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/assets/js/admin/wcs-meta-boxes-order.js 507 B
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/assets/js/frontend/payment-methods.js 358 B
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/assets/js/frontend/single-product.js 428 B
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/assets/js/frontend/view-subscription.js 1.38 kB
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/assets/js/frontend/wcs-cart.js 782 B
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/assets/js/modal.js 1.09 kB
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/assets/js/wcs-upgrade.js 1.26 kB
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/build/index.css 391 B
release/woocommerce-payments/vendor/woocommerce/subscriptions-core/build/index.js 3.04 kB

compressed-size-action

@mgascam mgascam marked this pull request as ready for review November 21, 2025 11:48
@mgascam mgascam requested review from a team and Copilot November 21, 2025 11:48
Copilot finished reviewing on behalf of mgascam November 21, 2025 11:51
Copy link
Contributor

Copilot AI left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull Request Overview

This PR migrates WooCommerce Blocks checkout end-to-end tests to the QIT (Quality Insights Toolkit) framework, part of a larger migration effort.

Key Changes:

  • Added three new WC Blocks checkout test specs with comprehensive test coverage
  • Tests cover successful purchases (basic and 3DS cards), checkout failures with various card types, and saved card functionality
  • Added corresponding changelog entry

Reviewed Changes

Copilot reviewed 4 out of 4 changed files in this pull request and generated no comments.

File Description
tests/qit/e2e/specs/woopayments/shopper/shopper-wc-blocks-checkout-failures.spec.ts Adds comprehensive failure scenario tests for WC Blocks checkout with various declined card types
tests/qit/e2e/specs/woopayments/shopper/shopper-wc-blocks-checkout-purchase.spec.ts Adds successful purchase tests for WC Blocks checkout using basic and 3DS cards
tests/qit/e2e/specs/woopayments/shopper/shopper-wc-blocks-saved-card-checkout-and-usage.spec.ts Adds tests for saving, using, and deleting payment methods in WC Blocks checkout
changelog/dev-qit-e2e-shopper-blocks Documents the test migration as a development change with no production impact

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

Copy link
Contributor

@dmvrtx dmvrtx left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Specs work as intended! Great work!

@dmvrtx
Copy link
Contributor

dmvrtx commented Nov 24, 2025

@mgascam , there are odd CI failures. Is it related to the version compatibility?

@dmvrtx
Copy link
Contributor

dmvrtx commented Nov 24, 2025

On a separate note, if I run shopper-wc-blocks-saved-card-checkout-and-usage.spec.ts separately, I get no errors. But it produces errors if I run the whole set of tests with npm run test:qit-e2e, as if something is changing the environment.

@mgascam
Copy link
Contributor Author

mgascam commented Nov 25, 2025

On a separate note, if I run shopper-wc-blocks-saved-card-checkout-and-usage.spec.ts separately, I get no errors. But it produces errors if I run the whole set of tests with npm run test:qit-e2e, as if something is changing the environment.

Thanks for testing @dmvrtx. In theory, the order in which the tests are run should not affect since QIT spins up a new docker environment and the test site is recreated every time the tests run. I tried on my machine:

  • Run only shopper-wc-blocks-saved-card-checkout-and-usage.spec.ts (report)
  • Then I run the whole suite (report)

All tests passed for me. Would you mind to try again? Maybe is the same issue we saw that was solved refreshing the Jetpack tokens? In any case, taking a look to the qit report would be great if it keeps failing.

@mgascam
Copy link
Contributor Author

mgascam commented Nov 25, 2025

@mgascam , there are odd CI failures. Is it related to the version compatibility?

@dmvrtx Looks like there was a one time error, I retried the QIT Security and Malware Tests and it worked fine this time.

Copy link
Contributor

dmvrtx commented Nov 25, 2025

Thanks for checking, @mgascam. Can confirm it works now for me as well!

@mgascam mgascam enabled auto-merge November 25, 2025 17:13
@mgascam mgascam added this pull request to the merge queue Nov 25, 2025
Merged via the queue into develop with commit 33cd5e8 Nov 25, 2025
30 of 36 checks passed
@mgascam mgascam deleted the dev/qit-e2e-shopper-blocks branch November 25, 2025 17:28
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants