Skip to content

Release Testing Instructions WooCommerce 6.2

rodelgc edited this page Feb 2, 2022 · 22 revisions

WooCommerce 6.2 includes:

WooCommerce Admin Updates:

Inbox - 320 character limit

On a new site, with English language settings:

  1. Go to WooCommerce home screen
  2. See that all Inbox notes are short in length (aproximately less than 320 characters).

OBW: Hide the extensions header when no available plugins in the category

  1. Go to setup wizard
  2. Choose "Johor - Malaysia" as store country
  3. Go through all steps until "Business details"
  4. Go to "Free features" tab
  5. Observe the "GET THE BASICS" header is NOT shown without any plugins

OBW: Fix free extensions list isn't updated after store location or industry is changed

Change store Industry

  1. Go to the setup wizard
  2. Choose any store location that supports WCPay, such as any state in the US
  3. In the Industry step, make sure to not select CBD
  4. Proceed through the setup until the Business Details step
  5. Go to the "Free features" tab
  6. Observe WooCommerce Payments is displayed in the suggested extensions
  7. Without refreshing, go back to the Industry step
  8. Select CBD industry and click on continue until Business Details step again
  9. In the extension list, observe that WooCommerce Payments is NOT displayed.

Change store country

  1. Repeat steps 2~6
  2. Without refreshing, go back to the Store Details step
  3. Choose any store location that doesn't supports WCPay, such as Malaysia (MY)
  4. Go to Business Details step again
  5. In the extension list, observe that WooCommerce Payments is NOT displayed.

Fix PHP Warning on 'Add new product' page

  1. Go to WooCommerce > Home.
  2. Press Add my products in the task list.
  3. Press Add manually.
  4. No PHP warning should be visible.

Fix setup wizard free features checkbox re-check itself

  1. Go to Business Features tab in Setup Wizard
  2. Deselect all extensions and reselect only 1
  3. Click continue
  4. Observe the other extensions are NOT re-selected before it navigates to the next screen

Testing capabilities

  1. Start with a fresh site with an unfinished task list
  2. Go to the WordPress Dashboard page
  3. Note as an admin that you can see the WooCommerce Setup widget
  4. Create a user role that should not be able to manage WooCommerce but can view the dashboard (e.g., Author)
  5. Log in with that user and navigate to the dashboard.
  6. Note that the WooCommerce Setup widget is not visible

Testing tasks

  1. Navigate to the WordPress dashboard
  2. Note that the correct number of tasks are shown (complete/total) for the WooCommerce Setup widget. The first number in the widget should indicate the next step you need to complete. For example, if you have already completed the first step (the "Store details" task), you should see "Step 2 of 6" in the widget.
  3. Click on the action button Start selling and make sure you’re redirected to the correct page. Following the example from above, clicking Start selling should take you to the Add my products page.
  4. Repeat this process for multiple tasks, taking special attention for the “store details/setup” task since it uses a custom URL passed via the API

WooCommerce Blocks Updates:

Blocks 6.7.3

Blocks 6.7.2

Blocks 6.7.0

WooCommerce Core Updates:

Fix PhotoSwipe lightbox "close" triggering elements covered by it on mobile #31591

  1. Use Storefront or other theme that displays a menu toggle on narrow viewports
  2. Use a mobile device or simulator to open a single product page
  3. Open the photoswipe lightbox
  4. Ensure that the close button overlaps with the menu toggle (you might need to force some CSS margins to accomplish)
  5. Verify that tapping close does not trigger the menu toggle

2022 theme stylings for product and shop pages. #31536

  1. View shop and individual product page.
  2. Verify that the styling of these pages are consistent with the expected designs for the TT2 Theme.

Style My Account Pages for 2022 Theme #31575

  1. View all my account pages (with and without placing orders and having downloads)
  2. Log out and view login form.
  3. Verify that the styling of these pages are consistent with the expected designs for the TT2 Theme.

Checkout tweaks for 2022 compatibility #31619 and Some 2022 Checkout Form Tweaks #31630

  1. Go to the checkout page after adding a few products in the cart.

  2. Make sure shipping and payment-related information is displayed properly.

  3. Submit an empty form and make sure error messages are displayed properly.

    Before After
    Screen Shot 2022-01-12 at 3 00 44 PM Screen Shot 2022-01-12 at 2 56 52 PM

    ☝️ After vertical alignment of right column fixed, (applies) prices in bold, "sold by" alignment and text decoration fixed to match cart (Note: the vertical lines on the left of the after was a cropping mistake)

Basis of overlay used when processing Twenty Twenty-Two checkout. #31633

  1. Add products to the cart and proceed to the Checkout page.
  2. In the Checkout page, enter valid details to the Checkout form.
  3. Pay for the order.
  4. Notice that the blocked UI overlay (that 'greys out' the checkout form and displays a spinner after submitting the form) was visible.
  5. Verify that the blocked UI overlay appears in other places as well.

Fix order details table width on narrow viewports. #31634

  1. As a customer, add products to your cart and proceed to the Checkout page.
  2. Fill the Checkout form and submit. You should be taken to the Order Details page.
  3. Shorten the width of your browser's viewport.
  4. Verify that the order details table width is not too short as shown in the "After" screenshot below:
    Before After
    Screen Shot 2022-01-12 at 6 27 38 PM Screen Shot 2022-01-12 at 6 27 16 PM
  5. Navigate to My Account > Orders > open the order.
  6. Shorten the width of your browser's viewport.
  7. Verify that the order details table width is not too short

Modify background color for elements #31631

  1. As a customer, create a new order.
  2. Navigate to My Account > Orders > open the order.
  3. Verify that text highlights have a salmon color taken from the TT2 Styles sheet. salmon-highlighting-for-marks
  4. Take note of the Order ID.
  5. Login to WP Admin.
  6. Navigate to Pages > Add New.
  7. Add a "Shortcode" block in the page.
  8. Enter the shortcode [woocommerce_order_tracking] and publish the page.
  9. View that page.
  10. Enter the order ID and the email address in the order.
  11. Click "Track".
  12. Verify that text highlights have the same salmon color.

2002 Theme: Fix font sizes in single product tabs area, review form styling. #31632

  1. Create a simple physical product that has weight and dimensions.

  2. Also make sure that reviews are enabled in this product.

  3. Add a review to this product.

  4. As a customer, navigate to this product's page.

  5. Verify that font sizes in single product tabs area and review form styling are correct. The expected styles can be found here. Tabs Area:

    Before After
    Screen Shot 2022-01-12 at 4 24 06 PM Screen Shot 2022-01-12 at 4 20 09 PM

    Review form:

    Before After
    Screen Shot 2022-01-12 at 4 24 17 PM Screen Shot 2022-01-12 at 4 19 55 PM

    ☝️ After vertical alignment of right column fixed, (applies) prices in bold, "sold by" alignment and text decoration fixed to match cart (Note: the vertical lines on the left of the after was a cropping mistake)

Center product cards (2022 Theme) #31626

  1. Verify the product cards in various places in the store, like in the Products and Product Category pages. Their alignment is now centered, font family is now sans-serif for the product titles as shown in the screenshot below:

    After → centered, product title is sans-serif, color is primary accent color. after

    Before → left aligned, title is serif, color is black (not obviously a link). before

Fix styling of "pay for order" form #31682

  1. Create a WooCommerce test site with WP 5.9 and Twenty Twenty-Two theme.
  2. Login to the Admin Dashboard and create an order that has "Pending payment" status.
  3. In the Order Details page, click on the "Customer payment page" link. It will take you to the "Pay for Order" page.
  4. Notice how the order details table looks like.
Before After
Screen Shot 2022-01-18 at 4 51 39 PM Screen Shot 2022-01-18 at 4 39 15 PM
Screen Shot 2022-01-18 at 4 51 19 PM Screen Shot 2022-01-18 at 4 49 34 PM

2022 Theme: Fix Search Blocks #31687

  1. Set up a WooCommerce test site using WP 5.9 and the Twenty Twenty-Two theme.
  2. In either a new or existing page, add the WP "Search" block.
  3. Verify how the WP Search box looks like.
  4. In either a new or existing page, add the WP "Product Search" block.
  5. Verify how the WP "Product Search" box looks like.
  6. In the Shop page, click on one of the products.
  7. Verify that the "magnifier" icon at the top right of the product image is as expected (see screenshot below).
Before After
Screen Shot 2022-01-19 at 12 05 04 PM Screen Shot 2022-01-19 at 12 03 44 PM
Screen Shot 2022-01-19 at 12 04 45 PM Screen Shot 2022-01-19 at 12 12 09 PM
Screen Shot 2022-01-19 at 12 04 55 PM Screen Shot 2022-01-19 at 12 03 29 PM

WooCommerce API Updates:

Add status field in the Coupons API

  1. Add a new coupon in wp-admin → Coupons → Add New.
  2. Publish the coupon (since only published coupons will be available in the API response).
  3. In the API, run GET /wp-json/wc/v3/coupons.
  4. Confirm that the status field is available in the API response.
Clone this wiki locally