diff --git a/src/components/Ecogesture/EcogestureTabsView.spec.tsx b/src/components/Ecogesture/EcogestureTabsView.spec.tsx
index d9806f63d0fd7d4fb203a9ec11a604a4eaaa5704..e5dcabc9b1dbb9243163d9c7226f46dc4cf34918 100644
--- a/src/components/Ecogesture/EcogestureTabsView.spec.tsx
+++ b/src/components/Ecogesture/EcogestureTabsView.spec.tsx
@@ -1,16 +1,29 @@
import { render, screen, waitFor } from '@testing-library/react'
import { userEvent } from '@testing-library/user-event'
import EcogestureTabsView from 'components/Ecogesture/EcogestureTabsView'
+import { Ecogesture } from 'models'
import React from 'react'
import { Provider } from 'react-redux'
import * as profileActions from 'store/profile/profile.slice'
-import { mockedEcogesturesData } from 'tests/__mocks__/ecogesturesData.mock'
+import { mockDoingEcogestures } from 'tests/__mocks__/ecogesturesData.mock'
import { createMockEcolyoStore } from 'tests/__mocks__/store'
-const mockInitEcogesture = jest.fn().mockResolvedValue(mockedEcogesturesData)
+const mockInitEcogesture = jest
+ .fn<
+ Promise<{
+ ecogestureHash: string
+ ecogestureList: Ecogesture[]
+ }>,
+ []
+ >()
+ .mockResolvedValue({
+ ecogestureHash: 'hash',
+ ecogestureList: mockDoingEcogestures,
+ })
+const mockGetEcogesture = jest.fn().mockResolvedValue([])
jest.mock('services/ecogesture.service', () => {
return jest.fn(() => ({
- getEcogestureListByProfile: jest.fn().mockResolvedValue([]),
+ getEcogestureListByProfile: mockGetEcogesture,
initEcogesture: mockInitEcogesture,
}))
})
@@ -44,7 +57,7 @@ describe('EcogestureView component', () => {
jest.clearAllMocks()
})
- it('should be rendered correctly', async () => {
+ it('should be rendered correctly with 3 clickable tabs', async () => {
const { container } = render(
<Provider store={store}>
<EcogestureTabsView />
@@ -72,29 +85,12 @@ describe('EcogestureView component', () => {
})
it('should render empty list', async () => {
- mockInitEcogesture.mockResolvedValueOnce([])
const { container } = render(
<Provider store={store}>
<EcogestureTabsView />
</Provider>
)
await waitFor(() => null, { container })
- expect(
- container.getElementsByClassName('ec-empty-container').length
- ).toBeTruthy()
- })
-
- it('should change tab', async () => {
- const { container } = render(
- <Provider store={store}>
- <EcogestureTabsView />
- </Provider>
- )
- await waitFor(() => null, { container })
- await userEvent.click(screen.getAllByRole('button')[1])
- await waitFor(() => null, { container })
- expect(
- container.getElementsByClassName('ec-empty-container').length
- ).toBeTruthy()
+ expect(container).toMatchSnapshot()
})
})
diff --git a/src/components/Ecogesture/__snapshots__/EcogestureTabsView.spec.tsx.snap b/src/components/Ecogesture/__snapshots__/EcogestureTabsView.spec.tsx.snap
index 005a8b9c5f797d13770f0b54ef608a7b9c551ef5..e3dd070242df6df5363f2accb2d8049b3b2a91f5 100644
--- a/src/components/Ecogesture/__snapshots__/EcogestureTabsView.spec.tsx.snap
+++ b/src/components/Ecogesture/__snapshots__/EcogestureTabsView.spec.tsx.snap
@@ -1,6 +1,6 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
-exports[`EcogestureView component should be rendered correctly 1`] = `
+exports[`EcogestureView component should be rendered correctly with 3 clickable tabs 1`] = `
<div
aria-hidden="true"
>
@@ -56,7 +56,7 @@ exports[`EcogestureView component should be rendered correctly 1`] = `
>
ecogesture.title_tab_1
<br />
- (0)
+ (2)
</span>
<span
class="MuiTouchRipple-root"
@@ -76,7 +76,7 @@ exports[`EcogestureView component should be rendered correctly 1`] = `
>
ecogesture.title_tab_2
<br />
- (0)
+ (3)
</span>
<span
class="MuiTouchRipple-root"
@@ -221,7 +221,247 @@ exports[`EcogestureView component should be rendered correctly 1`] = `
hidden=""
id="simple-tabpanel-2"
role="tabpanel"
- />
+ >
+ <mock-ecogesturelist
+ displayselection="false"
+ list="[object Object],[object Object],[object Object]"
+ selectiontotal="0"
+ selectionviewed="0"
+ />
+ </div>
+ </mock-content>
+</div>
+`;
+
+exports[`EcogestureView component should render empty list 1`] = `
+<div
+ aria-hidden="true"
+>
+ <mock-cozybar
+ titlekey="common.title_ecogestures"
+ />
+ <mock-header
+ desktoptitlekey="common.title_ecogestures"
+ >
+ <div
+ class="MuiTabs-root ecogestures-tabs"
+ >
+ <div
+ class="MuiTabs-scroller MuiTabs-fixed"
+ style="overflow: hidden;"
+ >
+ <div
+ aria-label="ecogestures-tabs"
+ class="MuiTabs-flexContainer MuiTabs-centered"
+ role="tablist"
+ >
+ <button
+ aria-controls="simple-tabpanel-0"
+ aria-selected="true"
+ class="MuiButtonBase-root MuiTab-root MuiTab-textColorInherit single-tab active Mui-selected"
+ id="simple-tab-0"
+ role="tab"
+ tabindex="0"
+ type="button"
+ >
+ <span
+ class="MuiTab-wrapper"
+ >
+ ecogesture.title_tab_0
+ <br />
+ (0)
+ </span>
+ <span
+ class="MuiTouchRipple-root"
+ />
+ </button>
+ <button
+ aria-controls="simple-tabpanel-1"
+ aria-selected="false"
+ class="MuiButtonBase-root MuiTab-root MuiTab-textColorInherit single-tab"
+ id="simple-tab-1"
+ role="tab"
+ tabindex="0"
+ type="button"
+ >
+ <span
+ class="MuiTab-wrapper"
+ >
+ ecogesture.title_tab_1
+ <br />
+ (2)
+ </span>
+ <span
+ class="MuiTouchRipple-root"
+ />
+ </button>
+ <button
+ aria-controls="simple-tabpanel-2"
+ aria-selected="false"
+ class="MuiButtonBase-root MuiTab-root MuiTab-textColorInherit single-tab"
+ id="simple-tab-2"
+ role="tab"
+ tabindex="0"
+ type="button"
+ >
+ <span
+ class="MuiTab-wrapper"
+ >
+ ecogesture.title_tab_2
+ <br />
+ (3)
+ </span>
+ <span
+ class="MuiTouchRipple-root"
+ />
+ </button>
+ </div>
+ <span
+ class="PrivateTabIndicator-root-9 PrivateTabIndicator-colorSecondary-11 indicator-tab"
+ style="left: 0px; width: 0px;"
+ />
+ </div>
+ </div>
+ </mock-header>
+ <mock-content>
+ <div
+ aria-labelledby="simple-tab-0"
+ id="simple-tabpanel-0"
+ role="tabpanel"
+ >
+ <div
+ class="ec-empty-container"
+ >
+ <div
+ class="ec-empty-content"
+ >
+ <svg
+ aria-hidden="true"
+ class="icon-big styles__icon___23x3R"
+ height="150"
+ width="150"
+ >
+ <use
+ xlink:href="#test-file-stub"
+ />
+ </svg>
+ <div
+ class="text-16-normal"
+ >
+ ecogesture.emptyList.obj1
+ </div>
+ <div
+ class="text-16-normal"
+ >
+ ecogesture.emptyList.obj2
+ </div>
+ <div
+ class="buttons"
+ >
+ <button
+ aria-label="ecogesture.emptyList.btn1"
+ class="MuiButtonBase-root MuiButton-root MuiButton-text btnSecondary"
+ tabindex="0"
+ type="button"
+ >
+ <span
+ class="MuiButton-label"
+ >
+ ecogesture.emptyList.btn1
+ </span>
+ </button>
+ <button
+ aria-label="ecogesture.emptyList.btn2"
+ class="MuiButtonBase-root MuiButton-root MuiButton-text btnPrimary"
+ tabindex="0"
+ type="button"
+ >
+ <span
+ class="MuiButton-label"
+ >
+ ecogesture.emptyList.btn2
+ </span>
+ </button>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div
+ aria-labelledby="simple-tab-1"
+ hidden=""
+ id="simple-tabpanel-1"
+ role="tabpanel"
+ >
+ <div
+ class="ec-empty-container"
+ >
+ <div
+ class="ec-empty-content"
+ >
+ <svg
+ aria-hidden="true"
+ class="icon-big styles__icon___23x3R"
+ height="150"
+ width="150"
+ >
+ <use
+ xlink:href="#test-file-stub"
+ />
+ </svg>
+ <div
+ class="text-16-normal"
+ >
+ ecogesture.emptyList.doing1
+ </div>
+ <div
+ class="text-16-normal"
+ >
+ ecogesture.emptyList.doing2
+ </div>
+ <div
+ class="buttons"
+ >
+ <button
+ aria-label="ecogesture.emptyList.btn1"
+ class="MuiButtonBase-root MuiButton-root MuiButton-text btnSecondary"
+ tabindex="0"
+ type="button"
+ >
+ <span
+ class="MuiButton-label"
+ >
+ ecogesture.emptyList.btn1
+ </span>
+ </button>
+ <button
+ aria-label="ecogesture.emptyList.btn2"
+ class="MuiButtonBase-root MuiButton-root MuiButton-text btnPrimary"
+ tabindex="0"
+ type="button"
+ >
+ <span
+ class="MuiButton-label"
+ >
+ ecogesture.emptyList.btn2
+ </span>
+ </button>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div
+ aria-labelledby="simple-tab-2"
+ hidden=""
+ id="simple-tabpanel-2"
+ role="tabpanel"
+ >
+ <mock-ecogesturelist
+ displayselection="false"
+ list="[object Object],[object Object],[object Object]"
+ selectiontotal="0"
+ selectionviewed="0"
+ />
+ </div>
</mock-content>
</div>
`;
diff --git a/tests/__mocks__/ecogesturesData.mock.ts b/tests/__mocks__/ecogesturesData.mock.ts
index de6e545c841e9ca097c1ecb5c436870a9efb7ba4..9cbfc7b6db7546cb975a9540bdfdc513289f45e3 100644
--- a/tests/__mocks__/ecogesturesData.mock.ts
+++ b/tests/__mocks__/ecogesturesData.mock.ts
@@ -53,7 +53,6 @@ export const mockedEcogesturesData: Ecogesture[] = [
doing: false,
objective: false,
viewedInSelection: false,
-
_id: 'ECOGESTURE002',
_rev: '1-ef7ddd778254e3b7d331a88fd17f606d',
_type: 'com.grandlyon.ecolyo.ecogesture',
@@ -89,6 +88,12 @@ export const mockedEcogesturesData: Ecogesture[] = [
},
]
+export const mockDoingEcogestures: Ecogesture[] = [
+ { ...mockedEcogesturesData[0], doing: true, viewedInSelection: true },
+ { ...mockedEcogesturesData[1], doing: false, viewedInSelection: true },
+ { ...mockedEcogesturesData[2], doing: true, viewedInSelection: true },
+]
+
export const mockedEcogesturesSortedData: Ecogesture[] = [
{
fluidTypes: [FluidType.ELECTRICITY],