Skip to content

Release Testing Instructions WooCommerce 6.7

Alejandro López Ariza edited this page Jul 12, 2022 · 33 revisions

WooCommerce 6.7 includes:


WooCommerce Blocks Updates (#33338, #33514)

Workflow: WooCommerce Product Blocks

Blocks 7.7.0

Zip file for testing: woocommerce-gutenberg-products-block.zip

Feature plugin and package inclusion in WooCommerce

Add the Fixed image and Repeated image media controls to the Featured Product block. (6344)

  1. Create a new page and add a Featured Product.
  2. On the block settings go to Media Settings and toggle Fixed image and Repeated image and save.
  3. Check the rendered product on the frontend is correct and matches the one on the edit page.
  4. Edit the block again, repeat the steps above with different combinations on Fixed image, Repeated image and any other configuration.

Remove bold styles from All Products block. (6436)

Before After
image image
  1. Create a post or page and add the All Products block. Optionally, edit the inner blocks and add the Product Summary inner block (this will make the issue more visible).
  2. Preview the post in the frontend.
  3. Verify product price and product summary are not bold.
  4. Verify there are no regressions in the All Products block and in the Shop page.

Blocks 7.8.0

Zip file for testing: woocommerce-gutenberg-products-block.zip

Feature plugin and package inclusion in WooCommerce

Filter Products by Price: Decrease price slider step sequence from 10 to 1. (6486)

  1. Create a new page and add a "Filter Products by Price" block plus the "All Products" to the page.
  2. Save and preview the site on the Frontend e.g. via "Preview > Preview in new tab".
  3. Interact with the price slider and confirm the price slider now increments in steps of 1 instead of 10.
  4. Smoke test to ensure all other "Filter Products by Price" is still working as expected.

Add the Fixed image and Repeated image media controls to the Featured Category block. (6440)

  1. Create a new page and add a Featured Category block, select a Category and, if it doesn't have an image, set one with the Replace button in the toolbar.
  2. On the block settings go to Media Settings and toggle Fixed image and Repeated image and save.
  3. Check the rendered category on the frontend is correct and matches the one on the edit page.
  4. Add a gradient overlay, save, and check the gradient is rendered on the frontend.
  5. Edit the block again, repeat the steps above with different combinations on Fixed image, Repeated image and any other configuration.
  6. Repeat steps 1-5 for the Featured Product block.

Featured Item Blocks: Fix an issue where the default color could be overridden by a theme, and where custom colors where not applied correctly. (6492)

Before After
before after
  1. Activate the Storefront theme.
  2. Add the Featured Product block to the page.
  3. Select a product.
  4. Notice that the default color of the text inside should be white.
  5. Change the color using the picker to a custom one (not included in the default palette).
  6. The color of the text should change.
  7. Repeat steps 2–6 with the Featured Category block.

Fix: All Products block: New product is missing in the Cart block if Redirect to the cart page after successful addition is enabled. (6466)

  1. Go to WooCommerce > Settings > Products > check both 'add to cart' behaviors to redirect and use AJAX, then save
  2. On the home page, add the All Products block
  3. On the front-end, click "add to cart" for any product
  4. See the page is redirected to the Cart page and the Cart block contains the newly added product.

Add support for Font size and Font family for the Mini Cart block. (6396)

Before After
before_now after_now
  1. Activate a block theme, like Twenty Twenty Two
  2. Create a new page, and add the Mini Cart block
  3. Check if the Typography option is available for the block
  4. Check if the Font size and Font family options work correctly both in the editor and on the frontend

2b. After testing the above, try the same with the Mini Cart block added via the FSE editor (for example in the header)

Set the default value for focalPoint on block.json. (6499)

Screenshot 2022-05-31 at 12 31 54
  1. Create a new page and add a Featured Product or a Featured Category block and open the console.
  2. Save the page and refresh the editor.
  3. Click on the added block, edit some settings and check the error shown on the screenshot above does not appear.
  4. Edit the focal point, save the block and check the block is rendered correctly on the edit page and on the frontend.

Featured items: ensure valid DOM nesting in inspector controls. (6501)

Screenshot 2022-05-31 at 15 45 53 Screenshot 2022-05-31 at 14 28 01
  1. Create a new page and add a Featured Product or a Featured Category block and open the console.
  2. Click on the added block, edit some settings and check the error shown on the screenshot above does not appear.

Migrate Featured Items Blocks to TypeScript. (6439)

  1. Add the Featured Product block to a page
  2. Compare its functionality with the same block before these changes. Non-exhaustive list:
    • When added, it shows a full-width selection dropdown to choose the product
    • After choosing the product and clicking "Done", a loading spinner appears and the product is loaded
    • All the info are displayed correctly (default image, title, description, price, call to action)
    • The block toolbar shows the same tools (duotone, alignment, cropping/replacing, editing)
    • The block sidebar shows the same options and they all work correctly (colors, content, media settings, etc.); note that the “border” does not currently work.
    • The block appears resizable and resizing works the same way.
  3. Verify the same for the Featured Category block.

Refactor: Featured product and Featured category classes. (6443)

  1. Create a page and add a Featured Category block.
  2. Save the page and check it renders correctly the default config in the frontend.
  3. Edit the page and make some changes to the block (duotone, padding, overlay, focal point, fixed/repeated image etc.).
  4. Save the page and check it renders correctly with the new settings.
  5. Repeat steps 1-4 with the Featured Product block.

Blocks 7.8.1

Zip file for testing: woocommerce-gutenberg-products-block.zip

Feature plugin and package inclusion in WooCommerce

Fix PHP notice in Mini Cart when prices included taxes. (6537)

  1. Go to WooCommerce > Settings and check Enable tax rates and calculations.
  2. Go to the Tax tab in the settings and check Yes, I will enter prices inclusive of tax and Display prices during cart and checkout: Including tax.
  3. Add the Mini Cart block to a post or page.
  4. Visit that post or page in the frontend, and verify there isn't a PHP notice.
Before After
Screenshot showing a PHP warning Screenshot showing no PHP warning

Blocks 7.8.2

Zip file for testing: woocommerce-gutenberg-products-block.zip

Feature plugin and package inclusion in WooCommerce

Replace instances of wp_is_block_theme() with wc_current_theme_is_fse_theme(). (6590)

Templates logic:

  1. With a block theme.
  2. Go to Appearance > Editor and verify you can modify the WooCommerce templates: Products by Tag, Products by Category, Single Product or Product Catalog (don't test Product Search template yet).
  3. Do some smoke testing: make an edit, save it, go to the frontend and verify the change has been applied, restore the template, etc.).

Product Search template:

  1. With a block theme.
  2. Go to Appearance > Editor and verify you can modify the Product Search Results template.
  3. Do some smoke testing: make an edit, save it, go to the frontend and verify the change has been applied, restore the template, etc.).

Mini Cart link:

  1. With a block theme.
  2. In a post or page, add the Mini Cart block.
  3. In the sidebar, click on Edit Mini Cart template part(opens in a new tab).
  4. Verify you land in the template part editor, editing the Mini Cart block.

Blocks 7.8.3

Zip file for testing: woocommerce-gutenberg-products-block.zip

Feature plugin and package inclusion in WooCommerce

Fix images hidden by default in Product grid blocks after WC 6.6 update. (6599)

  1. With WC core 6.5.1 and WC Blocks disabled, add a Handpicked Products block to a post or page.
  2. Hide the Product price and Product rating using the sidebar toggles.
  3. Publish the post or page.
  4. Update WC core to 6.7.0.
  5. Verify images are visible by default.
  6. Verify you can still toggle the images.

WooCommerce Core Updates

WC Admin Experiments (#33452, #33268, #33395, #33448, #33428, #33178)

Workflow: WooCommerce Core

  1. Start with a fresh install of WooCommerce
  2. Install and activate the latest WooCommerce Test Helper plugin

Scenario 1: Spotlight tour is shown when adding a new physical product from template

  1. Enable experimental-product-tour feature flag via WooCommerce Admin Test Helper
  2. Go to Tools > WCA Test Helper > Experiments and add woocommerce_products_tour to treatment
  3. Go to Woocommerce > Home
  4. Click Add my products task
  5. Select "Start with a template"
  6. Select "Physical product"
  7. Confirm spotlight tour is shown with the following features.
  8. The number of steps is always visible.
  9. The number of steps is reduced to 8.
  10. The page scrolls up and down automatically based on the information highlighted.
  11. Complete the step tour
  12. Click the "Enable guided mode" button
  13. Observe that the tour is shown again.
  14. Create another product with another product type
  15. Observe that the "Enable guided mode" button is NOT displayed.

Scenario 2: Spotlight tour follows the referenced element even when it moves or resizes

  1. Enable experimental-product-tour feature flag via WooCommerce Admin Test Helper
  2. Go to Tools > WCA Test Helper > Experiments and add woocommerce_products_tour to treatment
  3. Go to Woocommerce > Home
  4. Click Add my products task
  5. Select "Start with a template"
  6. Select "Physical product"
  7. Once the spotlight tour has started, open your browser console and enter the following snippet to move the product title in the UI:
document.querySelector("input.wp-tour-kit-spotlit").parentElement.insertBefore(document.createElement("p", "a"), document.querySelector("input.wp-tour-kit-spotlit"))
  1. Check that the spotlight follows the "product title" field even though it was moved
  2. Continue the walkthrough until you reach the "description" field, then enter a big text so that it exceeds the default element size
  3. Check that the spotlight is resized to be aligned with the "description" field Note: please find a recording to get a better understanding of the behaviour of this change.

Scenario 3: Spotlight tour is shown again after skipping it and reloading the page

  1. Enable experimental-product-tour feature flag via WooCommerce Admin Test Helper
  2. Go to Tools > WCA Test Helper > Experiments
  3. Add woocommerce_products_tour to treatment
  4. Go to WooCommerce > Home > Add my products > Start with a template > Physical product
  5. Observe that spotlight tour is displayed and dismiss it.
  6. Switch to the text tab for product description
  7. Reload the page
  8. Observe that spotlight tour is displayed again
  9. Click "next" button
  10. Switch to the Visual tab
  11. Observe that the spotlight tour is still shown and no typeError is shown in dev tools.

Scenario 4: Product types appear as cards instead of a list of stacked items when adding new products while the woocommerce_products_task_layout_card_v2 experiment is enabled

  1. Navigate to Tools > WCA Test Helper > Experiments and add woocommerce_products_task_layout_card_v2 to treatment
  2. Make sure your site has woocommerce_allow_tracking option set to yes
  3. Go to WooCommerce > Home > Add my products
  4. Product types are listed as cards (note than when the experiment is not in treatment, then the product types appear as a list of items)

Scenario 5: Purchase task should be added to experimental task lists

  1. Proceed through OBW, and select the paid theme "Blooms" on the final step.
  2. Be sure to opt into Marketing
  3. When brought to the Homescreen, notice that the "Add Blooms to my store" task appears.
  4. Go to Tools > WCA Test Helper > Experiments and add woocommerce_tasklist_setup_experiment_1_* to treatment
  5. Refresh the Homescreen.
  6. Note that the purchase task exists
  7. Go to Tools > WCA Test Helper > Experiments and add the woocommerce_tasklist_setup_experiment_2_* experiment to treatment
  8. Refresh the homescreen.
  9. Note the purchase task exists

Products (#27804, 33397, #32763, #32971)

Workflow: WooCommerce Core

Scenario 1: The image in the modal is the active image when opening a product with multiple images in the gallery

  1. Create a product with multiple images in the gallery
  2. Head to the product page as a shopper (where you can add the product to your cart)
  3. Click the magnifier button close to the product image
  4. Verify that you see a larger version of the picture where you would be able to scroll to the left/right in order to see the other pictures in the gallery
  5. Ensure the image that opens when you click the magnifier button is the same one that was selected before clicking it

Scenario 2: The product description from the product templates now have more realistic examples

  1. Go to add my products
  2. Click Start with a template
  3. Choose Physical product
  4. Observe that the Hoodie in sweatshirt fabric made from a cotton blend. text is shown in the product description

Scenario 3: Product reviews should have a dedicated location within WooCommerce

  1. Add some products
  2. Add some reviews to those products
  3. Navigate to Products > Reviews 3.1. Product reviews and review replies are displayed on a list table 3.2. You can filter (by Type, Rating, and Product) the reviews 3.3. You can sort the reviews 3.4. You can search the reviews 3.5. You can moderate the reviews
  4. Navigate to the WordPress Comments page 4.1. Product reviews and review replies are not displayed
  5. Navigate to the WooCommerce > Home page and expand the reviews section 5.1. The Manage all reviews link redirects to the new Products > Reviews page

Setup Wizard (#33362, #33292, #33358)

Workflow: WooCommerce Core

  1. On a fresh install, start the onboarding wizard.

Scenario 1: The onboarding marketing checkbox should be default to false

  1. See that the marketing checkbox is not ticked by default

Scenario 2: Continue button should be disabled when email is not entered

  1. Fill in details like Address, Country, City, and Postcode
  2. Check the Get tips, product updates and inspiration straight to your mailbox. checkbox
  3. Ensure the email textbox is empty
  4. Observe that "Please enter your email address to subscribe" error is displayed, and "Continue" button is disabled

Scenario 3: The "Yes, count me in!" button should not be loading when user decides to decline enabling usage tracking

  1. Skip setup wizard
  2. Click the first button No thanks
  3. Observe that only No thanks button is loading and Yes, count me in! button is disabled

Themes (#33308, #32840)

Workflow: WooCommerce Core

Scenario 1: Design of Single Product template in block themes should look right when product had no reviews or additional info

  1. Create a new product and make sure it has no description, no reviews and no additional information.
  2. With TT2 theme, visit that product in the frontend.
  3. Verify the footer doesn't render on top of the single product template.

Scenario 2: Twenty Twenty-Two theme should not break when updating modifying the alignment of a Classic Template Block

  1. With Twenty Twenty-Two, edit the Product Catalog template.
  2. Select the Group block that contains the Classic Template.
  3. Set an arbitrary background color.
  4. On a new tab, go to the shop page on the front end, see the background is set and the layout doesn't break.
  5. Back to the Site Editor tab, select the Classic Template block, and set the alignment to Wide.
  6. See it reflects on the front end.

WC Admin (#33064, #33241, #33270, #33434)

Workflow: WooCommerce Core

Scenario 1: Order/product count should be correct even when order status changes or product stock is set to zero

  1. Create a couple of products and orders
  2. Go to WooCommerce > Home page and notice how two request were made to the WC api (one to /wc/v3/products and one to /wc/v3/orders)
  3. Hide the task list
  4. The Orders and Stock panel should show up
  5. If you change an order to processing, the correct number should show up in the panel header
  6. If you enable stock management on a product and set stock to zero, the stock panel should show products

Scenario 2: Navigation nudge note should not be added when while using the previous WC navigation

  1. Make sure you don't update to 6.7 but you directly install 6.7 from scratch (a new fresh site might be needed for this)
  2. Do not enable the new navigation
  3. Visit the homescreen
  4. Make sure the navigation note ("You now have access to the WooCommerce navigation") is not added

Scenario 3: "Built by WooCommerce" label should be added to Pinterest

  1. Make sure woocommerce_show_marketplace_suggestions is set to no in wp_options table
  2. Navigate to http://your-site/wp-admin/admin.php?page=wc-admin&task=marketing
  3. Confirm the Pinterest has a "Built by WooCommerce" label

Scenario 4: Admin should be able to see the Payments settings without any issue

  1. Install and activate the "Paytm Payments" plugin
  2. Go to WC > Settings > Payments
  3. No fatal errors are found

Others

Workflow: WooCommerce Core

Scenario 1: Filtering of cookie flags should be allowed (#33219)

  1. Put items in cart
  2. Verify in your browser that valid set-cookie headers exist in the HTTP response

Scenario 2: Report days calculation should be correct for DST based timezones (#33036)

  1. Select a timezone (US, London, etc) that utilizes DST in your site's General settings
  2. Install an email logging plugin
  3. Go to the Revenue report
  4. Select October 1 - October 31 as a custom date
  5. Click "Download" to export the report
  6. Check your email logs to make sure the report is sent and can be downloaded
  7. Check that the number of "days" is correct in the summary numbers at the bottom of the Revenue report

Scenario 3: Categories should load as expected in Analytics (#33164)

  1. Create some categories
  2. Place some orders with products in various categories
  3. Navigate to Analytics->Categories
  4. Make sure the categories and category names load as expected

Scenario 4: Navigation Exploratory Test (#33027)

  1. Enable the Navigation at WooCommerce -> Settings -> Advanced -> Features
  2. Perform brief exploratory testing in WooCommerce Admin to check that no errors appear as part of this new Navigation
Clone this wiki locally