-
Notifications
You must be signed in to change notification settings - Fork 106
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
test: [IOCOM-1830] fimsHistoryNonEmptyContent tests (#6715)
## Short description tests for said component ## List of changes proposed in this pull request for fimsHistoryNonEmptyContent: - required tests - required mocks - snapshots - updated the jestSetup to include [its required setup for testing](https://shopify.github.io/flash-list/docs/testing/) - removal of deprecated component usage in favor of its updated version - addition of testIds where necessary - refactor of typing in order to better test - refactor of selector usage to include new, more direct selector that has already been implemented ## How to test automated tests should all pass correctly, also the "export" button should still work as intended. --------- Co-authored-by: Andrea <[email protected]>
- Loading branch information
Showing
8 changed files
with
7,210 additions
and
13 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
5 changes: 5 additions & 0 deletions
5
ts/features/fims/history/components/__mocks__/FimsHistoryListItemPicker.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,5 @@ | ||
| import { Text } from "react-native"; | ||
|
|
||
| export const FimsHistoryListItemPicker = () => ( | ||
| <Text>TESTING LIST ITEM FROM PICKER</Text> | ||
| ); |
3 changes: 3 additions & 0 deletions
3
ts/features/fims/history/components/__mocks__/FimsHistoryLoaders.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,3 +1,6 @@ | ||
| import { Text } from "react-native"; | ||
|
|
||
| export const LoadingFimsHistoryListItem = () => <Text>LOADING_LIST_ITEM</Text>; | ||
| export const LoadingFimsHistoryItemsFooter = () => ( | ||
| <Text testID="testing-footer">LOADING_FOOTER</Text> | ||
| ); |
169 changes: 169 additions & 0 deletions
169
ts/features/fims/history/components/__tests__/FimsHistoryNonEmptyContent.test.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,169 @@ | ||
| jest.mock("../../hooks/useFimsHistoryResultToasts.tsx"); | ||
| jest.mock("../FimsHistoryLoaders.tsx"); | ||
| jest.mock("../FimsHistoryListItemPicker.tsx"); | ||
|
|
||
| import * as pot from "@pagopa/ts-commons/lib/pot"; | ||
| import { fireEvent } from "@testing-library/react-native"; | ||
| import { createStore } from "redux"; | ||
| import { AccessHistoryPage } from "../../../../../../definitions/fims_history/AccessHistoryPage"; | ||
| import { | ||
| remoteLoading, | ||
| remoteReady | ||
| } from "../../../../../common/model/RemoteValue"; | ||
| import { applicationChangeState } from "../../../../../store/actions/application"; | ||
| import { appReducer } from "../../../../../store/reducers"; | ||
| import { GlobalState } from "../../../../../store/reducers/types"; | ||
| import { renderScreenWithNavigationStoreContext } from "../../../../../utils/testWrapper"; | ||
| import { FIMS_ROUTES } from "../../../common/navigation"; | ||
| import { | ||
| FimsHistoryNonEmptyContent, | ||
| FimsHistoryNonEmptyContentProps | ||
| } from "../FimsHistoryNonEmptyContent"; | ||
| import * as HOOK from "../../hooks/useFimsHistoryResultToasts"; | ||
|
|
||
| const mockAccess = { | ||
| id: "TESTING", | ||
| redirect: { display_name: "TESTING", uri: "TESTING" }, | ||
| service_id: "TESTING_SID", | ||
| timestamp: new Date(0) | ||
| }; | ||
|
|
||
| const mockAccesses: AccessHistoryPage = { | ||
| data: [mockAccess] | ||
| }; | ||
| const mockEmptyAccesses: AccessHistoryPage = { | ||
| data: [] | ||
| }; | ||
|
|
||
| // ------------------- UTILS | ||
|
|
||
| const generateMockStoreForSelectors = ( | ||
| isHistoryLoading: boolean, | ||
| isHistoryExporting: boolean | ||
| ) => | ||
| ({ | ||
| features: { | ||
| fims: { | ||
| history: { | ||
| historyExportState: isHistoryExporting | ||
| ? remoteLoading | ||
| : remoteReady("SUCCESS"), | ||
| consentsList: isHistoryLoading ? pot.someLoading({}) : pot.none | ||
| } | ||
| } | ||
| } | ||
| } as GlobalState); | ||
| const renderComponent = ( | ||
| props: FimsHistoryNonEmptyContentProps, | ||
| mockState: GlobalState | ||
| ) => { | ||
| const globalState = appReducer(mockState, applicationChangeState("active")); | ||
|
|
||
| return renderScreenWithNavigationStoreContext( | ||
| () => <FimsHistoryNonEmptyContent {...props} />, | ||
| FIMS_ROUTES.HISTORY, | ||
| {}, | ||
| createStore(appReducer, globalState as any) | ||
| ); | ||
| }; | ||
|
|
||
| // --------------- END UTILS | ||
|
|
||
| // eslint-disable-next-line sonarjs/cognitive-complexity | ||
| describe("fimsHistoryNonEmptyContent", () => { | ||
| beforeEach(() => { | ||
| jest.clearAllMocks(); | ||
| jest.restoreAllMocks(); | ||
| }); | ||
|
|
||
| for (const historyLoading of [true, false]) { | ||
| for (const historyExporting of [true, false]) { | ||
| for (const hasAccesses of [true, false]) { | ||
| const fetchMore = jest.fn(); | ||
| const shouldShowLoadingListFooter = historyLoading; | ||
| const shouldRenderPageFooter = !historyLoading || hasAccesses; // component logic is !( hLoading && !accesses ) | ||
| const store = generateMockStoreForSelectors( | ||
| historyLoading, | ||
| historyExporting | ||
| ); | ||
|
|
||
| const testString = `${+hasAccesses} accesses, historyLoading = ${historyLoading} and historyExporting = ${historyExporting}`; | ||
|
|
||
| it(`should fetch automatically to try and fill the list, and match snapshot for ${testString} `, () => { | ||
| const component = renderComponent( | ||
| { | ||
| accesses: hasAccesses ? mockAccesses : mockEmptyAccesses, | ||
| fetchMore | ||
| }, | ||
| store | ||
| ); | ||
| expect(component).toBeTruthy(); | ||
| expect(component).toMatchSnapshot(); | ||
| expect(fetchMore).toHaveBeenCalledTimes(1); | ||
| }); | ||
|
|
||
| it(`should ${ | ||
| shouldShowLoadingListFooter ? "" : "not" | ||
| } render list loading footer in case of ${testString} `, () => { | ||
| const component = renderComponent( | ||
| { | ||
| accesses: hasAccesses ? mockAccesses : mockEmptyAccesses, | ||
| fetchMore | ||
| }, | ||
| store | ||
| ); | ||
| if (shouldShowLoadingListFooter) { | ||
| expect(component.queryByTestId("testing-footer")).toBeTruthy(); | ||
| } else { | ||
| expect(component.queryByTestId("testing-footer")).toBeNull(); | ||
| } | ||
| }); | ||
| it(`should | ||
| ${shouldRenderPageFooter ? "" : "not"} | ||
| render export footer in case of ${testString} `, () => { | ||
| const component = renderComponent( | ||
| { | ||
| accesses: hasAccesses ? mockAccesses : mockEmptyAccesses, | ||
| fetchMore | ||
| }, | ||
| store | ||
| ); | ||
| if (shouldRenderPageFooter) { | ||
| expect(component.queryByTestId("export-footer")).toBeTruthy(); | ||
| } else { | ||
| expect(component.queryByTestId("export-footer")).toBeNull(); | ||
| } | ||
| }); | ||
|
|
||
| if (shouldRenderPageFooter) { | ||
| const isPageFooterLoading = historyExporting; | ||
| it(`should ${ | ||
| isPageFooterLoading ? "not" : "" | ||
| } dispatch the onPress if the user taps the primary action in case of ${testString}`, () => { | ||
| const mockFetchMore = jest.fn(); | ||
| jest.spyOn(HOOK, "useFimsHistoryExport").mockReturnValue({ | ||
| handleExportOnPress: mockFetchMore | ||
| }); | ||
|
|
||
| const component = renderComponent( | ||
| { | ||
| accesses: hasAccesses ? mockAccesses : mockEmptyAccesses, | ||
| fetchMore | ||
| }, | ||
| store | ||
| ); | ||
|
|
||
| const renderedComponent = component.getByTestId("export-button"); | ||
| expect(renderedComponent).toBeTruthy(); | ||
|
|
||
| fireEvent.press(renderedComponent); | ||
|
|
||
| expect(mockFetchMore).toHaveBeenCalledTimes( | ||
| isPageFooterLoading ? 0 : 1 | ||
| ); | ||
| }); | ||
| } | ||
| } | ||
| } | ||
| } | ||
| }); |
Oops, something went wrong.