Zip file for testing: [woocommerce-gutenberg-products-block.zip](https://github.com/woocommerce/woocommerce-gutenberg-products-block/files/5918701/woocommerce-gutenberg-products-block.zip)
## Feature plugin and package inclusion in WooCommerce core
### Prevent "X-WC-Store-API-Nonce is invalid" error when going back to a page with the products block using the browser back button. #3770
1. Open your store in an incognito window.
2. Add an item to the cart from the products block.
3. Click on a link to go to the cart page.
4. Use the browser back button to go back to the page with the products block.
5. Add another item to the cart. If it successfully adds to the cart, the fix is working. If you see an error notice about the nonce, there is a problem.
### Ensure empty categories are correctly hidden in the product categories block. #3765
1. Add the Product Categories Block to a page
2. Make sure the "Show empty categories" setting is disabled
3. Edit a product and add it to a new category called "Test"
4. Save the product and see that the "Test" category appears in the Product Categories Block with 1 product
5. Edit the product again and set it's catalog visibility to hidden (this is in the panel with the update button).
6. Save the product and see that the "Test" category does not appear in the Product Categories Block.
7. Change the "Show empty categories" block's settings to true
8. Notice that the Test category is listed in the Product Categories Block with 0 products.
### Hide the All Products Block from the new Gutenberg Widget Areas until full support is achieved. #3737
1. Ensure Gutenberg feature plugin is enabled and you can see the new Widget Areas screen under Appearance > Widgets.
2. Go to the screen and try to insert "All Products", "Price Filter", "Attribute Filter", and "Active Filter" blocks. You shouldn't be able to see them in the inspector!
3. Edit a page and try to insert "All Products", "Price Filter", "Attribute Filter", and "Active Filter" blocks. It should work as expected.
### Legacy star-rating class name has been removed from Product rating block (inside All Products block). That element is still selectable with the .wc-block-components-product-rating class name. #3717
1. Update Storefront to version 3.4.0 or above.
2. Verify star icons look correct in the All Products block and show an icon rather than a character.
### Improved accessibility of product image links in the products block by using correct aria tags and hiding empty image placeholders. #3722
This test requires the browser dev tools to inspect rendered HTML.
1. Add an All Products Block to a page and make sure you have at least a product without an image
2. In the browser dev tools, choose slow 3G Network setting to see that the placeholder image is shown until the product image is loaded
3. Reset Network setting and check that product images have alt attributes using the browser dev tools inspector
4. Check that a product without an image displays a placeholder image with no alt attribute using the browser dev tools inspector
### Added missing wrapper div within FeaturedCategory and FeatureProduct blocks. #3746
This test requires the browser dev tools to inspect rendered HTML.
1. Add the Featured Category and Featured Product blocks on a page.
2. On the frontend, inspect the markup using the browser dev tools inspector.
3. Notice the inner elements (title, text, button) are wrapped with a `<div class="wc-block-featured-X__wrapper"></div>`
### Add missing aria-label for stars image in the review-list-item component. #3706
This test requires the browser dev tools to inspect rendered HTML.
1. Insert All reviews block into a page
2. Use the developer tools to inspect one of the review items in the Reviews list
3. Select the div containing the star image
4. Make sure it has role="img" & aria-label="Rated X out of 5"
5. Check that the child span has the same text content as the aria-label attribute
### Set correct text color in BlockErrorBoundry notices. #3738
This test requires a code edit to force an error.
1. Chose Storefront and set the background to black and text to white.
2. Force an error to the Cart or Checkout block. Add on line 74 throw new Error( 'test' ); in `assets/js/blocks/cart-checkout/cart/block.js`
### Design tweaks to the cart page (using Cart Block) which move the quantity picker below each cart item and improve usability on mobile. #3734
1. Make sure the cart page is setup with the Cart Block.
2. Add items to your cart, some with sale prices, add multiple items etc.
3. See that the subtotal for each item is shown below the item's name, and the overall total is shown to the right. (Overall total is item price * quantity).
[We're hiring!](https://woocommerce.com/careers/) Come work with us!
🐞 Found a mistake, or have a suggestion? [Leave feedback about this document here.](https://github.com/woocommerce/woocommerce-gutenberg-products-block/issues/new?assignees=&labels=type%3A+documentation&template=--doc-feedback.md&title=Feedback%20on%20./docs/testing/releases/440.md)
