From 2719bc9e83cb5068997c95c537b3d3a709c9b447 Mon Sep 17 00:00:00 2001 From: kim Date: Thu, 24 Oct 2024 15:58:29 +0200 Subject: [PATCH] refactor: fix tests --- .../e2e/allCollections/allCollections.cy.ts | 34 ++++++++++--------- package.json | 2 +- src/components/filters/CategoryFilter.tsx | 6 +++- src/components/filters/Filter.tsx | 5 +-- src/components/filters/FilterHeader.tsx | 2 +- src/components/filters/LangFilter.tsx | 8 +++-- src/config/selectors.ts | 2 ++ src/langs/constants.ts | 1 + src/langs/en.json | 1 + src/langs/fr.json | 3 +- yarn.lock | 10 +++--- 11 files changed, 45 insertions(+), 29 deletions(-) diff --git a/cypress/e2e/allCollections/allCollections.cy.ts b/cypress/e2e/allCollections/allCollections.cy.ts index 6c897f34..2567655f 100644 --- a/cypress/e2e/allCollections/allCollections.cy.ts +++ b/cypress/e2e/allCollections/allCollections.cy.ts @@ -1,17 +1,20 @@ import { CategoryType } from '@graasp/sdk'; -import { namespaces } from '@graasp/translations'; +import { langs, namespaces } from '@graasp/translations'; -import { i18nConfig } from '../../../src/config/i18n'; +import { LIBRARY_NAMESPACE, i18nConfig } from '../../../src/config/i18n'; import { ALL_COLLECTIONS_ROUTE } from '../../../src/config/routes'; import { ALL_COLLECTIONS_GRID_ID, ALL_COLLECTIONS_TITLE_ID, ENABLE_IN_DEPTH_SEARCH_CHECKBOX_ID, + SEARCH_FILTER_LANG_ID, + SEARCH_FILTER_POPPER_LANG_ID, buildCategoryOptionSelector, buildCollectionCardGridId, buildSearchFilterCategoryId, buildSearchFilterPopperButtonId, } from '../../../src/config/selectors'; +import LIBRARY from '../../../src/langs/constants'; import { SAMPLE_CATEGORIES } from '../../fixtures/categories'; import { buildPublicAndPrivateEnvironments } from '../../fixtures/environment'; import { PUBLISHED_ITEMS } from '../../fixtures/items'; @@ -45,17 +48,10 @@ buildPublicAndPrivateEnvironments(PUBLISHED_ITEMS).forEach((environment) => { 'contain.text', i18n.t(CategoryType.Discipline, { ns: namespaces.categories }), ); - cy.get(`#${buildSearchFilterCategoryId(CategoryType.Language)}`).should( + cy.get(`#${SEARCH_FILTER_LANG_ID}`).should( 'contain.text', - i18n.t(CategoryType.Language, { ns: namespaces.categories }), + i18n.t(LIBRARY.SEARCH_FILTER_LANG_TITLE, { ns: LIBRARY_NAMESPACE }), ); - // todo: add back when license filtering is enabled - // cy.get(`#${buildSearchFilterCategoryId(CATEGORY_TYPES.LICENSE)}`).should( - // 'contain.text', - // // todo: add translations - // // i18n.t(CATEGORIES.EDUCATION_LEVEL, { ns: namespaces.categories }), - // 'License', - // ); // verify 2 item cards are displayed (without children) cy.get(`#${ALL_COLLECTIONS_GRID_ID}`); @@ -75,11 +71,7 @@ buildPublicAndPrivateEnvironments(PUBLISHED_ITEMS).forEach((environment) => { it('display menu options', () => { cy.wait(['@getCategories']); - [ - CategoryType.Level, - CategoryType.Discipline, - CategoryType.Language, - ].forEach((categoryType) => { + [CategoryType.Level, CategoryType.Discipline].forEach((categoryType) => { cy.get( `#not-sticky button#${buildSearchFilterPopperButtonId(categoryType)}`, ) @@ -97,6 +89,16 @@ buildPublicAndPrivateEnvironments(PUBLISHED_ITEMS).forEach((environment) => { }); }); + it('display language options', () => { + cy.wait(['@getCategories']); + cy.get(`#not-sticky button#${SEARCH_FILTER_POPPER_LANG_ID}`) + .filter(':visible') + .click(); + Object.entries(langs).forEach((l, idx) => { + cy.get(buildCategoryOptionSelector(idx)).contains(l[1]); + }); + }); + it.skip('scroll to bottom and search should pop out', () => { cy.get(`#${ALL_COLLECTIONS_GRID_ID}`); diff --git a/package.json b/package.json index 0f8cb0c6..4ae2f07e 100644 --- a/package.json +++ b/package.json @@ -33,7 +33,7 @@ "@emotion/react": "11.13.3", "@emotion/server": "11.11.0", "@emotion/styled": "11.13.0", - "@graasp/query-client": "5.0.0", + "@graasp/query-client": "5.1.0", "@graasp/sdk": "4.33.0", "@graasp/stylis-plugin-rtl": "2.2.0", "@graasp/translations": "1.40.0", diff --git a/src/components/filters/CategoryFilter.tsx b/src/components/filters/CategoryFilter.tsx index 7bfafa61..228ddf82 100644 --- a/src/components/filters/CategoryFilter.tsx +++ b/src/components/filters/CategoryFilter.tsx @@ -3,7 +3,10 @@ import React from 'react'; import { Category } from '@graasp/sdk'; import { useCategoriesTranslation } from '../../config/i18n'; -import { buildSearchFilterCategoryId } from '../../config/selectors'; +import { + buildSearchFilterCategoryId, + buildSearchFilterPopperButtonId, +} from '../../config/selectors'; import { Filter } from './Filter'; type FilterProps = { @@ -32,6 +35,7 @@ export function CategoryFilter({ return ( [c.id, translateCategories(c.name)])} diff --git a/src/components/filters/Filter.tsx b/src/components/filters/Filter.tsx index 5f6a3e79..0e1e706e 100644 --- a/src/components/filters/Filter.tsx +++ b/src/components/filters/Filter.tsx @@ -5,7 +5,6 @@ import { Box, Button, Skeleton, Stack, Typography } from '@mui/material'; import { GRAASP_COLOR } from '../../config/constants'; import { useLibraryTranslation } from '../../config/i18n'; -import { buildSearchFilterPopperButtonId } from '../../config/selectors'; import LIBRARY from '../../langs/constants'; import { FilterPopper, FilterPopperProps } from './FilterPopper'; @@ -17,6 +16,7 @@ type FilterProps = { onClearOptions: FilterPopperProps['onClearOptions']; onOptionChange: FilterPopperProps['onOptionChange']; id: string; + buttonId: string; options?: FilterPopperProps['options']; }; @@ -28,6 +28,7 @@ export const Filter = ({ onClearOptions, onOptionChange, id, + buttonId, options, }: FilterProps) => { const { t } = useLibraryTranslation(); @@ -67,7 +68,7 @@ export const Filter = ({ ) : (