Improve smoke testing docs (https://github.com/woocommerce/woocommerce-blocks/pull/3351)
* Improve smoke testing docs and change location in docs * add smoke testing to release pull request checklists
This commit is contained in:
Darren Ethier
GitHub
parent
4d82f1c14c
commit
6f08922ea0
|
|
@ -81,5 +81,6 @@ This only needs done if the patch release needs to be included in WooCommerce Co
|
|||
- Create the pull request in the [WooCommerce Core Repository](https://github.com/woocommerce/woocommerce/) that [bumps the package version](https://github.com/woocommerce/woocommerce/blob/master/composer.json) for the blocks package to the version being pulled in.
|
||||
- The content for the pull release can follow [this example](https://github.com/woocommerce/woocommerce/pull/27676). Essentially you link to all the important things that have already been prepared. Note, you need to make sure you link to all the related documents for the feature plugin releases since the last package version bump in Woo Core.
|
||||
- Run through the testing checklist to ensure everything works in that branch for that package bump. **Note:** Testing should include ensuring any features/new blocks that are supposed to be behind feature gating for the core merge of this package update are working as expected.
|
||||
- Testing should include completing the [Smoke testing checklist](../docs/testing/smoke-testing.md). It's up to you to verify that those tests have been done.
|
||||
- Verify and make any additional edits to the pull request description for things like: Changelog to be included with WooCommerce core, additional communication that might be needed elsewhere, additional marketing communication notes that may be needed etc.
|
||||
- After the checklist is complete and the testing is done, it will be up to the WooCommerce core team to approve and merge the pull request.
|
||||
|
|
|
|||
|
|
@ -77,6 +77,7 @@ This only needs to be done if this release is the last release of the feature pl
|
|||
* [ ] Create a pull request for updating the package in the [WooCommerce Core Repository](https://github.com/woocommerce/woocommerce/) that [bumps the package version](https://github.com/woocommerce/woocommerce/blob/master/composer.json) for the blocks package to the version being pulled in.
|
||||
* The content for the pull release can follow [this example](https://github.com/woocommerce/woocommerce/pull/27676). Essentially you link to all the important things that have already been prepared. Note, you need to make sure you link to all the related documents for the feature plugin releases since the last package version bump in Woo Core.
|
||||
* Run through the testing checklist to ensure everything works in that branch for that package bump. **Note:** Testing should include ensuring any features/new blocks that are supposed to be behind feature gating for the core merge of this package update are working as expected.
|
||||
* Testing should include completing the [Smoke testing checklist](../docs/testing/smoke-testing.md). It's up to you to verify that those tests have been done.
|
||||
* Verify and make any additional edits to the pull request description for things like: Changelog to be included with WooCommerce core, additional communication that might be needed elsewhere, additional marketing communication notes that may be needed etc.
|
||||
* After the checklist is complete and the testing is done, it will be up to the WooCommerce core team to approve and merge the pull request.
|
||||
|
||||
|
|
|
|||
|
|
@ -6,7 +6,6 @@ This folder contains documentation for developers and contributors looking to ge
|
|||
| ---------------------------------------------------------------- | ----------------------------------------------------------------------------------- |
|
||||
| [Getting Started](getting-started.md) | This doc covers tooling and creating builds during development. |
|
||||
| [Coding Guidelines](coding-guidelines.md) | This doc covers development best practices. |
|
||||
| [Smoke Testing](smoke-testing.md) | This doc explains how to smoke test key Blocks functionality. |
|
||||
| [JavaScript Testing](javascript-testing.md) | This doc explains how to run automated JavaScript tests. |
|
||||
| [Developing Components (& Storybook)](components.md) | This doc outlines where our reusable components live, and how to test them in Storybook. |
|
||||
| [Block Script Assets](block-assets.md) | This doc explains how Block Script Assets are loaded and used. |
|
||||
|
|
|
|||
|
|
@ -1,32 +0,0 @@
|
|||
# Smoke Testing
|
||||
|
||||
When testing builds the following things should be tested to ensure critical parts
|
||||
of the Blocks plugin are still functional.
|
||||
|
||||
## Prerequisites
|
||||
|
||||
To make future testing more efficient, we recommend setting up some Blocks in advance so you can repeat tests on them whenever smoke testing.
|
||||
|
||||
1. Have a page with all regular and SSR blocks (such as the product grids) setup and configured.
|
||||
2. Have a page with the All Products Block, and some Filter Blocks, setup to test that functionality in isolation. Using the columns block here too is a good idea to keep things organized.
|
||||
|
||||
## Editor Tests
|
||||
|
||||
1. Ensure all WooCommerce Blocks are shown in the Block Inserter.
|
||||
2. Check existing Blocks;
|
||||
- Do they look correct?
|
||||
- Can you change options/attributes in the Block inspector?
|
||||
- Are changes persisted on save?
|
||||
- Is the Browser error console free from errors/notices/warnings?
|
||||
3. Test inserting various blocks into the editor;
|
||||
- All Products Blocks (this is powered by the Store API)
|
||||
- Featured Product (this is powered by the REST API)
|
||||
- On Sale Products (this is SSR)
|
||||
- Is the Browser error console free from errors/notices/warnings after inserting them?
|
||||
- Do they persist and continue to display correctly after save/refresh?
|
||||
|
||||
## Frontend Tests
|
||||
|
||||
1. Do the blocks on your pre-made pages render correctly?
|
||||
2. Test interaction with blocks, such as the All Products Block and filters.
|
||||
3. Is the Browser error console free from errors/notices/warnings?
|
||||
|
|
@ -10,7 +10,7 @@ Additionally, ensure your test environment includes a mixture of existing blocks
|
|||
|
||||
## Testing Checklist
|
||||
|
||||
1. Run through the [smoke testing checklist](../contributors/smoke-testing.md) to ensure critical features are still functional.
|
||||
1. Run through the [smoke testing checklist](../testing/smoke-testing.md) to ensure critical features are still functional.
|
||||
2. Verify the appearance of blocks on the frontend using the latest official theme. This includes new Twenty-X themes introduced every year.
|
||||
|
||||
## Updating `readme.txt`
|
||||
|
|
|
|||
|
|
@ -0,0 +1,9 @@
|
|||
# Testing
|
||||
|
||||
This folder contains documentation around manual testing of WooCommerce Blocks.
|
||||
|
||||
| Document | Description |
|
||||
| ---------------------------------------------------------------- | ----------------------------------------------------------------------------------- |
|
||||
| [Smoke Testing](smoke-testing.md) | This doc explains how to smoke test key Blocks functionality. |
|
||||
| [Cart and Checkout Testing](./cart-checkout/readme.md) | Various testing flows for Cart and Checkout Blocks |
|
||||
| [Releases](./releases/README.md) | We document all testing flows for releases in this folder |
|
||||
|
|
@ -0,0 +1,134 @@
|
|||
# Smoke Testing
|
||||
|
||||
We generally consider smoke testing using this definition [from Wikipedia](https://href.li/?https://en.wikipedia.org/wiki/Smoke_testing_(software)):
|
||||
|
||||
> **Smoke Testing** is a subset of test cases that cover the most important functionality of a component or system, used to aid assessment of whether the main functions of the software appear to work correctly. It is a set of tests run on each new build of a product to verify that the build is testable before the build is released into the hands of the test team
|
||||
|
||||
When testing builds the following things should be tested to ensure critical parts of the Blocks plugin are still functional.
|
||||
|
||||
## Setup
|
||||
|
||||
To make future testing more efficient, we recommend setting up some Blocks in advance so you can repeat tests on them whenever smoke testing.
|
||||
|
||||
### 1. Create a page with all regular and SSR blocks (such as the product grids) setup and configured.
|
||||
|
||||
<details>
|
||||
<summary>You can copy and paste the following code into a new page to add all the blocks (click):</summary>
|
||||
|
||||
```html
|
||||
<!-- wp:woocommerce/featured-product {"editMode":false,"productId":15} -->
|
||||
<!-- wp:button {"align":"center"} -->
|
||||
<div class="wp-block-button aligncenter"><a class="wp-block-button__link" href="https://ephemeral-aljullu-20200929.atomicsites.blog/product/beanie/">Shop now</a></div>
|
||||
<!-- /wp:button -->
|
||||
<!-- /wp:woocommerce/featured-product -->
|
||||
|
||||
<!-- wp:woocommerce/featured-category {"editMode":false,"categoryId":16} -->
|
||||
<!-- wp:button {"align":"center"} -->
|
||||
<div class="wp-block-button aligncenter"><a class="wp-block-button__link" href="https://ephemeral-aljullu-20200929.atomicsites.blog/product-category/clothing/">Shop now</a></div>
|
||||
<!-- /wp:button -->
|
||||
<!-- /wp:woocommerce/featured-category -->
|
||||
|
||||
<!-- wp:woocommerce/handpicked-products {"editMode":false,"products":[15,32,16]} /-->
|
||||
|
||||
<!-- wp:woocommerce/product-best-sellers /-->
|
||||
|
||||
<!-- wp:woocommerce/product-top-rated /-->
|
||||
|
||||
<!-- wp:woocommerce/product-new /-->
|
||||
|
||||
<!-- wp:woocommerce/product-on-sale /-->
|
||||
|
||||
<!-- wp:woocommerce/product-category {"categories":[16]} /-->
|
||||
|
||||
<!-- wp:woocommerce/product-tag /-->
|
||||
|
||||
<!-- wp:woocommerce/products-by-attribute {"attributes":[{"id":22,"attr_slug":"pa_color"}],"editMode":false} /-->
|
||||
|
||||
<!-- wp:woocommerce/product-categories /-->
|
||||
|
||||
<!-- wp:woocommerce/product-categories {"isDropdown":true} /-->
|
||||
|
||||
<!-- wp:woocommerce/reviews-by-product {"editMode":false,"productId":15} -->
|
||||
<div class="wp-block-woocommerce-reviews-by-product wc-block-reviews-by-product has-image has-name has-date has-rating has-content" data-image-type="reviewer" data-orderby="most-recent" data-reviews-on-page-load="10" data-reviews-on-load-more="10" data-show-load-more="true" data-show-orderby="true" data-product-id="15"></div>
|
||||
<!-- /wp:woocommerce/reviews-by-product -->
|
||||
|
||||
<!-- wp:woocommerce/reviews-by-category {"editMode":false,"categoryIds":[16]} -->
|
||||
<div class="wp-block-woocommerce-reviews-by-category wc-block-reviews-by-category has-image has-name has-date has-rating has-content has-product-name" data-image-type="reviewer" data-orderby="most-recent" data-reviews-on-page-load="10" data-reviews-on-load-more="10" data-show-load-more="true" data-show-orderby="true" data-category-ids="16"></div>
|
||||
<!-- /wp:woocommerce/reviews-by-category -->
|
||||
|
||||
<!-- wp:woocommerce/all-reviews -->
|
||||
<div class="wp-block-woocommerce-all-reviews wc-block-all-reviews has-image has-name has-date has-rating has-content has-product-name" data-image-type="reviewer" data-orderby="most-recent" data-reviews-on-page-load="10" data-reviews-on-load-more="10" data-show-load-more="true" data-show-orderby="true"></div>
|
||||
<!-- /wp:woocommerce/all-reviews -->
|
||||
|
||||
<!-- wp:woocommerce/product-search {"formId":"wc-block-product-search-0"} -->
|
||||
<div class="wp-block-woocommerce-product-search"><div class="wc-block-product-search"><form role="search" method="get" action="https://ephemeral-aljullu-20200929.atomicsites.blog/"><label for="wc-block-product-search-0" class="wc-block-product-search__label">Search</label><div class="wc-block-product-search__fields"><input type="search" id="wc-block-product-search-0" class="wc-block-product-search__field" placeholder="Search products…" name="s"/><input type="hidden" name="post_type" value="product"/><button type="submit" class="wc-block-product-search__button" label="Search"><svg aria-hidden="true" role="img" focusable="false" class="dashicon dashicons-arrow-right-alt2" xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewbox="0 0 20 20"><path d="M6 15l5-5-5-5 1-2 7 7-7 7z"></path></svg></button></div></form></div></div>
|
||||
<!-- /wp:woocommerce/product-search -->
|
||||
```
|
||||
</details>
|
||||
|
||||
|
||||
### 2. Create a page with the All Products Block, and some Filter Blocks, setup to test that functionality in isolation. Using the columns block here too is a good idea to keep things organized.
|
||||
|
||||
<details>
|
||||
<summary>You can copy and paste the following code into a new page to add all the blocks (click):</summary>
|
||||
|
||||
```html
|
||||
<!-- wp:columns -->
|
||||
<div class="wp-block-columns"><!-- wp:column {"width":33.33} -->
|
||||
<div class="wp-block-column" style="flex-basis:33.33%"><!-- wp:woocommerce/price-filter -->
|
||||
<div class="wp-block-woocommerce-price-filter is-loading" data-showinputfields="true" data-showfilterbutton="false" data-heading="Filter by price" data-heading-level="3"><span aria-hidden="true" class="wc-block-product-categories__placeholder"></span></div>
|
||||
<!-- /wp:woocommerce/price-filter -->
|
||||
|
||||
<!-- wp:woocommerce/attribute-filter {"attributeId":1,"heading":"Filter by Color","displayStyle":"dropdown"} -->
|
||||
<div class="wp-block-woocommerce-attribute-filter is-loading" data-attribute-id="1" data-show-counts="true" data-query-type="or" data-heading="Filter by Color" data-heading-level="3" data-display-style="dropdown"><span aria-hidden="true" class="wc-block-product-attribute-filter__placeholder"></span></div>
|
||||
<!-- /wp:woocommerce/attribute-filter -->
|
||||
|
||||
<!-- wp:woocommerce/attribute-filter {"attributeId":2,"heading":"Filter by Size"} -->
|
||||
<div class="wp-block-woocommerce-attribute-filter is-loading" data-attribute-id="2" data-show-counts="true" data-query-type="or" data-heading="Filter by Size" data-heading-level="3"><span aria-hidden="true" class="wc-block-product-attribute-filter__placeholder"></span></div>
|
||||
<!-- /wp:woocommerce/attribute-filter -->
|
||||
|
||||
<!-- wp:woocommerce/active-filters -->
|
||||
<div class="wp-block-woocommerce-active-filters is-loading" data-display-style="list" data-heading="Active filters" data-heading-level="3"><span aria-hidden="true" class="wc-block-active-product-filters__placeholder"></span></div>
|
||||
<!-- /wp:woocommerce/active-filters --></div>
|
||||
<!-- /wp:column -->
|
||||
|
||||
<!-- wp:column {"width":66.66} -->
|
||||
<div class="wp-block-column" style="flex-basis:66.66%"><!-- wp:woocommerce/all-products {"columns":3,"rows":3,"alignButtons":false,"contentVisibility":{"orderBy":true},"orderby":"date","layoutConfig":[["woocommerce/product-image"],["woocommerce/product-title"],["woocommerce/product-price"],["woocommerce/product-rating"],["woocommerce/product-button"]]} -->
|
||||
<div class="wp-block-woocommerce-all-products wc-block-all-products" data-attributes="{"alignButtons":false,"columns":3,"contentVisibility":{"orderBy":true},"isPreview":false,"layoutConfig":[["woocommerce/product-image"],["woocommerce/product-title"],["woocommerce/product-price"],["woocommerce/product-rating"],["woocommerce/product-button"]],"orderby":"date","rows":3}"></div>
|
||||
<!-- /wp:woocommerce/all-products --></div>
|
||||
<!-- /wp:column --></div>
|
||||
<!-- /wp:columns -->
|
||||
```
|
||||
|
||||
</details>
|
||||
|
||||
|
||||
### 3. Add the Cart and Checkout block to the relevant WooCommerce pages.
|
||||
|
||||
## Editor Tests
|
||||
|
||||
* [ ] Ensure all WooCommerce Blocks are shown in the Block Inserter.
|
||||
* [ ] Check behaviour of Blocks added to a previous saved page from earlier plugin version
|
||||
* [ ] Do they look correct?
|
||||
* [ ] Ensure there are no block invalidation errors for blocks added to a page in a prior version.
|
||||
* [ ] Can you change options/attributes in the Block inspector?
|
||||
* [ ] Are changes persisted on save?
|
||||
* [ ] Is the Browser error console free from errors/notices/warnings?
|
||||
* [ ] Test inserting various blocks into the editor
|
||||
* [ ] This can be verified by copying and pasting the code examples above. However, please do also test manually inserting the next three blocks as representative examples for related blocks.
|
||||
* [ ] All Products Blocks (this is powered by the Store API)
|
||||
* [ ] Featured Product (this is powered by the REST API)
|
||||
* [ ] On Sale Products (this is SSR)
|
||||
* [ ] Is the Browser error console free from errors/notices/warnings after inserting them?
|
||||
* [ ] Do they persist and continue to display correctly after save/refresh?
|
||||
|
||||
## Frontend Tests
|
||||
|
||||
* [ ] Do the blocks on your pre-made pages render correctly?
|
||||
* [ ] Are the blocks with user facing interactions working as expected without errors in the browser console or user facing errors (such as All Products block and filter blocks).
|
||||
* [ ] Do critical flows for the Cart and Checkout blocks work?
|
||||
* [ ] Address and shipping calculations
|
||||
* [ ] Payment with core payment methods
|
||||
* [ ] Payment with Stripe and saved payment methods
|
||||
* [ ] Payment with Express payment methods (Chrome Pay or Apple Pay)
|
||||
* [ ] Make sure you test with logged in user and in browser incognito mode.
|
||||
Loading…
Reference in New Issue