woocommerce/plugins/woocommerce-blocks/docs/internal-developers/testing/releases/320.md

126 lines
6.6 KiB
Markdown
Raw Normal View History

# Testing notes and ZIP for release 3.2.0
[![Create Todo list](https://raw.githubusercontent.com/senadir/todo-my-markdown/master/public/github-button.svg?sanitize=true)](https://git-todo.netlify.app/create)
Zip file: [woocommerce-gutenberg-products-block.zip](https://github.com/woocommerce/woocommerce-gutenberg-products-block/files/5090607/woocommerce-gutenberg-products-block.zip)
## Cart & Checkout <!-- heading -->
### Order note <!-- heading -->
- [ ] Go to the Checkout block and check the 'Add a note to your order' checkbox.
- [ ] Introduce some text in the text area that appeared.
- [ ] Place the order and go to the admin, WooCommerce > Orders and verify the order has the note under Customer provided note.
### Autocapitalize address form fields <!-- heading -->
- [ ] Visit the Checkout page with a handheld device with Chrome for Android or iOS Safari.
- [ ] Navigate through the input fields in the address form.
- [ ] Verify when a field is focused, the keyboard shows capital letters by default according to the settings.
### JS-Rendered blocks inside Empty Cart <!-- heading -->
- [ ] Add the Cart block and switch to the Empty Cart edit mode.
- [ ] Replace the Newest products block with the All Products block. Feel free to add other JS-rendered blocks like a filter or a Reviews block.
- [ ] View the page in the frontend.
- [ ] Verify all blocks render correctly when the cart is empty.
- [ ] Try adding a product to the cart (so it switches to the Full Cart view) and removing it (so it switches back to the Empty Cart view).
- [ ] Verify the blocks still render correctly.
### Don't show sale badge if saving are negative <!-- heading -->
You will need Product Add-ons extension to test this. <!-- heading -->
- [ ] Add a product with a priced add on.
- [ ] Add the product to your cart, with the add on enabled.
- [ ] See that the price is shown without a negative discount value.
### Respect payment gateways order set by merchant <!-- heading -->
- [ ] Set up a few different payment methods.
- [ ] Reorder your payment methods how you like in WooCommerce > Settings > Payments, then click Save changes to persist.
- [ ] On front end, add stuff to cart and proceed to checkout.
- [ ] Payment methods should display using the order you chose.
- [ ] Complete a few test purchases to confirm that payment methods are still working and there are no regressions in checkout.
- [ ] Also test payment methods that may be hidden based on checkout state, e.g. make COD only available with specific shipping methods.
### Show Checkout block in Editor when 'guest checkout' is disabled <!-- heading -->
- [ ] Go to WooCommerce > Settings > Accounts & Privacy and uncheck Allow customers to place orders without an account.
- [ ] Edit a page with the Checkout block.
- [ ] Verify the whole Checkout block is rendered in the editor, instead of only showing the `You must be logged in to checkout. Click here to log in`. message.
### Remove generic payment methods icons <!-- heading -->
- [ ] Set up Stripe CC (Stripe extension) and Cheque (core) payment methods.
- [ ] Set up a page with checkout block, add stuff to cart.
- [ ] View checkout and confirm payment method tabs render and function correctly without icons.
### Error focus styles for inputs and select <!-- heading -->
- [ ] Go to the Checkout block and press 'Place order` without filling any form detail.
- [ ] Tab through the input fields under 'Shipping address' and verify the outline that appears on focus is red in text inputs and selects.
- [ ] Repeat the steps above at least with Storefront and Twenty Twenty and with Firefox, Chrome and Safari.
### Hide saved payment methods if their gateway is disabled <!-- heading -->
- [ ] Set up checkout block, Stripe CC payment method, check Enable Payment via Saved Cards.
- [ ] Complete a purchase with Stripe test card and check the `Save payment information to my account for future purchases.` checkbox on checkout.
- [ ] Go to WooCommerce > Settings > Payments and disable Stripe CC payment method.
- [ ] Add new stuff to cart, proceed to checkout.
- [ ] Scroll down and verify saved card (e.g. Visa ending in 4242 (expires 02/22)) is not there.
### Text overlap with errors and icons <!-- heading -->
- [ ] activate and set up Stripe CC, disable Inline Credit Card Form option.
- [ ] Add stuff to cart and proceed to checkout.
- [ ] Select stripe credit card payment, don't enter any card details.
- [ ] Click Place Order.
- [ ] Error messages shouldn't overlap with credit card icons.
### Dark mode support for fields and controls <!-- heading -->
- [ ] Test inputs, select, radio, checkbox, quantity selectors, and textarea of Cart and Checkout, they should have light colors and text should be readable.
- [ ] Switch the colors of your theme to a dark variation, you can do that in the customizer for storefront or dark mode for TwentyTwenty or TwentySeventeen.
- [ ] Switch the blocks to use dark colors in the blocks settings.
- [ ] Test inputs, select, radio, checkbox, quantity selectors, and textarea again, make sure nothing is broken and everything is visible.
### Use real previews for Cart and Checkout <!-- heading -->
- [ ] Preview the cart and checkout blocks inside the block inserter.
- [ ] You should see the actual block, not a white placeholder.
- [ ] Make sure the block is not very long and overflowing.
- [ ] Make sure the changes didn't leak to the actual block or the editor block, the block should not be cut.
## All Products <!-- heading -->
### Broken link for "No Products" placeholder
- [ ] In a store with no products (move them to trash).
- [ ] Create a new page and add the All Products block.
- [ ] Click on the Add new product link and verify it works.
### PHP Error notices
- [ ] Make sure you have WP_DEBUG set to true.
- [ ] Load a page that already contains a product data, so single product or All Products, either in the editor or frontend.
- [ ] Make sure no notices are printed to the page, you can check the source code or at the top of the page.
## Product Search <!-- heading -->
### Updated styling in Editor
- [ ] In the editor, confirm that Product Search input has borders.
- [ ] the input should be functional.
<!-- FEEDBACK -->
---
[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-blocks/issues/new?assignees=&labels=type%3A+documentation&template=--doc-feedback.md&title=Feedback%20on%20./docs/internal-developers/testing/releases/320.md)
<!-- /FEEDBACK -->