From 3ec72d56806d3f7a7b3deb86af4896112a29041d Mon Sep 17 00:00:00 2001
From: gcarron <gcarron@grandlyon.com>
Date: Mon, 15 Feb 2021 14:50:19 +0100
Subject: [PATCH] Add tests
---
.../Home/ConsumptionDetails.spec.tsx | 115 ++++++++++++------
src/components/Home/ConsumptionDetails.tsx | 2 +-
.../ConsumptionDetails.spec.tsx.snap | 3 +
.../HomeCards/AddKonnectorCard.spec.tsx | 13 +-
src/components/HomeCards/FluidCard.spec.tsx | 9 +-
.../HomeCards/TotalConsumption.spec.tsx | 58 +++++++--
.../AddKonnectorCard.spec.tsx.snap | 2 +-
.../__snapshots__/FluidCard.spec.tsx.snap | 23 ----
.../TotalConsumption.spec.tsx.snap | 3 +
src/services/dateChart.service.ts | 1 +
10 files changed, 148 insertions(+), 81 deletions(-)
create mode 100644 src/components/Home/__snapshots__/ConsumptionDetails.spec.tsx.snap
create mode 100644 src/components/HomeCards/__snapshots__/TotalConsumption.spec.tsx.snap
diff --git a/src/components/Home/ConsumptionDetails.spec.tsx b/src/components/Home/ConsumptionDetails.spec.tsx
index 01b67448e..1784cd679 100644
--- a/src/components/Home/ConsumptionDetails.spec.tsx
+++ b/src/components/Home/ConsumptionDetails.spec.tsx
@@ -1,10 +1,17 @@
import React from 'react'
-import { mount, shallow } from 'enzyme'
+import { mount } from 'enzyme'
import ConsumptionDetails from './ConsumptionDetails'
import * as reactRedux from 'react-redux'
-import { globalStateData } from '../../../test/__mocks__/globalStateData.mock'
import { TimeStep } from 'enum/timeStep.enum'
import { FluidType } from 'enum/fluid.enum'
+import {
+ createMockStore,
+ mockInitialChartState,
+ mockInitialEcolyoState,
+ mockInitialGlobalState,
+} from '../../../test/__mocks__/store'
+import { Provider } from 'react-redux'
+import { BrowserRouter } from 'react-router-dom'
jest.mock('cozy-ui/transpiled/react/I18n', () => {
return {
@@ -16,55 +23,87 @@ jest.mock('cozy-ui/transpiled/react/I18n', () => {
}
})
-jest.mock(
- 'components/Konnector/KonnectorViewerCard',
- () => 'KonnectorViewerCard'
-)
-const setIndicatorsLoaded = jest.fn()
-
const mockUseSelector = jest.spyOn(reactRedux, 'useSelector')
-describe('HomeIndicators component', () => {
+describe('ConsumptionDetails component', () => {
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any
+ let store: any
+
beforeEach(() => {
+ store = createMockStore(mockInitialEcolyoState)
mockUseSelector.mockClear()
- setIndicatorsLoaded.mockClear()
})
it('should be rendered correctly', () => {
- mockUseSelector.mockReturnValueOnce(globalStateData)
- const component = shallow(
- <ConsumptionDetails
- timeStep={TimeStep.DAY}
- setIndicatorsLoaded={setIndicatorsLoaded}
- />
- ).getElement()
- expect(component).toMatchSnapshot()
+ mockUseSelector.mockReturnValue({
+ fluidStatus: mockInitialGlobalState.fluidStatus,
+ fluidTypes: [FluidType.ELECTRICITY],
+ selectedDate: mockInitialChartState.selectedDate,
+ currentTimeStep: TimeStep.WEEK,
+ currentIndex: mockInitialChartState.currentIndex,
+ currentDatachart: mockInitialChartState.currentDatachart,
+ })
+ const wrapper = mount(
+ <Provider store={store}>
+ <BrowserRouter>
+ <ConsumptionDetails fluidType={FluidType.ELECTRICITY} />
+ </BrowserRouter>
+ </Provider>
+ )
+ expect(wrapper).toMatchSnapshot()
})
+
it('should not render connection card ', () => {
- const updatedState = {
- ...globalStateData,
- fluidStatus: [FluidType.ELECTRICITY, FluidType.GAS, FluidType.WATER],
- }
- mockUseSelector.mockReturnValue(updatedState)
+ mockUseSelector.mockReturnValue({
+ fluidStatus: mockInitialGlobalState.fluidStatus,
+ fluidTypes: [FluidType.ELECTRICITY, FluidType.GAS, FluidType.WATER],
+ selectedDate: mockInitialChartState.selectedDate,
+ currentTimeStep: TimeStep.WEEK,
+ currentIndex: mockInitialChartState.currentIndex,
+ currentDatachart: mockInitialChartState.currentDatachart,
+ })
const wrapper = mount(
- <ConsumptionDetails
- timeStep={TimeStep.DAY}
- setIndicatorsLoaded={setIndicatorsLoaded}
- />
+ <Provider store={store}>
+ <BrowserRouter>
+ <ConsumptionDetails fluidType={FluidType.MULTIFLUID} />
+ </BrowserRouter>
+ </Provider>
)
- expect(wrapper.contains('fluidcard-link')).toBeFalsy()
+ expect(wrapper.contains('.fluidcard-link')).toBeFalsy()
})
it('should render one connection card ', () => {
- const updatedState = {
- ...globalStateData,
- fluidStatus: [FluidType.ELECTRICITY, FluidType.GAS],
- }
- mockUseSelector.mockReturnValue(updatedState)
+ mockUseSelector.mockReturnValue({
+ fluidStatus: mockInitialGlobalState.fluidStatus,
+ fluidTypes: [FluidType.ELECTRICITY, FluidType.GAS],
+ selectedDate: mockInitialChartState.selectedDate,
+ currentTimeStep: TimeStep.WEEK,
+ currentIndex: mockInitialChartState.currentIndex,
+ currentDatachart: mockInitialChartState.currentDatachart,
+ })
+ const wrapper = mount(
+ <Provider store={store}>
+ <BrowserRouter>
+ <ConsumptionDetails fluidType={FluidType.MULTIFLUID} />
+ </BrowserRouter>
+ </Provider>
+ )
+ expect(wrapper.find('.fluidcard-link')).toBeTruthy()
+ })
+ it('should not render connection card and show multifluid link', () => {
+ mockUseSelector.mockReturnValue({
+ fluidStatus: mockInitialGlobalState.fluidStatus,
+ fluidTypes: [FluidType.ELECTRICITY, FluidType.GAS],
+ selectedDate: mockInitialChartState.selectedDate,
+ currentTimeStep: TimeStep.WEEK,
+ currentIndex: mockInitialChartState.currentIndex,
+ currentDatachart: mockInitialChartState.currentDatachart,
+ })
const wrapper = mount(
- <ConsumptionDetails
- timeStep={TimeStep.DAY}
- setIndicatorsLoaded={setIndicatorsLoaded}
- />
+ <Provider store={store}>
+ <BrowserRouter>
+ <ConsumptionDetails fluidType={FluidType.ELECTRICITY} />
+ </BrowserRouter>
+ </Provider>
)
- expect(wrapper.find('fluidcard-link')).toBeTruthy()
+ expect(wrapper.find('.multi-link')).toBeTruthy()
})
})
diff --git a/src/components/Home/ConsumptionDetails.tsx b/src/components/Home/ConsumptionDetails.tsx
index b800d2bfc..dc6646ffa 100644
--- a/src/components/Home/ConsumptionDetails.tsx
+++ b/src/components/Home/ConsumptionDetails.tsx
@@ -93,7 +93,7 @@ const ConsumptionDetails: React.FC<ConsumptionDetailsProps> = ({
<div className="text-16-normal-uppercase details-title">
{t('COMMON.MINI_CARDS_LABEL')}
</div>
- <div className="details-container">
+ <div className="details-container multi-link">
<FluidCard fluidType={FluidType.MULTIFLUID} />
{fluidConfig.map((fluid, index) => {
return fluidType !== fluid.fluidTypeId &&
diff --git a/src/components/Home/__snapshots__/ConsumptionDetails.spec.tsx.snap b/src/components/Home/__snapshots__/ConsumptionDetails.spec.tsx.snap
new file mode 100644
index 000000000..b419df1db
--- /dev/null
+++ b/src/components/Home/__snapshots__/ConsumptionDetails.spec.tsx.snap
@@ -0,0 +1,3 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`ConsumptionDetails component should be rendered correctly 1`] = `ReactWrapper {}`;
diff --git a/src/components/HomeCards/AddKonnectorCard.spec.tsx b/src/components/HomeCards/AddKonnectorCard.spec.tsx
index 343bce53e..236eb909e 100644
--- a/src/components/HomeCards/AddKonnectorCard.spec.tsx
+++ b/src/components/HomeCards/AddKonnectorCard.spec.tsx
@@ -16,7 +16,7 @@ jest.mock('cozy-ui/transpiled/react/I18n', () => {
})
describe('AddKonnectorCard component', () => {
- it('should be rendered correctly with water connexion', () => {
+ it('should be rendered correctly', () => {
const component = shallow(
<AddKonnectorCard
fluidType={FluidType.ELECTRICITY}
@@ -25,4 +25,15 @@ describe('AddKonnectorCard component', () => {
).getElement()
expect(component).toMatchSnapshot()
})
+ it('should be rendered with Elec connexion', () => {
+ const component = shallow(
+ <AddKonnectorCard
+ fluidType={FluidType.ELECTRICITY}
+ fluidStatus={fluidStatusData[0]}
+ />
+ )
+ expect(component.find('.add-konnector-title').text()).toContain(
+ 'ELECTRICITY'
+ )
+ })
})
diff --git a/src/components/HomeCards/FluidCard.spec.tsx b/src/components/HomeCards/FluidCard.spec.tsx
index 47db95d12..9019702f8 100644
--- a/src/components/HomeCards/FluidCard.spec.tsx
+++ b/src/components/HomeCards/FluidCard.spec.tsx
@@ -1,8 +1,5 @@
import React from 'react'
import { shallow } from 'enzyme'
-import * as reactRedux from 'react-redux'
-import { globalStateData } from '../../../test/__mocks__/globalStateData.mock'
-import { TimeStep } from 'enum/timeStep.enum'
import FluidCard from './FluidCard'
import { FluidType } from 'enum/fluid.enum'
@@ -24,9 +21,7 @@ describe('FluidCard component', () => {
expect(component).toMatchSnapshot()
})
it('should be rendered multifluid', () => {
- const component = shallow(
- <FluidCard fluidType={FluidType.MULTIFLUID} />
- ).getElement()
- expect(component).toMatchSnapshot()
+ const component = shallow(<FluidCard fluidType={FluidType.MULTIFLUID} />)
+ expect(component.find('.mutlifluid')).toBeTruthy()
})
})
diff --git a/src/components/HomeCards/TotalConsumption.spec.tsx b/src/components/HomeCards/TotalConsumption.spec.tsx
index 18d21709c..76b499c5c 100644
--- a/src/components/HomeCards/TotalConsumption.spec.tsx
+++ b/src/components/HomeCards/TotalConsumption.spec.tsx
@@ -1,10 +1,9 @@
import React from 'react'
-import { shallow } from 'enzyme'
-import * as reactRedux from 'react-redux'
-import { globalStateData } from '../../../test/__mocks__/globalStateData.mock'
-import { TimeStep } from 'enum/timeStep.enum'
+import { mount } from 'enzyme'
import { FluidType } from 'enum/fluid.enum'
import TotalConsumption from './TotalConsumption'
+import { mockInitialChartState } from '../../../test/__mocks__/store'
+import { graphData } from '../../../test/__mocks__/datachartData.mock'
jest.mock('cozy-ui/transpiled/react/I18n', () => {
return {
@@ -17,10 +16,49 @@ jest.mock('cozy-ui/transpiled/react/I18n', () => {
})
describe('TotalConsumption component', () => {
- // it('should be rendered correctly', () => {
- // const component = shallow(
- // <TotalConsumption fluidType={FluidType.ELECTRICITY} />
- // ).getElement()
- // expect(component).toMatchSnapshot()
- // })
+ it('should be rendered correctly', () => {
+ const component = mount(
+ <TotalConsumption
+ fluidType={FluidType.ELECTRICITY}
+ actualData={mockInitialChartState.currentDatachart.actualData}
+ />
+ )
+ expect(component).toMatchSnapshot()
+ })
+ it('should render euro value', () => {
+ const component = mount(
+ <TotalConsumption
+ fluidType={FluidType.ELECTRICITY}
+ actualData={graphData.actualData}
+ />
+ )
+ expect(
+ component
+ .find('.euro-value')
+ .first()
+ .text()
+ ).toEqual('20.23')
+ })
+ it('should call Converter method', () => {
+ const mockLoadToEuro = jest.fn()
+ jest.mock('services/converter.service', () => {
+ return jest.fn(() => {
+ return {
+ loadToEuro: mockLoadToEuro,
+ }
+ })
+ })
+ const component = mount(
+ <TotalConsumption
+ fluidType={FluidType.MULTIFLUID}
+ actualData={graphData.actualData}
+ />
+ )
+ expect(
+ component
+ .find('.euro-value')
+ .first()
+ .text()
+ ).toEqual('130.84')
+ })
})
diff --git a/src/components/HomeCards/__snapshots__/AddKonnectorCard.spec.tsx.snap b/src/components/HomeCards/__snapshots__/AddKonnectorCard.spec.tsx.snap
index b4b938c7d..d269ca97e 100644
--- a/src/components/HomeCards/__snapshots__/AddKonnectorCard.spec.tsx.snap
+++ b/src/components/HomeCards/__snapshots__/AddKonnectorCard.spec.tsx.snap
@@ -1,6 +1,6 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
-exports[`AddKonnectorCard component should be rendered correctly with water connexion 1`] = `
+exports[`AddKonnectorCard component should be rendered correctly 1`] = `
<ForwardRef
className="fluidcard-link"
to="/options/0"
diff --git a/src/components/HomeCards/__snapshots__/FluidCard.spec.tsx.snap b/src/components/HomeCards/__snapshots__/FluidCard.spec.tsx.snap
index 796e57e24..92b3bfc6c 100644
--- a/src/components/HomeCards/__snapshots__/FluidCard.spec.tsx.snap
+++ b/src/components/HomeCards/__snapshots__/FluidCard.spec.tsx.snap
@@ -22,26 +22,3 @@ exports[`FluidCard component should be rendered correctly 1`] = `
</StyledCard>
</ForwardRef>
`;
-
-exports[`FluidCard component should be rendered multifluid 1`] = `
-<ForwardRef
- className="fluidcard-link"
- to="/consumption"
->
- <StyledCard
- className="fluidcard-content"
- fluidType={3}
- >
- <StyledIcon
- className="fluidcard-icon"
- icon="test-file-stub"
- size={50}
- />
- <div
- className="fluidcard-title multifluid"
- >
- FLUID.MULTIFLUID.LABEL
- </div>
- </StyledCard>
-</ForwardRef>
-`;
diff --git a/src/components/HomeCards/__snapshots__/TotalConsumption.spec.tsx.snap b/src/components/HomeCards/__snapshots__/TotalConsumption.spec.tsx.snap
new file mode 100644
index 000000000..3a565c665
--- /dev/null
+++ b/src/components/HomeCards/__snapshots__/TotalConsumption.spec.tsx.snap
@@ -0,0 +1,3 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`TotalConsumption component should be rendered correctly 1`] = `ReactWrapper {}`;
diff --git a/src/services/dateChart.service.ts b/src/services/dateChart.service.ts
index 04eb16f92..03ede85e0 100644
--- a/src/services/dateChart.service.ts
+++ b/src/services/dateChart.service.ts
@@ -80,6 +80,7 @@ export default class DateChartService {
endDate: date.plus({ days: -1 * index }),
}
default:
+ console.log('ts', timeStep)
throw new Error('TimeStep unknown')
}
}
--
GitLab