From 1b5c353f2178e870e03b005245280ec141f36dbb Mon Sep 17 00:00:00 2001 From: "github-actions[bot]" <41898282+github-actions[bot]@users.noreply.github.com> Date: Mon, 31 Oct 2022 16:10:27 +0100 Subject: [PATCH] Release: 8.5.2 (#7535) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit * use full link for WordPress resources (#7211) Co-authored-by: Niels Lange * Empty commit for release pull request * update readme * add testing instructions * add zip file link * update testing instructions and changelog entry * Bumping version strings to new version. * Empty commit for release pull request * Update styles of the Filter by Attribute dropdown so it looks good in TT3 (#7506) * Use theme's body background color as the mini cart contents default background color (#7510) Co-authored-by: Albert Juhé Lluveras * Price Slider: use `currentColor` for the slider (#7527) * Fixed Price Slider Issue Located where the price slider was hard coded and replaced it. * fix CSS lint * use currentColor instead of hard-coded color for the slider of the Filter By Price block #7130 use currentColor instead of hard-coded color for the slider of the Filte By Price block * use currentColor instead of hard-coded color for the slider of the Filter By Price block #7130 use currentColor instead of hard-coded color for the slider of the Filte By Price block * remove background-color Co-authored-by: EmptySet-Exe <46509186+EmptySet-Exe@users.noreply.github.com> Co-authored-by: Niels Lange * Make price slider 'inactive' range half transparent so it looks better in dark themes (#7525) * Fix inconsistent button styling with TT3 (#7516) * fix inconsistent button styling with TT3 * use wc_wp_theme_get_element_class_name * add check to be sure that wc_wp_theme_get_element_class_name function exists * Fix Mini Cart Block global styles #7379 (#7515) * Fix Mini Cart Block global styles #7379 Fix Mini Cart Block global styles * add font_size * Empty commit for release pull request * add changelog and testing instructions * add zip link for testing * Bumping version strings to new version. Co-authored-by: Seghir Nadir Co-authored-by: Niels Lange Co-authored-by: github-actions Co-authored-by: Luigi Co-authored-by: Albert Juhé Lluveras Co-authored-by: Tung Du Co-authored-by: EmptySet-Exe <46509186+EmptySet-Exe@users.noreply.github.com> --- .../testing/releases/852.md | 81 +++++++++++++++++++ 1 file changed, 81 insertions(+) create mode 100644 docs/internal-developers/testing/releases/852.md diff --git a/docs/internal-developers/testing/releases/852.md b/docs/internal-developers/testing/releases/852.md new file mode 100644 index 00000000000..64d442e6fc6 --- /dev/null +++ b/docs/internal-developers/testing/releases/852.md @@ -0,0 +1,81 @@ +# Testing notes and ZIP for release 8.5.2 + +Zip file for testing: [woocommerce-gutenberg-products-block.zip](https://github.com/woocommerce/woocommerce-blocks/files/9901527/woocommerce-gutenberg-products-block.zip) + +## Feature plugin and package inclusion in WooCommerce + +### Fix Mini Cart Global Styles. [7515](https://github.com/woocommerce/woocommerce-blocks/pull/7515) + + +1. Enable TT3 theme. +2. Go to Appearance > Site Editor and replace the header with `WooCommerce Essential Header | Light` pattern. +3. Save and visit the frontend. +4. Hover over the Mini Cart and be sure that the font size doesn't change. +5. Edit some settings related to the Mini Cart Global Styles. +6. Be sure that the settings are reflected correctly on the editor and frontend side. + +### Fix inconsistent button styling with TT3. ([7516](https://github.com/woocommerce/woocommerce-blocks/pull/7516)) + + +| Before | After | +| ------ | ----- | +|![image](https://user-images.githubusercontent.com/4463174/198559087-b24ceeb2-61ba-488f-84a0-f87d6b2bc965.png)|![image](https://user-images.githubusercontent.com/4463174/198559394-b3e377d5-3e6e-4f3e-9ea4-282fd02fe923.png)| + +1. Enable TT3. +2. Create a new post/page and add the `All Product` block and the `Product Categories` block. +3. Save. +4. Visit the post/page via incognito mode and be sure that all the buttons have the same style. + +### Make the Filter by Price block range color dependent of the theme color. [7525](https://github.com/woocommerce/woocommerce-blocks/pull/7525) + +| Theme | Before | After | +| --- | ------ | ----- | +| Storefront | ![imatge](https://user-images.githubusercontent.com/3616980/198656336-463dd2fe-4329-4d5e-8305-43f8375a0077.png) | ![imatge](https://user-images.githubusercontent.com/3616980/198666606-aa3c443b-0e21-4474-b6d2-084280ec557b.png) | +| TT2 (dark) | ![imatge](https://user-images.githubusercontent.com/3616980/198658810-b429e817-7685-4a4c-afbc-eb57b2a72543.png) | ![imatge](https://user-images.githubusercontent.com/3616980/198666776-7dfb3663-ace5-40ff-91e5-87571b6767a0.png) | +| Bricksy | ![imatge](https://user-images.githubusercontent.com/3616980/198661164-3d84c0e5-c27b-40b8-82df-d8db319d4c50.png) | ![imatge](https://user-images.githubusercontent.com/3616980/198667122-05c29bf8-534f-4409-8577-572b44d782f5.png) | +| TT3 (default) | ![imatge](https://user-images.githubusercontent.com/3616980/198665415-584ac7eb-3c20-4d35-a1a6-6501cc932bad.png) | ![imatge](https://user-images.githubusercontent.com/3616980/198666131-2e641add-3918-4447-8260-dc8c9eefc684.png) | +| TT3 (Pilgrimage) | ![imatge](https://user-images.githubusercontent.com/3616980/198665030-cba725ec-a420-4184-98bf-3ace4e639e6f.png) | ![imatge](https://user-images.githubusercontent.com/3616980/198667488-b03bb985-8304-4f7c-86b9-5a6bb3f073f9.png) | + +1. Add the Filter by Price and the All Products blocks in the same page. +2. Visit the page in the frontend and move the price slider thumbs. +3. Verify there is enough contrast between the "active" part of the slider and the "inactive" one (see screenshots above). + + +### Filter by Price block: fix price slider visibility on dark themes. [7527](https://github.com/woocommerce/woocommerce-blocks/pull/7527) + +| | With dark background | With light background | +|----------------|----------------------|-----------------------| +| Before this PR |![Screen Capture on 2022-10-28 at 17-10-01](https://user-images.githubusercontent.com/4463174/198670636-61618ba7-7160-4674-be03-d8245a1a8209.gif)|![Screen Capture on 2022-10-28 at 17-11-48](https://user-images.githubusercontent.com/4463174/198671568-57fa5e44-4eb1-4ad1-82b8-51e2d4a7e0f8.gif)| +| With this PR |![Screen Capture on 2022-10-28 at 17-08-35](https://user-images.githubusercontent.com/4463174/198669729-a206b68d-0d01-41a3-8117-1a8015aed0a5.gif)|![Screen Capture on 2022-10-28 at 17-02-05](https://user-images.githubusercontent.com/4463174/198665985-3ae65415-e997-4c9c-a146-e07947f5fc68.gif)| + + +1. Enable TT2. +2. Add the Filter by Price and All Products blocks inside a Columns block into a post or page. +3. Change the background color of the Filter by Price column to a dark color. Change the text color to a light color. +4. Notice the price slider is visible. + +### Update the Mini Cart block drawer to honor the theme's background. [7510](https://github.com/woocommerce/woocommerce-blocks/pull/7510) + +1. Download and activate [TT3](https://github.com/WordPress/twentytwentythree) select the Pilgrimage style variation (see screenshot below). +2. Add the Mini Cart block to a post or page. +3. In the frontend, click on the Mini Cart button to open the drawer. +4. Verify the background is dark and text can be read properly. +5. Back in the editor, select the Mini Cart block and press on `Edit Mini Cart template part` in the sidebar. That will open the template editor. +6. Verify text is legible there as well: +![imatge](https://user-images.githubusercontent.com/3616980/198266198-9a607821-cb5b-47e5-90ec-b0cd64ca34e3.png) +7. Try with all other TT3 theme variations and verify text can be properly read in all of them. +8. Repeat all steps above with TT2. + +### Add white background to Filter by Attribute block dropdown so text is legible in dark backgrounds. [7506](https://github.com/woocommerce/woocommerce-blocks/pull/7506) + +| Before | After | +| ------ | ----- | +| ![imatge](https://user-images.githubusercontent.com/3616980/198288809-7f575c00-72f1-41e7-8a19-1cf2c9e2b3b7.png) | ![imatge](https://user-images.githubusercontent.com/3616980/198288636-225716da-6a6d-4db2-ad03-5dd404ea61d7.png) | +| ![imatge](https://user-images.githubusercontent.com/3616980/198288969-c5619a4b-a16f-4d39-815d-a6ebd336cc40.png) | ![imatge](https://user-images.githubusercontent.com/3616980/198289132-6066cb6d-03c6-4f5b-a791-69da2e1db95c.png) | + + +1. Download and activate [TT3](https://github.com/WordPress/twentytwentythree). +2. Add the All Products block with the Filter by Attribute block next to it in a post or page. +2. Visit the post or page and interact with the Filter by Attribute block. +3. Verify the background of the input has white background, so text is legible. +