From b21f99322e66eb0c6f29da07e02a83402ab29c19 Mon Sep 17 00:00:00 2001 From: gmeigniez-pass <139768952+gmeigniez-pass@users.noreply.github.com> Date: Thu, 30 Jan 2025 12:30:17 +0100 Subject: [PATCH] (PC-34320)[PRO] fix: Do not reset applied filters when offerer or venue loads (since it has already been reseted) to fix flaky test. --- pro/cypress/e2e/searchCollectiveOffer.cy.ts | 7 +-- .../utils/__specs__/hasSearchFilters.spec.ts | 60 +++++++++++++++++++ .../core/Offers/utils/hasSearchFilters.ts | 10 +++- .../OffersTableSearch.module.scss | 16 +---- .../CollectiveOffers/CollectiveOffers.tsx | 11 +++- .../CollectiveOffersScreen.tsx | 8 +-- 6 files changed, 86 insertions(+), 26 deletions(-) create mode 100644 pro/src/commons/core/Offers/utils/__specs__/hasSearchFilters.spec.ts diff --git a/pro/cypress/e2e/searchCollectiveOffer.cy.ts b/pro/cypress/e2e/searchCollectiveOffer.cy.ts index 997a0883812..5968288e7fd 100644 --- a/pro/cypress/e2e/searchCollectiveOffer.cy.ts +++ b/pro/cypress/e2e/searchCollectiveOffer.cy.ts @@ -58,10 +58,7 @@ describe('Search collective offers', () => { message: 'I search with the name "' + offerPublished.name + '"', }) - cy.findByRole('searchbox', { name: /Nom de l’offre/ }).type( - offerPublished.name - ) - + cy.findByLabelText(/Nom de l’offre/).type(offerPublished.name) cy.stepLog({ message: 'I validate my filters' }) cy.findByText('Rechercher').click() cy.wait('@collectiveOffers').its('response.statusCode').should('eq', 200) @@ -292,7 +289,7 @@ describe('Search collective offers', () => { cy.findByLabelText('Format').select('Représentation') cy.stepLog({ message: 'I search with the name "brouillon"' }) - cy.findByRole('searchbox', { name: /Nom de l’offre/ }).type('brouillon') + cy.findByLabelText(/Nom de l’offre/).type('brouillon', { delay: 0 }) cy.stepLog({ message: 'I search with status "Brouillon"' }) cy.get('#search-status').click() diff --git a/pro/src/commons/core/Offers/utils/__specs__/hasSearchFilters.spec.ts b/pro/src/commons/core/Offers/utils/__specs__/hasSearchFilters.spec.ts new file mode 100644 index 00000000000..b46e673fb18 --- /dev/null +++ b/pro/src/commons/core/Offers/utils/__specs__/hasSearchFilters.spec.ts @@ -0,0 +1,60 @@ +import { EacFormat } from 'apiClient/adage' +import { CollectiveOfferDisplayedStatus } from 'apiClient/v1' + +import { + CollectiveOfferTypeEnum, + CollectiveSearchFiltersParams, +} from '../../types' +import { hasCollectiveSearchFilters } from '../hasSearchFilters' + +describe('hasSearchFilters', () => { + const defaultCollectiveFilters: CollectiveSearchFiltersParams = { + collectiveOfferType: CollectiveOfferTypeEnum.ALL, + format: 'all', + nameOrIsbn: '', + offererId: '333', + page: 1, + periodBeginningDate: '', + periodEndingDate: '', + status: [], + venueId: '', + } + + it('should confirm whether collective filters are applied or not', () => { + expect( + hasCollectiveSearchFilters(defaultCollectiveFilters, { + ...defaultCollectiveFilters, + }) + ).toBeFalsy() + + expect( + hasCollectiveSearchFilters(defaultCollectiveFilters, { + ...defaultCollectiveFilters, + format: EacFormat.ATELIER_DE_PRATIQUE, + }) + ).toBeTruthy() + + expect( + hasCollectiveSearchFilters(defaultCollectiveFilters, { + ...defaultCollectiveFilters, + status: [CollectiveOfferDisplayedStatus.ACTIVE], + }) + ).toBeTruthy() + }) + + it('should ignore the page number and offerer id', () => { + expect( + hasCollectiveSearchFilters(defaultCollectiveFilters, { + ...defaultCollectiveFilters, + page: 10, + }) + ).toBeFalsy() + + expect( + hasCollectiveSearchFilters(defaultCollectiveFilters, { + ...defaultCollectiveFilters, + offererId: '816', + }) + ).toBeFalsy() + }) +}) diff --git a/pro/src/commons/core/Offers/utils/hasSearchFilters.ts b/pro/src/commons/core/Offers/utils/hasSearchFilters.ts index 45532be0ee2..09e0a73aa17 100644 --- a/pro/src/commons/core/Offers/utils/hasSearchFilters.ts +++ b/pro/src/commons/core/Offers/utils/hasSearchFilters.ts @@ -28,6 +28,14 @@ export const hasCollectiveSearchFilters = ( searchFilters[filterName] && filterName !== 'offererId' && filterName !== 'page' && - searchFilters[filterName] !== { ...defaultFilters }[filterName] + ((['string', 'number'].includes(typeof searchFilters[filterName]) && + searchFilters[filterName] !== { ...defaultFilters }[filterName]) || + (Array.isArray(searchFilters[filterName]) && + Array.isArray(defaultFilters[filterName]) && + !isSameArray(searchFilters[filterName], defaultFilters[filterName]))) ) } + +function isSameArray(arr1: unknown[], arr2: unknown[]) { + return arr1.length === arr2.length && arr1.every((el) => arr2.includes(el)) +} diff --git a/pro/src/components/OffersTable/OffersTableSearch/OffersTableSearch.module.scss b/pro/src/components/OffersTable/OffersTableSearch/OffersTableSearch.module.scss index 51659551a34..14810c47618 100644 --- a/pro/src/components/OffersTable/OffersTableSearch/OffersTableSearch.module.scss +++ b/pro/src/components/OffersTable/OffersTableSearch/OffersTableSearch.module.scss @@ -29,18 +29,8 @@ } } - &-reset { - &-wrapper { - flex-direction: column; - margin-top: rem.torem(8px); - } - - &-button { - min-height: size.$input-min-height; - margin-top: 0; - display: block; - text-align: left; - } + &-reset-wrapper { + margin-top: rem.torem(8px); } &-separator { @@ -60,4 +50,4 @@ .visually-hidden { @include a11y.visually-hidden; -} \ No newline at end of file +} diff --git a/pro/src/pages/CollectiveOffers/CollectiveOffers.tsx b/pro/src/pages/CollectiveOffers/CollectiveOffers.tsx index 2a8be53cd8c..1185d093b32 100644 --- a/pro/src/pages/CollectiveOffers/CollectiveOffers.tsx +++ b/pro/src/pages/CollectiveOffers/CollectiveOffers.tsx @@ -61,7 +61,11 @@ export const CollectiveOffers = (): JSX.Element => { ) const offerer = offererQuery.data - const { data } = useSWR( + const { + data, + isLoading: isVenuesLoading, + isValidating: isVenuesValidating, + } = useSWR( [GET_VENUES_QUERY_KEY, offerer?.id], ([, offererIdParam]) => api.getVenues(null, null, offererIdParam), { fallbackData: { venues: [] } } @@ -138,7 +142,10 @@ export const CollectiveOffers = (): JSX.Element => { {/* When the venues are cached for a given offerer, we still need to reset the Screen component. SWR isLoading is only true when the data is not cached, while isValidating is always set to true when the key is updated */} - {offererQuery.isLoading || offererQuery.isValidating ? ( + {offererQuery.isLoading || + offererQuery.isValidating || + isVenuesLoading || + isVenuesValidating ? ( ) : ( ([]) const [selectedFilters, setSelectedFilters] = useState(initialSearchFilters) - useEffect(() => { - setSelectedFilters(initialSearchFilters) - }, [initialSearchFilters]) - const defaultCollectiveFilters = useDefaultCollectiveSearchFilters() const currentPageOffersSubset = offers.slice( @@ -85,6 +81,7 @@ export const CollectiveOffersScreen = ({ initialSearchFilters, defaultCollectiveFilters ) + const userHasNoOffers = !isLoading && !hasOffers && !hasFilters const areAllOffersSelected = @@ -134,6 +131,7 @@ export const CollectiveOffersScreen = ({ const resetFilters = () => { onResetFilters() applyUrlFiltersAndRedirect(defaultCollectiveFilters) + setSelectedFilters(defaultCollectiveFilters) } function onSetSelectedOffer(offer: CollectiveOfferResponseModel) {