From 1a4680980752d314575d2ede6a165d7d3d6eaca3 Mon Sep 17 00:00:00 2001
From: Bastien DUMONT <bdumont@grandlyon.com>
Date: Mon, 26 Jun 2023 11:47:41 +0000
Subject: [PATCH] chore(tests): fix cozy-bar tests
---
src/components/Action/ActionView.spec.tsx | 4 -
src/components/Header/CozyBar.spec.tsx | 175 ++--
src/components/Header/CozyBar.tsx | 57 +-
.../__snapshots__/CozyBar.spec.tsx.snap | 878 ++++++++++++++++++
src/types/cozy-bar.d.ts | 1 +
tests/__mocks__/modalStateData.mock.ts | 10 -
6 files changed, 1005 insertions(+), 120 deletions(-)
create mode 100644 src/components/Header/__snapshots__/CozyBar.spec.tsx.snap
delete mode 100644 tests/__mocks__/modalStateData.mock.ts
diff --git a/src/components/Action/ActionView.spec.tsx b/src/components/Action/ActionView.spec.tsx
index e10f9778f..99822aaac 100644
--- a/src/components/Action/ActionView.spec.tsx
+++ b/src/components/Action/ActionView.spec.tsx
@@ -5,7 +5,6 @@ import React from 'react'
import { Provider } from 'react-redux'
import configureStore from 'redux-mock-store'
import { globalStateData } from '../../../tests/__mocks__/globalStateData.mock'
-import { modalStateData } from '../../../tests/__mocks__/modalStateData.mock'
import { profileData } from '../../../tests/__mocks__/profileData.mock'
import { userChallengeData } from '../../../tests/__mocks__/userChallengeData.mock'
import ActionChoose from './ActionChoose'
@@ -46,7 +45,6 @@ describe('ActionView component', () => {
challenge: { currentChallenge: userChallenge },
global: { ...globalStateData, fluidTypes: [0, 1, 2] },
profile: profileData,
- modal: modalStateData,
},
})
const wrapper = mount(
@@ -70,7 +68,6 @@ describe('ActionView component', () => {
challenge: { currentChallenge: userChallenge },
global: { ...globalStateData, fluidTypes: [0, 1, 2] },
profile: profileData,
- modal: modalStateData,
},
})
const wrapper = mount(
@@ -92,7 +89,6 @@ describe('ActionView component', () => {
ecolyo: {
challenge: { currentChallenge: userChallenge },
global: { ...globalStateData, fluidTypes: [0, 1, 2] },
- modal: modalStateData,
profile: profileData,
},
})
diff --git a/src/components/Header/CozyBar.spec.tsx b/src/components/Header/CozyBar.spec.tsx
index aa2e081dd..ab4141b20 100644
--- a/src/components/Header/CozyBar.spec.tsx
+++ b/src/components/Header/CozyBar.spec.tsx
@@ -1,85 +1,108 @@
-// jest.mock('cozy-ui/transpiled/react/I18n', () => {
-// return {
-// useI18n: jest.fn(() => {
-// return {
-// t: (str: string) => str,
-// }
-// }),
-// }
-// })
+import CozyBar from 'components/Header/CozyBar'
+import { ScreenType } from 'enum/screen.enum'
+import { mount } from 'enzyme'
+import toJson from 'enzyme-to-json'
+import React from 'react'
+import { Provider } from 'react-redux'
+import configureStore from 'redux-mock-store'
+import * as ModalAction from 'store/modal/modal.slice'
+import { globalStateData } from '../../../tests/__mocks__/globalStateData.mock'
-// const mockedNavigate = jest.fn()
-// jest.mock('react-router-dom', () => ({
-// ...jest.requireActual('react-router-dom'),
-// useNavigate: () => mockedNavigate,
-// }))
+interface BarProps {
+ children: React.ReactNode
+}
-// const mockStore = configureStore([])
+jest.mock('utils/cozyBar', () => {
+ return {
+ BarLeft: ({ children }: BarProps) => children,
+ BarCenter: ({ children }: BarProps) => children,
+ BarRight: ({ children }: BarProps) => children,
+ }
+})
+
+jest.mock('cozy-ui/transpiled/react/I18n', () => {
+ return {
+ useI18n: jest.fn(() => {
+ return {
+ t: (str: string) => str,
+ }
+ }),
+ }
+})
+
+const mockedNavigate = jest.fn()
+jest.mock('react-router-dom', () => ({
+ ...jest.requireActual('react-router-dom'),
+ useNavigate: () => mockedNavigate,
+}))
+
+const mockStore = configureStore([])
describe('CozyBar component', () => {
- // TODO: fix CozyBar tests
- it('should be tested correctly later', () => {
- expect(true).toBe(true)
+ const store = mockStore({
+ ecolyo: {
+ global: globalStateData,
+ },
+ })
+ it('should be rendered correctly without without left arrow', () => {
+ const wrapper = mount(
+ <Provider store={store}>
+ <CozyBar />
+ </Provider>
+ )
+ expect(toJson(wrapper)).toMatchSnapshot()
})
- // it('should be rendered correctly', () => {
- // const store = mockStore({
- // ecolyo: {
- // global: globalStateData,
- // },
- // })
- // const wrapper = mount(
- // <Provider store={store}>
- // <CozyBar />
- // </Provider>
- // )
- // expect(wrapper.find('BarCenter')).toHaveLength(1)
- // expect(wrapper.find('BarRight')).toHaveLength(1)
- // })
- // it('should call handleClickBack when back button is clicked', () => {
- // const store = mockStore({
- // ecolyo: {
- // global: globalStateData,
- // },
- // })
- // const wrapper = mount(
- // <Provider store={store}>
- // <CozyBar displayBackArrow={true} />
- // </Provider>
- // )
- // expect(wrapper.find('BarLeft')).toHaveLength(1)
- // wrapper.find('BarLeft').find('.cv-button').first().simulate('click')
- // expect(mockedNavigate).toHaveBeenCalled()
- // })
+ describe('should test displayBackArrow', () => {
+ it('should call navigate(-1) when back button is clicked and no function is provided', () => {
+ const wrapper = mount(
+ <Provider store={store}>
+ <CozyBar displayBackArrow={true} />
+ </Provider>
+ )
+ expect(toJson(wrapper)).toMatchSnapshot()
+ expect(wrapper.find('BarLeft')).toHaveLength(1)
+ wrapper.find('BarLeft').find('.cv-button').first().simulate('click')
+ expect(mockedNavigate).toHaveBeenCalled()
+ })
- // it('should call handleClickFeedbacks when feedback button is clicked', () => {
- // const store = mockStore({
- // ecolyo: {
- // global: globalStateData,
- // modal: modalStateData,
- // },
- // })
- // const wrapper = mount(
- // <Provider store={store}>
- // <CozyBar />
- // </Provider>
- // )
- // const updateModalSpy = jest.spyOn(ModalAction, 'openFeedbackModal')
- // wrapper.find('BarRight').find('.cv-button').first().simulate('click')
- // expect(updateModalSpy).toHaveBeenCalledWith(true)
- // })
+ it('should call backFunction() when back button is clicked and function is provided', () => {
+ const mockBackFunction = jest.fn()
+ const wrapper = mount(
+ <Provider store={store}>
+ <CozyBar displayBackArrow={true} backFunction={mockBackFunction} />
+ </Provider>
+ )
+ expect(toJson(wrapper)).toMatchSnapshot()
+ expect(wrapper.find('BarLeft')).toHaveLength(1)
+ wrapper.find('BarLeft').find('.cv-button').first().simulate('click')
+ expect(mockBackFunction).toHaveBeenCalled()
+ })
+ })
- // it('should not be rendered with screen type different from mobile', () => {
- // const store = mockStore({
- // ecolyo: {
- // global: { ...globalStateData, screenType: ScreenType.DESKTOP },
- // },
- // })
- // const wrapper = mount(
- // <Provider store={store}>
- // <CozyBar />
- // </Provider>
- // )
- // expect(wrapper).toEqual({})
- // })
+ it('should call handleClickFeedbacks when feedback button is clicked', () => {
+ const wrapper = mount(
+ <Provider store={store}>
+ <CozyBar />
+ </Provider>
+ )
+ const updateModalSpy = jest.spyOn(ModalAction, 'openFeedbackModal')
+ wrapper.find('BarRight').find('.cv-button').first().simulate('click')
+ expect(updateModalSpy).toHaveBeenCalledWith(true)
+ })
+
+ it('should not be rendered with screen type different from mobile', () => {
+ const store = mockStore({
+ ecolyo: {
+ global: { ...globalStateData, screenType: ScreenType.DESKTOP },
+ },
+ })
+ const wrapper = mount(
+ <Provider store={store}>
+ <CozyBar />
+ </Provider>
+ )
+ // Snapshot should be empty
+ expect(toJson(wrapper)).toMatchSnapshot()
+ })
})
diff --git a/src/components/Header/CozyBar.tsx b/src/components/Header/CozyBar.tsx
index c6343450b..0c0ca0078 100644
--- a/src/components/Header/CozyBar.tsx
+++ b/src/components/Header/CozyBar.tsx
@@ -40,41 +40,38 @@ const CozyBar = ({
dispatch(openFeedbackModal(true))
}
- const cozyBarCustom = (screen?: ScreenType) => {
- if (screen === ScreenType.MOBILE) {
- return (
- <>
- {displayBackArrow && (
- <BarLeft>
- <StyledIconButton
- aria-label={t('header.accessibility.button_back')}
- className="cv-button"
- icon={BackArrowIcon}
- onClick={handleClickBack}
- />
- </BarLeft>
- )}
- <BarCenter>
- <div className="cozy-bar">
- <span className="app-title">{t(titleKey)}</span>
- </div>
- </BarCenter>
- <BarRight>
+ if (screenType === ScreenType.MOBILE) {
+ return (
+ <>
+ {displayBackArrow && (
+ <BarLeft>
<StyledIconButton
- aria-label={t('header.accessibility.button_open_feedbacks')}
+ aria-label={t('header.accessibility.button_back')}
className="cv-button"
- icon={FeedbackIcon}
- sized={22}
- onClick={handleClickFeedbacks}
+ icon={BackArrowIcon}
+ onClick={handleClickBack}
/>
- </BarRight>
- </>
- )
- }
+ </BarLeft>
+ )}
+ <BarCenter>
+ <div className="cozy-bar">
+ <span className="app-title">{t(titleKey)}</span>
+ </div>
+ </BarCenter>
+ <BarRight>
+ <StyledIconButton
+ aria-label={t('header.accessibility.button_open_feedbacks')}
+ className="cv-button"
+ icon={FeedbackIcon}
+ sized={22}
+ onClick={handleClickFeedbacks}
+ />
+ </BarRight>
+ </>
+ )
+ } else {
return null
}
-
- return cozyBarCustom(screenType)
}
export default CozyBar
diff --git a/src/components/Header/__snapshots__/CozyBar.spec.tsx.snap b/src/components/Header/__snapshots__/CozyBar.spec.tsx.snap
new file mode 100644
index 000000000..203c46d61
--- /dev/null
+++ b/src/components/Header/__snapshots__/CozyBar.spec.tsx.snap
@@ -0,0 +1,878 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`CozyBar component should be rendered correctly without without left arrow 1`] = `
+<Provider
+ store={
+ Object {
+ "clearActions": [Function],
+ "dispatch": [Function],
+ "getActions": [Function],
+ "getState": [Function],
+ "replaceReducer": [Function],
+ "subscribe": [Function],
+ }
+ }
+>
+ <CozyBar>
+ <BarCenter>
+ <div
+ className="cozy-bar"
+ >
+ <span
+ className="app-title"
+ >
+ common.title_app
+ </span>
+ </div>
+ </BarCenter>
+ <BarRight>
+ <StyledIconButton
+ aria-label="header.accessibility.button_open_feedbacks"
+ className="cv-button"
+ icon="test-file-stub"
+ onClick={[Function]}
+ sized={22}
+ >
+ <WithStyles(WithStyles(ForwardRef(IconButton)))
+ aria-label="header.accessibility.button_open_feedbacks"
+ className="cv-button"
+ onClick={[Function]}
+ >
+ <WithStyles(ForwardRef(IconButton))
+ aria-label="header.accessibility.button_open_feedbacks"
+ className="cv-button"
+ classes={
+ Object {
+ "root": "WithStyles(ForwardRef(IconButton))-root-1",
+ }
+ }
+ onClick={[Function]}
+ >
+ <ForwardRef(IconButton)
+ aria-label="header.accessibility.button_open_feedbacks"
+ className="cv-button"
+ classes={
+ Object {
+ "colorInherit": "MuiIconButton-colorInherit",
+ "colorPrimary": "MuiIconButton-colorPrimary",
+ "colorSecondary": "MuiIconButton-colorSecondary",
+ "disabled": "Mui-disabled",
+ "edgeEnd": "MuiIconButton-edgeEnd",
+ "edgeStart": "MuiIconButton-edgeStart",
+ "label": "MuiIconButton-label",
+ "root": "MuiIconButton-root WithStyles(ForwardRef(IconButton))-root-1",
+ "sizeSmall": "MuiIconButton-sizeSmall",
+ }
+ }
+ onClick={[Function]}
+ >
+ <WithStyles(ForwardRef(ButtonBase))
+ aria-label="header.accessibility.button_open_feedbacks"
+ centerRipple={true}
+ className="MuiIconButton-root WithStyles(ForwardRef(IconButton))-root-1 cv-button"
+ disabled={false}
+ focusRipple={true}
+ onClick={[Function]}
+ >
+ <ForwardRef(ButtonBase)
+ aria-label="header.accessibility.button_open_feedbacks"
+ centerRipple={true}
+ className="MuiIconButton-root WithStyles(ForwardRef(IconButton))-root-1 cv-button"
+ classes={
+ Object {
+ "disabled": "Mui-disabled",
+ "focusVisible": "Mui-focusVisible",
+ "root": "MuiButtonBase-root",
+ }
+ }
+ disabled={false}
+ focusRipple={true}
+ onClick={[Function]}
+ >
+ <button
+ aria-label="header.accessibility.button_open_feedbacks"
+ className="MuiButtonBase-root MuiIconButton-root WithStyles(ForwardRef(IconButton))-root-1 cv-button"
+ disabled={false}
+ onBlur={[Function]}
+ onClick={[Function]}
+ onDragLeave={[Function]}
+ onFocus={[Function]}
+ onKeyDown={[Function]}
+ onKeyUp={[Function]}
+ onMouseDown={[Function]}
+ onMouseLeave={[Function]}
+ onMouseUp={[Function]}
+ onTouchEnd={[Function]}
+ onTouchMove={[Function]}
+ onTouchStart={[Function]}
+ tabIndex={0}
+ type="button"
+ >
+ <span
+ className="MuiIconButton-label"
+ >
+ <StyledIcon
+ icon="test-file-stub"
+ size={22}
+ >
+ <Icon
+ aria-hidden={true}
+ icon="test-file-stub"
+ size={22}
+ spin={false}
+ >
+ <Component
+ aria-hidden={true}
+ className="styles__icon___23x3R"
+ height={22}
+ style={Object {}}
+ width={22}
+ >
+ <svg
+ aria-hidden={true}
+ className="styles__icon___23x3R"
+ height={22}
+ style={Object {}}
+ width={22}
+ >
+ <use
+ xlinkHref="#test-file-stub"
+ />
+ </svg>
+ </Component>
+ </Icon>
+ </StyledIcon>
+ </span>
+ <WithStyles(memo)
+ center={true}
+ >
+ <ForwardRef(TouchRipple)
+ center={true}
+ classes={
+ Object {
+ "child": "MuiTouchRipple-child",
+ "childLeaving": "MuiTouchRipple-childLeaving",
+ "childPulsate": "MuiTouchRipple-childPulsate",
+ "ripple": "MuiTouchRipple-ripple",
+ "ripplePulsate": "MuiTouchRipple-ripplePulsate",
+ "rippleVisible": "MuiTouchRipple-rippleVisible",
+ "root": "MuiTouchRipple-root",
+ }
+ }
+ >
+ <span
+ className="MuiTouchRipple-root"
+ >
+ <TransitionGroup
+ childFactory={[Function]}
+ component={null}
+ exit={true}
+ />
+ </span>
+ </ForwardRef(TouchRipple)>
+ </WithStyles(memo)>
+ </button>
+ </ForwardRef(ButtonBase)>
+ </WithStyles(ForwardRef(ButtonBase))>
+ </ForwardRef(IconButton)>
+ </WithStyles(ForwardRef(IconButton))>
+ </WithStyles(WithStyles(ForwardRef(IconButton)))>
+ </StyledIconButton>
+ </BarRight>
+ </CozyBar>
+</Provider>
+`;
+
+exports[`CozyBar component should not be rendered with screen type different from mobile 1`] = `
+<Provider
+ store={
+ Object {
+ "clearActions": [Function],
+ "dispatch": [Function],
+ "getActions": [Function],
+ "getState": [Function],
+ "replaceReducer": [Function],
+ "subscribe": [Function],
+ }
+ }
+>
+ <CozyBar />
+</Provider>
+`;
+
+exports[`CozyBar component should test displayBackArrow should call backFunction() when back button is clicked and function is provided 1`] = `
+<Provider
+ store={
+ Object {
+ "clearActions": [Function],
+ "dispatch": [Function],
+ "getActions": [Function],
+ "getState": [Function],
+ "replaceReducer": [Function],
+ "subscribe": [Function],
+ }
+ }
+>
+ <CozyBar
+ backFunction={[MockFunction]}
+ displayBackArrow={true}
+ >
+ <BarLeft>
+ <StyledIconButton
+ aria-label="header.accessibility.button_back"
+ className="cv-button"
+ icon="test-file-stub"
+ onClick={[Function]}
+ >
+ <WithStyles(WithStyles(ForwardRef(IconButton)))
+ aria-label="header.accessibility.button_back"
+ className="cv-button"
+ onClick={[Function]}
+ >
+ <WithStyles(ForwardRef(IconButton))
+ aria-label="header.accessibility.button_back"
+ className="cv-button"
+ classes={
+ Object {
+ "root": "WithStyles(ForwardRef(IconButton))-root-1",
+ }
+ }
+ onClick={[Function]}
+ >
+ <ForwardRef(IconButton)
+ aria-label="header.accessibility.button_back"
+ className="cv-button"
+ classes={
+ Object {
+ "colorInherit": "MuiIconButton-colorInherit",
+ "colorPrimary": "MuiIconButton-colorPrimary",
+ "colorSecondary": "MuiIconButton-colorSecondary",
+ "disabled": "Mui-disabled",
+ "edgeEnd": "MuiIconButton-edgeEnd",
+ "edgeStart": "MuiIconButton-edgeStart",
+ "label": "MuiIconButton-label",
+ "root": "MuiIconButton-root WithStyles(ForwardRef(IconButton))-root-1",
+ "sizeSmall": "MuiIconButton-sizeSmall",
+ }
+ }
+ onClick={[Function]}
+ >
+ <WithStyles(ForwardRef(ButtonBase))
+ aria-label="header.accessibility.button_back"
+ centerRipple={true}
+ className="MuiIconButton-root WithStyles(ForwardRef(IconButton))-root-1 cv-button"
+ disabled={false}
+ focusRipple={true}
+ onClick={[Function]}
+ >
+ <ForwardRef(ButtonBase)
+ aria-label="header.accessibility.button_back"
+ centerRipple={true}
+ className="MuiIconButton-root WithStyles(ForwardRef(IconButton))-root-1 cv-button"
+ classes={
+ Object {
+ "disabled": "Mui-disabled",
+ "focusVisible": "Mui-focusVisible",
+ "root": "MuiButtonBase-root",
+ }
+ }
+ disabled={false}
+ focusRipple={true}
+ onClick={[Function]}
+ >
+ <button
+ aria-label="header.accessibility.button_back"
+ className="MuiButtonBase-root MuiIconButton-root WithStyles(ForwardRef(IconButton))-root-1 cv-button"
+ disabled={false}
+ onBlur={[Function]}
+ onClick={[Function]}
+ onDragLeave={[Function]}
+ onFocus={[Function]}
+ onKeyDown={[Function]}
+ onKeyUp={[Function]}
+ onMouseDown={[Function]}
+ onMouseLeave={[Function]}
+ onMouseUp={[Function]}
+ onTouchEnd={[Function]}
+ onTouchMove={[Function]}
+ onTouchStart={[Function]}
+ tabIndex={0}
+ type="button"
+ >
+ <span
+ className="MuiIconButton-label"
+ >
+ <StyledIcon
+ icon="test-file-stub"
+ size={16}
+ >
+ <Icon
+ aria-hidden={true}
+ icon="test-file-stub"
+ size={16}
+ spin={false}
+ >
+ <Component
+ aria-hidden={true}
+ className="styles__icon___23x3R"
+ height={16}
+ style={Object {}}
+ width={16}
+ >
+ <svg
+ aria-hidden={true}
+ className="styles__icon___23x3R"
+ height={16}
+ style={Object {}}
+ width={16}
+ >
+ <use
+ xlinkHref="#test-file-stub"
+ />
+ </svg>
+ </Component>
+ </Icon>
+ </StyledIcon>
+ </span>
+ <WithStyles(memo)
+ center={true}
+ >
+ <ForwardRef(TouchRipple)
+ center={true}
+ classes={
+ Object {
+ "child": "MuiTouchRipple-child",
+ "childLeaving": "MuiTouchRipple-childLeaving",
+ "childPulsate": "MuiTouchRipple-childPulsate",
+ "ripple": "MuiTouchRipple-ripple",
+ "ripplePulsate": "MuiTouchRipple-ripplePulsate",
+ "rippleVisible": "MuiTouchRipple-rippleVisible",
+ "root": "MuiTouchRipple-root",
+ }
+ }
+ >
+ <span
+ className="MuiTouchRipple-root"
+ >
+ <TransitionGroup
+ childFactory={[Function]}
+ component={null}
+ exit={true}
+ />
+ </span>
+ </ForwardRef(TouchRipple)>
+ </WithStyles(memo)>
+ </button>
+ </ForwardRef(ButtonBase)>
+ </WithStyles(ForwardRef(ButtonBase))>
+ </ForwardRef(IconButton)>
+ </WithStyles(ForwardRef(IconButton))>
+ </WithStyles(WithStyles(ForwardRef(IconButton)))>
+ </StyledIconButton>
+ </BarLeft>
+ <BarCenter>
+ <div
+ className="cozy-bar"
+ >
+ <span
+ className="app-title"
+ >
+ common.title_app
+ </span>
+ </div>
+ </BarCenter>
+ <BarRight>
+ <StyledIconButton
+ aria-label="header.accessibility.button_open_feedbacks"
+ className="cv-button"
+ icon="test-file-stub"
+ onClick={[Function]}
+ sized={22}
+ >
+ <WithStyles(WithStyles(ForwardRef(IconButton)))
+ aria-label="header.accessibility.button_open_feedbacks"
+ className="cv-button"
+ onClick={[Function]}
+ >
+ <WithStyles(ForwardRef(IconButton))
+ aria-label="header.accessibility.button_open_feedbacks"
+ className="cv-button"
+ classes={
+ Object {
+ "root": "WithStyles(ForwardRef(IconButton))-root-1",
+ }
+ }
+ onClick={[Function]}
+ >
+ <ForwardRef(IconButton)
+ aria-label="header.accessibility.button_open_feedbacks"
+ className="cv-button"
+ classes={
+ Object {
+ "colorInherit": "MuiIconButton-colorInherit",
+ "colorPrimary": "MuiIconButton-colorPrimary",
+ "colorSecondary": "MuiIconButton-colorSecondary",
+ "disabled": "Mui-disabled",
+ "edgeEnd": "MuiIconButton-edgeEnd",
+ "edgeStart": "MuiIconButton-edgeStart",
+ "label": "MuiIconButton-label",
+ "root": "MuiIconButton-root WithStyles(ForwardRef(IconButton))-root-1",
+ "sizeSmall": "MuiIconButton-sizeSmall",
+ }
+ }
+ onClick={[Function]}
+ >
+ <WithStyles(ForwardRef(ButtonBase))
+ aria-label="header.accessibility.button_open_feedbacks"
+ centerRipple={true}
+ className="MuiIconButton-root WithStyles(ForwardRef(IconButton))-root-1 cv-button"
+ disabled={false}
+ focusRipple={true}
+ onClick={[Function]}
+ >
+ <ForwardRef(ButtonBase)
+ aria-label="header.accessibility.button_open_feedbacks"
+ centerRipple={true}
+ className="MuiIconButton-root WithStyles(ForwardRef(IconButton))-root-1 cv-button"
+ classes={
+ Object {
+ "disabled": "Mui-disabled",
+ "focusVisible": "Mui-focusVisible",
+ "root": "MuiButtonBase-root",
+ }
+ }
+ disabled={false}
+ focusRipple={true}
+ onClick={[Function]}
+ >
+ <button
+ aria-label="header.accessibility.button_open_feedbacks"
+ className="MuiButtonBase-root MuiIconButton-root WithStyles(ForwardRef(IconButton))-root-1 cv-button"
+ disabled={false}
+ onBlur={[Function]}
+ onClick={[Function]}
+ onDragLeave={[Function]}
+ onFocus={[Function]}
+ onKeyDown={[Function]}
+ onKeyUp={[Function]}
+ onMouseDown={[Function]}
+ onMouseLeave={[Function]}
+ onMouseUp={[Function]}
+ onTouchEnd={[Function]}
+ onTouchMove={[Function]}
+ onTouchStart={[Function]}
+ tabIndex={0}
+ type="button"
+ >
+ <span
+ className="MuiIconButton-label"
+ >
+ <StyledIcon
+ icon="test-file-stub"
+ size={22}
+ >
+ <Icon
+ aria-hidden={true}
+ icon="test-file-stub"
+ size={22}
+ spin={false}
+ >
+ <Component
+ aria-hidden={true}
+ className="styles__icon___23x3R"
+ height={22}
+ style={Object {}}
+ width={22}
+ >
+ <svg
+ aria-hidden={true}
+ className="styles__icon___23x3R"
+ height={22}
+ style={Object {}}
+ width={22}
+ >
+ <use
+ xlinkHref="#test-file-stub"
+ />
+ </svg>
+ </Component>
+ </Icon>
+ </StyledIcon>
+ </span>
+ <WithStyles(memo)
+ center={true}
+ >
+ <ForwardRef(TouchRipple)
+ center={true}
+ classes={
+ Object {
+ "child": "MuiTouchRipple-child",
+ "childLeaving": "MuiTouchRipple-childLeaving",
+ "childPulsate": "MuiTouchRipple-childPulsate",
+ "ripple": "MuiTouchRipple-ripple",
+ "ripplePulsate": "MuiTouchRipple-ripplePulsate",
+ "rippleVisible": "MuiTouchRipple-rippleVisible",
+ "root": "MuiTouchRipple-root",
+ }
+ }
+ >
+ <span
+ className="MuiTouchRipple-root"
+ >
+ <TransitionGroup
+ childFactory={[Function]}
+ component={null}
+ exit={true}
+ />
+ </span>
+ </ForwardRef(TouchRipple)>
+ </WithStyles(memo)>
+ </button>
+ </ForwardRef(ButtonBase)>
+ </WithStyles(ForwardRef(ButtonBase))>
+ </ForwardRef(IconButton)>
+ </WithStyles(ForwardRef(IconButton))>
+ </WithStyles(WithStyles(ForwardRef(IconButton)))>
+ </StyledIconButton>
+ </BarRight>
+ </CozyBar>
+</Provider>
+`;
+
+exports[`CozyBar component should test displayBackArrow should call navigate(-1) when back button is clicked and no function is provided 1`] = `
+<Provider
+ store={
+ Object {
+ "clearActions": [Function],
+ "dispatch": [Function],
+ "getActions": [Function],
+ "getState": [Function],
+ "replaceReducer": [Function],
+ "subscribe": [Function],
+ }
+ }
+>
+ <CozyBar
+ displayBackArrow={true}
+ >
+ <BarLeft>
+ <StyledIconButton
+ aria-label="header.accessibility.button_back"
+ className="cv-button"
+ icon="test-file-stub"
+ onClick={[Function]}
+ >
+ <WithStyles(WithStyles(ForwardRef(IconButton)))
+ aria-label="header.accessibility.button_back"
+ className="cv-button"
+ onClick={[Function]}
+ >
+ <WithStyles(ForwardRef(IconButton))
+ aria-label="header.accessibility.button_back"
+ className="cv-button"
+ classes={
+ Object {
+ "root": "WithStyles(ForwardRef(IconButton))-root-1",
+ }
+ }
+ onClick={[Function]}
+ >
+ <ForwardRef(IconButton)
+ aria-label="header.accessibility.button_back"
+ className="cv-button"
+ classes={
+ Object {
+ "colorInherit": "MuiIconButton-colorInherit",
+ "colorPrimary": "MuiIconButton-colorPrimary",
+ "colorSecondary": "MuiIconButton-colorSecondary",
+ "disabled": "Mui-disabled",
+ "edgeEnd": "MuiIconButton-edgeEnd",
+ "edgeStart": "MuiIconButton-edgeStart",
+ "label": "MuiIconButton-label",
+ "root": "MuiIconButton-root WithStyles(ForwardRef(IconButton))-root-1",
+ "sizeSmall": "MuiIconButton-sizeSmall",
+ }
+ }
+ onClick={[Function]}
+ >
+ <WithStyles(ForwardRef(ButtonBase))
+ aria-label="header.accessibility.button_back"
+ centerRipple={true}
+ className="MuiIconButton-root WithStyles(ForwardRef(IconButton))-root-1 cv-button"
+ disabled={false}
+ focusRipple={true}
+ onClick={[Function]}
+ >
+ <ForwardRef(ButtonBase)
+ aria-label="header.accessibility.button_back"
+ centerRipple={true}
+ className="MuiIconButton-root WithStyles(ForwardRef(IconButton))-root-1 cv-button"
+ classes={
+ Object {
+ "disabled": "Mui-disabled",
+ "focusVisible": "Mui-focusVisible",
+ "root": "MuiButtonBase-root",
+ }
+ }
+ disabled={false}
+ focusRipple={true}
+ onClick={[Function]}
+ >
+ <button
+ aria-label="header.accessibility.button_back"
+ className="MuiButtonBase-root MuiIconButton-root WithStyles(ForwardRef(IconButton))-root-1 cv-button"
+ disabled={false}
+ onBlur={[Function]}
+ onClick={[Function]}
+ onDragLeave={[Function]}
+ onFocus={[Function]}
+ onKeyDown={[Function]}
+ onKeyUp={[Function]}
+ onMouseDown={[Function]}
+ onMouseLeave={[Function]}
+ onMouseUp={[Function]}
+ onTouchEnd={[Function]}
+ onTouchMove={[Function]}
+ onTouchStart={[Function]}
+ tabIndex={0}
+ type="button"
+ >
+ <span
+ className="MuiIconButton-label"
+ >
+ <StyledIcon
+ icon="test-file-stub"
+ size={16}
+ >
+ <Icon
+ aria-hidden={true}
+ icon="test-file-stub"
+ size={16}
+ spin={false}
+ >
+ <Component
+ aria-hidden={true}
+ className="styles__icon___23x3R"
+ height={16}
+ style={Object {}}
+ width={16}
+ >
+ <svg
+ aria-hidden={true}
+ className="styles__icon___23x3R"
+ height={16}
+ style={Object {}}
+ width={16}
+ >
+ <use
+ xlinkHref="#test-file-stub"
+ />
+ </svg>
+ </Component>
+ </Icon>
+ </StyledIcon>
+ </span>
+ <WithStyles(memo)
+ center={true}
+ >
+ <ForwardRef(TouchRipple)
+ center={true}
+ classes={
+ Object {
+ "child": "MuiTouchRipple-child",
+ "childLeaving": "MuiTouchRipple-childLeaving",
+ "childPulsate": "MuiTouchRipple-childPulsate",
+ "ripple": "MuiTouchRipple-ripple",
+ "ripplePulsate": "MuiTouchRipple-ripplePulsate",
+ "rippleVisible": "MuiTouchRipple-rippleVisible",
+ "root": "MuiTouchRipple-root",
+ }
+ }
+ >
+ <span
+ className="MuiTouchRipple-root"
+ >
+ <TransitionGroup
+ childFactory={[Function]}
+ component={null}
+ exit={true}
+ />
+ </span>
+ </ForwardRef(TouchRipple)>
+ </WithStyles(memo)>
+ </button>
+ </ForwardRef(ButtonBase)>
+ </WithStyles(ForwardRef(ButtonBase))>
+ </ForwardRef(IconButton)>
+ </WithStyles(ForwardRef(IconButton))>
+ </WithStyles(WithStyles(ForwardRef(IconButton)))>
+ </StyledIconButton>
+ </BarLeft>
+ <BarCenter>
+ <div
+ className="cozy-bar"
+ >
+ <span
+ className="app-title"
+ >
+ common.title_app
+ </span>
+ </div>
+ </BarCenter>
+ <BarRight>
+ <StyledIconButton
+ aria-label="header.accessibility.button_open_feedbacks"
+ className="cv-button"
+ icon="test-file-stub"
+ onClick={[Function]}
+ sized={22}
+ >
+ <WithStyles(WithStyles(ForwardRef(IconButton)))
+ aria-label="header.accessibility.button_open_feedbacks"
+ className="cv-button"
+ onClick={[Function]}
+ >
+ <WithStyles(ForwardRef(IconButton))
+ aria-label="header.accessibility.button_open_feedbacks"
+ className="cv-button"
+ classes={
+ Object {
+ "root": "WithStyles(ForwardRef(IconButton))-root-1",
+ }
+ }
+ onClick={[Function]}
+ >
+ <ForwardRef(IconButton)
+ aria-label="header.accessibility.button_open_feedbacks"
+ className="cv-button"
+ classes={
+ Object {
+ "colorInherit": "MuiIconButton-colorInherit",
+ "colorPrimary": "MuiIconButton-colorPrimary",
+ "colorSecondary": "MuiIconButton-colorSecondary",
+ "disabled": "Mui-disabled",
+ "edgeEnd": "MuiIconButton-edgeEnd",
+ "edgeStart": "MuiIconButton-edgeStart",
+ "label": "MuiIconButton-label",
+ "root": "MuiIconButton-root WithStyles(ForwardRef(IconButton))-root-1",
+ "sizeSmall": "MuiIconButton-sizeSmall",
+ }
+ }
+ onClick={[Function]}
+ >
+ <WithStyles(ForwardRef(ButtonBase))
+ aria-label="header.accessibility.button_open_feedbacks"
+ centerRipple={true}
+ className="MuiIconButton-root WithStyles(ForwardRef(IconButton))-root-1 cv-button"
+ disabled={false}
+ focusRipple={true}
+ onClick={[Function]}
+ >
+ <ForwardRef(ButtonBase)
+ aria-label="header.accessibility.button_open_feedbacks"
+ centerRipple={true}
+ className="MuiIconButton-root WithStyles(ForwardRef(IconButton))-root-1 cv-button"
+ classes={
+ Object {
+ "disabled": "Mui-disabled",
+ "focusVisible": "Mui-focusVisible",
+ "root": "MuiButtonBase-root",
+ }
+ }
+ disabled={false}
+ focusRipple={true}
+ onClick={[Function]}
+ >
+ <button
+ aria-label="header.accessibility.button_open_feedbacks"
+ className="MuiButtonBase-root MuiIconButton-root WithStyles(ForwardRef(IconButton))-root-1 cv-button"
+ disabled={false}
+ onBlur={[Function]}
+ onClick={[Function]}
+ onDragLeave={[Function]}
+ onFocus={[Function]}
+ onKeyDown={[Function]}
+ onKeyUp={[Function]}
+ onMouseDown={[Function]}
+ onMouseLeave={[Function]}
+ onMouseUp={[Function]}
+ onTouchEnd={[Function]}
+ onTouchMove={[Function]}
+ onTouchStart={[Function]}
+ tabIndex={0}
+ type="button"
+ >
+ <span
+ className="MuiIconButton-label"
+ >
+ <StyledIcon
+ icon="test-file-stub"
+ size={22}
+ >
+ <Icon
+ aria-hidden={true}
+ icon="test-file-stub"
+ size={22}
+ spin={false}
+ >
+ <Component
+ aria-hidden={true}
+ className="styles__icon___23x3R"
+ height={22}
+ style={Object {}}
+ width={22}
+ >
+ <svg
+ aria-hidden={true}
+ className="styles__icon___23x3R"
+ height={22}
+ style={Object {}}
+ width={22}
+ >
+ <use
+ xlinkHref="#test-file-stub"
+ />
+ </svg>
+ </Component>
+ </Icon>
+ </StyledIcon>
+ </span>
+ <WithStyles(memo)
+ center={true}
+ >
+ <ForwardRef(TouchRipple)
+ center={true}
+ classes={
+ Object {
+ "child": "MuiTouchRipple-child",
+ "childLeaving": "MuiTouchRipple-childLeaving",
+ "childPulsate": "MuiTouchRipple-childPulsate",
+ "ripple": "MuiTouchRipple-ripple",
+ "ripplePulsate": "MuiTouchRipple-ripplePulsate",
+ "rippleVisible": "MuiTouchRipple-rippleVisible",
+ "root": "MuiTouchRipple-root",
+ }
+ }
+ >
+ <span
+ className="MuiTouchRipple-root"
+ >
+ <TransitionGroup
+ childFactory={[Function]}
+ component={null}
+ exit={true}
+ />
+ </span>
+ </ForwardRef(TouchRipple)>
+ </WithStyles(memo)>
+ </button>
+ </ForwardRef(ButtonBase)>
+ </WithStyles(ForwardRef(ButtonBase))>
+ </ForwardRef(IconButton)>
+ </WithStyles(ForwardRef(IconButton))>
+ </WithStyles(WithStyles(ForwardRef(IconButton)))>
+ </StyledIconButton>
+ </BarRight>
+ </CozyBar>
+</Provider>
+`;
diff --git a/src/types/cozy-bar.d.ts b/src/types/cozy-bar.d.ts
index 706ada989..3eb901e72 100644
--- a/src/types/cozy-bar.d.ts
+++ b/src/types/cozy-bar.d.ts
@@ -8,6 +8,7 @@ declare module 'cozy-bar' {
appSlug?: string
lang: string
iconPath: string
+ isInvertedTheme: string
cozyClient: Client
cozyURL?: string
ssl?: boolean
diff --git a/tests/__mocks__/modalStateData.mock.ts b/tests/__mocks__/modalStateData.mock.ts
deleted file mode 100644
index be2d0569a..000000000
--- a/tests/__mocks__/modalStateData.mock.ts
+++ /dev/null
@@ -1,10 +0,0 @@
-import { ModalState } from 'models'
-
-export const modalStateData: ModalState = {
- isFeedbacksOpen: false,
- partnersIssueModal: {
- egl: false,
- enedis: false,
- grdf: false,
- },
-}
--
GitLab