From 2ad090c9fb4ab2d354184c0d9f46bf938ed0ef7b Mon Sep 17 00:00:00 2001
From: HAUTBOIS Aurelie <aurelie.hautbois@ext.soprasteria.com>
Date: Tue, 9 Feb 2021 10:02:46 +0100
Subject: [PATCH] feat: test analysisConsumption component
---
.../Analysis/AnalysisConsumption.spec.tsx | 201 ++++++++++++++++++
.../Analysis/AnalysisConsumption.tsx | 9 +-
2 files changed, 205 insertions(+), 5 deletions(-)
create mode 100644 src/components/Analysis/AnalysisConsumption.spec.tsx
diff --git a/src/components/Analysis/AnalysisConsumption.spec.tsx b/src/components/Analysis/AnalysisConsumption.spec.tsx
new file mode 100644
index 000000000..2c41c4f41
--- /dev/null
+++ b/src/components/Analysis/AnalysisConsumption.spec.tsx
@@ -0,0 +1,201 @@
+import React from 'react'
+import { mount } from 'enzyme'
+import { Provider } from 'react-redux'
+import configureStore from 'redux-mock-store'
+import { profileData } from '../../../test/__mocks__/profile.mock'
+import AnalysisConsumption from './AnalysisConsumption'
+import { act } from '@testing-library/react'
+import MuiButton from '@material-ui/core/Button'
+import StyledCard from 'components/CommonKit/Card/StyledCard'
+import StyledIcon from 'components/CommonKit/Icon/StyledIcon'
+import { globalStateData } from '../../../test/__mocks__/globalStateData.mock'
+import { mockMonthlyForecastJanuaryTestProfile1 } from '../../../test/__mocks__/profileType.mock'
+import { FluidType } from 'enum/fluid.enum'
+
+jest.mock('cozy-ui/transpiled/react/I18n', () => {
+ return {
+ useI18n: jest.fn(() => {
+ return {
+ t: (str: string) => str,
+ }
+ }),
+ }
+})
+
+const mockHistoryPush = jest.fn()
+jest.mock('react-router-dom', () => ({
+ ...jest.requireActual('react-router-dom'),
+ useHistory: () => ({
+ push: mockHistoryPush,
+ }),
+}))
+
+const mockgetMonthlyForecast = jest.fn()
+jest.mock('services/profileType.service', () => {
+ return jest.fn(() => {
+ return {
+ getMonthlyForecast: mockgetMonthlyForecast,
+ }
+ })
+})
+
+const mockStore = configureStore([])
+
+const performanceIndicator = {
+ compareValue: 160.42797399999998,
+ percentageVariation: 0.026592126632478563,
+ value: 156.161853,
+}
+const performanceIndicators = [
+ {
+ compareValue: 203.49,
+ percentageVariation: 0.12261044768784712,
+ value: 178.54,
+ },
+ {
+ compareValue: 7926.82,
+ percentageVariation: 0.020542916327102145,
+ value: 7763.98,
+ },
+ {
+ compareValue: 1316.46,
+ percentageVariation: -0.0009191316105312541,
+ value: 1317.67,
+ },
+]
+
+describe('AnalysisConsumption component', () => {
+ it('should be rendered correctly', async () => {
+ const store = mockStore({
+ ecolyo: {
+ profile: profileData,
+ global: globalStateData,
+ },
+ })
+ const wrapper = mount(
+ <Provider store={store}>
+ <AnalysisConsumption
+ aggregatedPerformanceIndicator={performanceIndicator}
+ peformanceIndicator={performanceIndicators}
+ />
+ </Provider>
+ )
+ await act(async () => {
+ await new Promise(resolve => setTimeout(resolve))
+ wrapper.update()
+ })
+ expect(wrapper.find(StyledCard).exists()).toBeTruthy()
+ expect(wrapper.find('.average-title').exists()).toBeTruthy()
+ expect(wrapper.find('.ideal-title').exists()).toBeFalsy()
+ expect(wrapper.find('.consumption-price').exists()).toBeTruthy()
+ expect(wrapper.find(StyledIcon).exists()).toBeTruthy()
+ })
+ it('should be rendered correctly when click on ideal home button', async () => {
+ const store = mockStore({
+ ecolyo: {
+ profile: profileData,
+ global: globalStateData,
+ },
+ })
+ const wrapper = mount(
+ <Provider store={store}>
+ <AnalysisConsumption
+ aggregatedPerformanceIndicator={performanceIndicator}
+ peformanceIndicator={performanceIndicators}
+ />
+ </Provider>
+ )
+ await act(async () => {
+ await new Promise(resolve => setTimeout(resolve))
+ wrapper.update()
+ })
+ wrapper
+ .find('.link-ideal')
+ .first()
+ .simulate('click')
+ expect(wrapper.find('.ideal-title').exists()).toBeTruthy()
+ expect(wrapper.find('.average-title').exists()).toBeFalsy()
+ })
+ it('should be rendered correctly when click on average home button', async () => {
+ const store = mockStore({
+ ecolyo: {
+ profile: profileData,
+ global: globalStateData,
+ },
+ })
+ const wrapper = mount(
+ <Provider store={store}>
+ <AnalysisConsumption
+ aggregatedPerformanceIndicator={performanceIndicator}
+ peformanceIndicator={performanceIndicators}
+ />
+ </Provider>
+ )
+ await act(async () => {
+ await new Promise(resolve => setTimeout(resolve))
+ wrapper.update()
+ })
+ wrapper
+ .find('.link-average')
+ .first()
+ .simulate('click')
+ expect(wrapper.find('.ideal-title').exists()).toBeFalsy()
+ expect(wrapper.find('.average-title').exists()).toBeTruthy()
+ })
+ it('should redirect to profileType form when click on mui button', async () => {
+ const store = mockStore({
+ ecolyo: {
+ profile: profileData,
+ global: globalStateData,
+ },
+ })
+ const wrapper = mount(
+ <Provider store={store}>
+ <AnalysisConsumption
+ aggregatedPerformanceIndicator={performanceIndicator}
+ peformanceIndicator={performanceIndicators}
+ />
+ </Provider>
+ )
+ await act(async () => {
+ await new Promise(resolve => setTimeout(resolve))
+ wrapper.update()
+ })
+ wrapper
+ .find(MuiButton)
+ .first()
+ .simulate('click')
+ })
+ it('should redirect analysis graph with fluid connected', async () => {
+ const updateGlobalState = { ...globalStateData }
+ updateGlobalState.fluidTypes = [
+ FluidType.ELECTRICITY,
+ FluidType.WATER,
+ FluidType.GAS,
+ ]
+ const store = mockStore({
+ ecolyo: {
+ profile: profileData,
+ global: updateGlobalState,
+ },
+ })
+ mockgetMonthlyForecast.mockResolvedValue(
+ mockMonthlyForecastJanuaryTestProfile1
+ )
+ const wrapper = mount(
+ <Provider store={store}>
+ <AnalysisConsumption
+ aggregatedPerformanceIndicator={performanceIndicator}
+ peformanceIndicator={performanceIndicators}
+ />
+ </Provider>
+ )
+ await act(async () => {
+ await new Promise(resolve => setTimeout(resolve))
+ wrapper.update()
+ })
+ expect(mockgetMonthlyForecast).toHaveBeenCalledWith(
+ profileData.monthlyReportDate.month - 1
+ )
+ })
+})
diff --git a/src/components/Analysis/AnalysisConsumption.tsx b/src/components/Analysis/AnalysisConsumption.tsx
index 90943c17f..83d3e90dd 100644
--- a/src/components/Analysis/AnalysisConsumption.tsx
+++ b/src/components/Analysis/AnalysisConsumption.tsx
@@ -21,13 +21,11 @@ import { formatNumberValues } from 'utils/utils'
interface AnalysisConsumptionProps {
aggregatedPerformanceIndicator: PerformanceIndicator
peformanceIndicator: PerformanceIndicator[]
- fluidTypes: FluidType[]
}
const AnalysisConsumption: React.FC<AnalysisConsumptionProps> = ({
aggregatedPerformanceIndicator,
peformanceIndicator,
- fluidTypes,
}: AnalysisConsumptionProps) => {
const { t } = useI18n()
const history = useHistory()
@@ -35,6 +33,7 @@ const AnalysisConsumption: React.FC<AnalysisConsumptionProps> = ({
const userPriceConsumption: number | null =
aggregatedPerformanceIndicator.value
const profile = useSelector((state: AppStore) => state.ecolyo.profile)
+ const { fluidTypes } = useSelector((state: AppStore) => state.ecolyo.global)
const [homePriceConsumption, setHomePriceConsumption] = useState<number>(0)
const [forecast, setForecast] = useState<MonthlyForecast | null>(null)
const [toggleHome, setToggleHome] = useState<string>('average')
@@ -61,18 +60,18 @@ const AnalysisConsumption: React.FC<AnalysisConsumptionProps> = ({
profile.profileType
)
const MonthlyForecast: MonthlyForecast = await profileTypeService.getMonthlyForecast(
- profile.monthlyReportDate.month
+ profile.monthlyReportDate.month - 1
)
if (subscribed) {
setForecast(MonthlyForecast)
- setHomePriceConsumption(MonthlyForecast.totalValue)
+ MonthlyForecast && setHomePriceConsumption(MonthlyForecast.totalValue)
}
}
loadAverageComsumption()
return () => {
subscribed = false
}
- }, [])
+ }, [profile.profileType, profile.monthlyReportDate.month])
return (
<div className="analysis-graph">
<div className="consumption-title text-20-bold">
--
GitLab