Product Query: implement compatibility with Filter by Rating block (https://github.com/woocommerce/woocommerce-blocks/pull/7792)

* Product Query: implement compatibility with Filter by Rating block woocommerce/woocommerce-blocks#7631

Product Query: implement compatibility with Filter by Rating block

* address feedback

* address feedback

* add comment
This commit is contained in:
Luigi Teschio 2022-12-07 12:32:31 +01:00 committed by GitHub
parent 47aa2ae27b
commit 9436488da4
6 changed files with 160 additions and 10 deletions

View File

@ -354,6 +354,7 @@ class ProductQuery extends AbstractBlock {
'price_filter_query_args' => array( PriceFilter::MIN_PRICE_QUERY_VAR, PriceFilter::MAX_PRICE_QUERY_VAR ),
'stock_filter_query_args' => array( StockFilter::STOCK_STATUS_QUERY_VAR ),
'attributes_filter_query_args' => $attributes_filter_query_args,
'rating_filter_query_args' => array( RatingFilter::RATING_QUERY_VAR ),
);
}
@ -423,6 +424,7 @@ class ProductQuery extends AbstractBlock {
'price_filter' => $this->get_filter_by_price_query(),
'attributes_filter' => $this->get_filter_by_attributes_query(),
'stock_status_filter' => $this->get_filter_by_stock_status_query(),
'rating_filter' => $this->get_filter_by_rating_query(),
);
}
@ -715,5 +717,42 @@ class ProductQuery extends AbstractBlock {
return $query;
}
}
/**
* Return a query that filters products by rating.
*
* @return array
*/
private function get_filter_by_rating_query() {
$filter_rating_values = get_query_var( RatingFilter::RATING_QUERY_VAR );
if ( empty( $filter_rating_values ) ) {
return array();
}
$parsed_filter_rating_values = explode( ',', $filter_rating_values );
$product_visibility_terms = wc_get_product_visibility_term_ids();
if ( empty( $parsed_filter_rating_values ) || empty( $product_visibility_terms ) ) {
return array();
}
$rating_terms = array_map(
function( $rating ) use ( $product_visibility_terms ) {
return $product_visibility_terms[ 'rated-' . $rating ];
},
$parsed_filter_rating_values
);
return array(
'tax_query' => array(
array(
'field' => 'term_taxonomy_id',
'taxonomy' => 'product_visibility',
'terms' => $rating_terms,
'operator' => 'IN',
'rating_filter' => true,
),
),
);
}
}

View File

@ -12,4 +12,6 @@ class RatingFilter extends AbstractBlock {
* @var string
*/
protected $block_name = 'rating-filter';
const RATING_QUERY_VAR = 'rating_filter';
}

View File

@ -61,7 +61,7 @@ const goToShopPage = () =>
waitUntil: 'networkidle0',
} );
describe.skip( `${ block.name } Block`, () => {
describe( `${ block.name } Block`, () => {
describe( 'with All Products Block', () => {
beforeAll( async () => {
await switchUserToAdmin();
@ -111,7 +111,9 @@ describe.skip( `${ block.name } Block`, () => {
} );
} );
describe( 'with PHP classic template', () => {
// Re-enable this test once wordpress/e2e-test-utils is updated.
// https://github.com/woocommerce/woocommerce-blocks/issues/7744
describe.skip( 'with PHP classic template', () => {
const productCatalogTemplateId =
'woocommerce/woocommerce//archive-product';

View File

@ -64,7 +64,7 @@ const setMaxPrice = async () => {
await page.keyboard.press( 'Tab' );
};
describe.skip( `${ block.name } Block`, () => {
describe( `${ block.name } Block`, () => {
describe( 'with All Products Block', () => {
beforeAll( async () => {
await switchUserToAdmin();
@ -114,7 +114,9 @@ describe.skip( `${ block.name } Block`, () => {
} );
} );
describe( 'with PHP classic template', () => {
// Re-enable this test once wordpress/e2e-test-utils is updated.
// https://github.com/woocommerce/woocommerce-blocks/issues/7744
describe.skip( 'with PHP classic template', () => {
const productCatalogTemplateId =
'woocommerce/woocommerce//archive-product';

View File

@ -11,7 +11,10 @@ import {
import {
selectBlockByName,
insertBlockUsingSlash,
saveOrPublish,
getToggleIdByLabel,
} from '@woocommerce/blocks-test-utils';
import { setCheckbox } from '@woocommerce/e2e-utils';
/**
* Internal dependencies
@ -37,6 +40,7 @@ const block = {
},
frontend: {
productsList: '.wc-block-grid__products > li',
queryProductsList: '.wp-block-post-template > li',
classicProductsList: '.products.columns-3 > li',
fiveStarInput: ".wc-block-rating-filter label[for='5'] input",
submitButton: '.wc-block-components-filter-submit-button',
@ -54,7 +58,7 @@ const goToShopPage = () =>
waitUntil: 'networkidle0',
} );
describe.skip( `${ block.name } Block`, () => {
describe( `${ block.name } Block`, () => {
describe( 'with All Products Block', () => {
let link = '';
beforeAll( async () => {
@ -91,7 +95,7 @@ describe.skip( `${ block.name } Block`, () => {
} );
} );
describe( 'with PHP classic template', () => {
describe.skip( 'with PHP classic template', () => {
const productCatalogTemplateId =
'woocommerce/woocommerce//archive-product';
@ -204,4 +208,103 @@ describe.skip( `${ block.name } Block`, () => {
);
} );
} );
describe( 'with Product Query Block', () => {
let editorPageUrl = '';
let frontedPageUrl = '';
useTheme( 'emptytheme' );
beforeAll( async () => {
await switchUserToAdmin();
await createNewPost( {
postType: 'post',
title: block.name,
} );
await insertBlock( 'Products (Beta)' );
await insertBlock( block.name );
await page.waitForNetworkIdle();
await publishPost();
editorPageUrl = page.url();
frontedPageUrl = await page.evaluate( () =>
wp.data.select( 'core/editor' ).getPermalink()
);
await page.goto( frontedPageUrl );
} );
it( 'should show only products that match the filter', async () => {
const isRefreshed = jest.fn( () => void 0 );
page.on( 'load', isRefreshed );
await page.waitForSelector( block.class + '.is-loading', {
hidden: true,
} );
expect( isRefreshed ).not.toBeCalled();
await page.waitForSelector( selectors.frontend.fiveStarInput );
await Promise.all( [
page.waitForNavigation(),
page.click( selectors.frontend.fiveStarInput ),
] );
const products = await page.$$(
selectors.frontend.queryProductsList
);
const pageURL = page.url();
const parsedURL = new URL( pageURL );
expect( isRefreshed ).toBeCalledTimes( 1 );
expect( products ).toHaveLength( FIVE_STAR_PRODUCTS_AMOUNT );
expect( parsedURL.search ).toEqual(
block.urlSearchParamWhenFilterIsApplied
);
} );
it( 'should refresh the page only if the user click on button', async () => {
await page.goto( editorPageUrl );
await openBlockEditorSettings();
await selectBlockByName( block.slug );
await setCheckbox(
await getToggleIdByLabel( "Show 'Apply filters' button", 1 )
);
await saveOrPublish();
await page.goto( frontedPageUrl );
const isRefreshed = jest.fn( () => void 0 );
page.on( 'load', isRefreshed );
await page.waitForSelector( block.class + '.is-loading', {
hidden: true,
} );
expect( isRefreshed ).not.toBeCalled();
await page.waitForSelector( selectors.frontend.fiveStarInput );
await page.click( selectors.frontend.fiveStarInput );
await Promise.all( [
page.waitForNavigation( {
waitUntil: 'networkidle0',
} ),
page.click( selectors.frontend.submitButton ),
] );
const pageURL = page.url();
const parsedURL = new URL( pageURL );
await page.waitForSelector( selectors.frontend.queryProductsList );
const products = await page.$$(
selectors.frontend.queryProductsList
);
expect( isRefreshed ).toBeCalledTimes( 1 );
expect( products ).toHaveLength( FIVE_STAR_PRODUCTS_AMOUNT );
expect( parsedURL.search ).toEqual(
block.urlSearchParamWhenFilterIsApplied
);
} );
} );
} );

View File

@ -53,7 +53,7 @@ const goToShopPage = () =>
waitUntil: 'networkidle0',
} );
describe.skip( `${ block.name } Block`, () => {
describe( `${ block.name } Block`, () => {
describe( 'with All Products Block', () => {
let link = '';
beforeAll( async () => {
@ -92,7 +92,9 @@ describe.skip( `${ block.name } Block`, () => {
} );
} );
describe( 'with PHP classic template', () => {
// Re-enable this test once wordpress/e2e-test-utils is updated.
// https://github.com/woocommerce/woocommerce-blocks/issues/7744
describe.skip( 'with PHP classic template', () => {
const productCatalogTemplateId =
'woocommerce/woocommerce//archive-product';