diff --git a/src/components/CommonKit/Card/StyledCard.spec.tsx b/src/components/CommonKit/Card/StyledCard.spec.tsx
index 0ef9813d20279296deef175ef9da1b8e0f11dce4..bfbf4c3ddc4ad8a1c1acb97825d77ca2825d94d3 100644
--- a/src/components/CommonKit/Card/StyledCard.spec.tsx
+++ b/src/components/CommonKit/Card/StyledCard.spec.tsx
@@ -1,27 +1,27 @@
import { FluidType } from 'enums'
-import { mount } from 'enzyme'
import React from 'react'
import StyledCard from './StyledCard'
+import { render } from '@testing-library/react'
describe('StyledCard component test', () => {
it('should render correctly Electricity StyledCard', () => {
- const wrapper = mount(
+ const { container } = render(
<StyledCard fluidType={FluidType.ELECTRICITY}>children</StyledCard>
)
- expect(wrapper.getElement()).toMatchSnapshot()
+ expect(container).toMatchSnapshot()
})
it('should render correctly Water StyledCard', () => {
- const wrapper = mount(
+ const { container } = render(
<StyledCard fluidType={FluidType.WATER}>children</StyledCard>
)
- expect(wrapper.getElement()).toMatchSnapshot()
+ expect(container).toMatchSnapshot()
})
it('should render correctly Gas StyledCard', () => {
- const wrapper = mount(
+ const { container } = render(
<StyledCard fluidType={FluidType.GAS}>children</StyledCard>
)
- expect(wrapper.getElement()).toMatchSnapshot()
+ expect(container).toMatchSnapshot()
})
})
diff --git a/src/components/CommonKit/Card/StyledEcogestureCard.spec.tsx b/src/components/CommonKit/Card/StyledEcogestureCard.spec.tsx
index 6b6aac0e0bf49307d28d643ecc56cae8bd037e98..44d47325068f3c671b1e00d833b80bcbfbb2dd71 100644
--- a/src/components/CommonKit/Card/StyledEcogestureCard.spec.tsx
+++ b/src/components/CommonKit/Card/StyledEcogestureCard.spec.tsx
@@ -1,20 +1,10 @@
-import { mount } from 'enzyme'
+import { render } from '@testing-library/react'
import React from 'react'
import StyledEcogestureCard from './StyledEcogestureCard'
describe('StyledEcogestureCard component test', () => {
it('should render correctly border StyledEcogestureCard', () => {
- const wrapper = mount(<StyledEcogestureCard />)
- expect(wrapper.getElement()).toMatchSnapshot()
- })
-
- it('should render correctly new ecogesture StyledEcogestureCard with newEcogesture', () => {
- const wrapper = mount(<StyledEcogestureCard newEcogesture={true} />)
- expect(wrapper.getElement()).toMatchSnapshot()
- })
-
- it('should render correctly border StyledEcogestureCard with border', () => {
- const wrapper = mount(<StyledEcogestureCard border={true} />)
- expect(wrapper.getElement()).toMatchSnapshot()
+ const { container } = render(<StyledEcogestureCard />)
+ expect(container).toMatchSnapshot()
})
})
diff --git a/src/components/CommonKit/Card/__snapshots__/StyledCard.spec.tsx.snap b/src/components/CommonKit/Card/__snapshots__/StyledCard.spec.tsx.snap
index 520b007502483267ab35c3da4be31661e364b39d..11a9f998a2067203a9602760a8eab49bb2e26bbd 100644
--- a/src/components/CommonKit/Card/__snapshots__/StyledCard.spec.tsx.snap
+++ b/src/components/CommonKit/Card/__snapshots__/StyledCard.spec.tsx.snap
@@ -1,25 +1,67 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`StyledCard component test should render correctly Electricity StyledCard 1`] = `
-<StyledCard
- fluidType={0}
->
- children
-</StyledCard>
+<div>
+ <button
+ class="MuiButtonBase-root MuiCardActionArea-root WithStyles(ForwardRef(CardActionArea))-root-1 undefined electricity"
+ tabindex="0"
+ type="button"
+ >
+ <div
+ class="MuiCardContent-root WithStyles(ForwardRef(CardContent))-root-2"
+ >
+ children
+ </div>
+ <span
+ class="MuiCardActionArea-focusHighlight"
+ />
+ <span
+ class="MuiTouchRipple-root"
+ />
+ </button>
+</div>
`;
exports[`StyledCard component test should render correctly Gas StyledCard 1`] = `
-<StyledCard
- fluidType={2}
->
- children
-</StyledCard>
+<div>
+ <button
+ class="MuiButtonBase-root MuiCardActionArea-root WithStyles(ForwardRef(CardActionArea))-root-5 undefined gas"
+ tabindex="0"
+ type="button"
+ >
+ <div
+ class="MuiCardContent-root WithStyles(ForwardRef(CardContent))-root-6"
+ >
+ children
+ </div>
+ <span
+ class="MuiCardActionArea-focusHighlight"
+ />
+ <span
+ class="MuiTouchRipple-root"
+ />
+ </button>
+</div>
`;
exports[`StyledCard component test should render correctly Water StyledCard 1`] = `
-<StyledCard
- fluidType={1}
->
- children
-</StyledCard>
+<div>
+ <button
+ class="MuiButtonBase-root MuiCardActionArea-root WithStyles(ForwardRef(CardActionArea))-root-3 undefined water"
+ tabindex="0"
+ type="button"
+ >
+ <div
+ class="MuiCardContent-root WithStyles(ForwardRef(CardContent))-root-4"
+ >
+ children
+ </div>
+ <span
+ class="MuiCardActionArea-focusHighlight"
+ />
+ <span
+ class="MuiTouchRipple-root"
+ />
+ </button>
+</div>
`;
diff --git a/src/components/CommonKit/Card/__snapshots__/StyledEcogestureCard.spec.tsx.snap b/src/components/CommonKit/Card/__snapshots__/StyledEcogestureCard.spec.tsx.snap
index a370edbdadc7988390d0c53c7a4c0defcd6ecde1..b5e28e392f275b9041d4a7fde6225f64396a16c4 100644
--- a/src/components/CommonKit/Card/__snapshots__/StyledEcogestureCard.spec.tsx.snap
+++ b/src/components/CommonKit/Card/__snapshots__/StyledEcogestureCard.spec.tsx.snap
@@ -1,15 +1,21 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
-exports[`StyledEcogestureCard component test should render correctly border StyledEcogestureCard 1`] = `<StyledEcogestureCard />`;
-
-exports[`StyledEcogestureCard component test should render correctly border StyledEcogestureCard with border 1`] = `
-<StyledEcogestureCard
- border={true}
-/>
-`;
-
-exports[`StyledEcogestureCard component test should render correctly new ecogesture StyledEcogestureCard with newEcogesture 1`] = `
-<StyledEcogestureCard
- newEcogesture={true}
-/>
+exports[`StyledEcogestureCard component test should render correctly border StyledEcogestureCard 1`] = `
+<div>
+ <button
+ class="MuiButtonBase-root MuiCardActionArea-root WithStyles(ForwardRef(CardActionArea))-root-1"
+ tabindex="0"
+ type="button"
+ >
+ <div
+ class="MuiCardContent-root WithStyles(ForwardRef(CardContent))-root-2"
+ />
+ <span
+ class="MuiCardActionArea-focusHighlight"
+ />
+ <span
+ class="MuiTouchRipple-root"
+ />
+ </button>
+</div>
`;
diff --git a/src/components/CommonKit/FormNavigation/FormNavigation.spec.tsx b/src/components/CommonKit/FormNavigation/FormNavigation.spec.tsx
index 27cd6d1eed3ab8978b06f3d21398a5890c2fce85..c28c8322612668f9fbbf3e0637f934beb1fa87ff 100644
--- a/src/components/CommonKit/FormNavigation/FormNavigation.spec.tsx
+++ b/src/components/CommonKit/FormNavigation/FormNavigation.spec.tsx
@@ -1,32 +1,25 @@
-import Button from '@material-ui/core/Button'
+import { render, screen } from '@testing-library/react'
+import { userEvent } from '@testing-library/user-event'
import { ProfileTypeStepForm } from 'enums'
-import { mount } from 'enzyme'
import React from 'react'
-import { Provider } from 'react-redux'
-import { createMockEcolyoStore } from 'tests/__mocks__/store'
import FormNavigation from './FormNavigation'
describe('FormNavigation component', () => {
- const store = createMockEcolyoStore()
-
- it('should be rendered correctly', () => {
+ it('should call next & previous methods', async () => {
const mockHandlePrevious = jest.fn()
const mockHandleNext = jest.fn()
- const wrapper = mount(
- <Provider store={store}>
- <FormNavigation
- step={ProfileTypeStepForm.COOKING_FLUID}
- handlePrevious={mockHandlePrevious}
- handleNext={mockHandleNext}
- disableNextButton={false}
- />
- </Provider>
+ render(
+ <FormNavigation
+ step={ProfileTypeStepForm.COOKING_FLUID}
+ handlePrevious={mockHandlePrevious}
+ handleNext={mockHandleNext}
+ disableNextButton={false}
+ />
)
- wrapper.find(Button).at(0).simulate('click')
- wrapper.find(Button).at(1).simulate('click')
- expect(wrapper.find('profile-navigation')).toBeTruthy()
- expect(wrapper.find(Button)).toBeTruthy()
- expect(mockHandlePrevious.mock.calls.length).toEqual(1)
- expect(mockHandleNext.mock.calls.length).toEqual(1)
+ const [prevButton, nextButton] = screen.getAllByRole('button')
+ await userEvent.click(prevButton)
+ expect(mockHandlePrevious).toHaveBeenCalled()
+ await userEvent.click(nextButton)
+ expect(mockHandleNext).toHaveBeenCalled()
})
})
diff --git a/src/components/CommonKit/Icon/StyledIcon.spec.tsx b/src/components/CommonKit/Icon/StyledIcon.spec.tsx
index 737e4c756c54de1a4ee64b6c72577aa5ef299dbe..1649ff7ef3d3aed23b0bbcba008e71bdaf1d0b4f 100644
--- a/src/components/CommonKit/Icon/StyledIcon.spec.tsx
+++ b/src/components/CommonKit/Icon/StyledIcon.spec.tsx
@@ -1,23 +1,12 @@
-import { mount } from 'enzyme'
+import { render } from '@testing-library/react'
import React from 'react'
import StyledIcon from './StyledIcon'
describe('StyledIcon component test', () => {
it('should render correctly Icon', () => {
- const mockProps = {
- className: 'className',
- icon: 'icon',
- size: 10,
- }
-
- const wrapper = mount(
- <StyledIcon
- className={mockProps.className}
- icon={mockProps.icon}
- size={mockProps.size}
- />
+ const { container } = render(
+ <StyledIcon className="class" icon="icon" size={10} />
)
-
- expect(wrapper.getElement()).toMatchSnapshot()
+ expect(container).toMatchSnapshot()
})
})
diff --git a/src/components/CommonKit/Icon/__snapshots__/StyledIcon.spec.tsx.snap b/src/components/CommonKit/Icon/__snapshots__/StyledIcon.spec.tsx.snap
index d0fc8b8724902ba99b9ab064d4e7b29f06822dfb..995720a23dfbafe207b4510e273807b8919913fe 100644
--- a/src/components/CommonKit/Icon/__snapshots__/StyledIcon.spec.tsx.snap
+++ b/src/components/CommonKit/Icon/__snapshots__/StyledIcon.spec.tsx.snap
@@ -1,9 +1,16 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`StyledIcon component test should render correctly Icon 1`] = `
-<StyledIcon
- className="className"
- icon="icon"
- size={10}
-/>
+<div>
+ <svg
+ aria-hidden="true"
+ class="class styles__icon___23x3R"
+ height="10"
+ width="10"
+ >
+ <use
+ xlink:href="#icon"
+ />
+ </svg>
+</div>
`;
diff --git a/src/components/CommonKit/IconButton/StyledIconButton.spec.tsx b/src/components/CommonKit/IconButton/StyledIconButton.spec.tsx
index d621190f29c518c206db6daeae52808e1c6ffbcd..b202c401e96a4e5414ca2531d37c5aec10a10eac 100644
--- a/src/components/CommonKit/IconButton/StyledIconButton.spec.tsx
+++ b/src/components/CommonKit/IconButton/StyledIconButton.spec.tsx
@@ -1,18 +1,10 @@
-import { shallow } from 'enzyme'
+import { render } from '@testing-library/react'
import React from 'react'
import StyledIconButton from './StyledIconButton'
describe('StyledIconButton component test', () => {
it('should render correctly StyledIconButton', () => {
- const mockProps = {
- icon: 'icon',
- size: 15,
- }
-
- const wrapper = shallow(
- <StyledIconButton icon={mockProps.icon} sized={mockProps.size} />
- )
-
- expect(wrapper.getElement()).toMatchSnapshot()
+ const { container } = render(<StyledIconButton icon="icon" sized={15} />)
+ expect(container).toMatchSnapshot()
})
})
diff --git a/src/components/CommonKit/IconButton/__snapshots__/StyledIconButton.spec.tsx.snap b/src/components/CommonKit/IconButton/__snapshots__/StyledIconButton.spec.tsx.snap
index f91cdd49811fe980afd9c27de7cd25b30dd99de0..1b037586548e7a7a42b743ff6f58d07f5747cf2e 100644
--- a/src/components/CommonKit/IconButton/__snapshots__/StyledIconButton.spec.tsx.snap
+++ b/src/components/CommonKit/IconButton/__snapshots__/StyledIconButton.spec.tsx.snap
@@ -1,10 +1,29 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`StyledIconButton component test should render correctly StyledIconButton 1`] = `
-<WithStyles(WithStyles(ForwardRef(IconButton)))>
- <StyledIcon
- icon="icon"
- size={15}
- />
-</WithStyles(WithStyles(ForwardRef(IconButton)))>
+<div>
+ <button
+ class="MuiButtonBase-root MuiIconButton-root WithStyles(ForwardRef(IconButton))-root-1"
+ tabindex="0"
+ type="button"
+ >
+ <span
+ class="MuiIconButton-label"
+ >
+ <svg
+ aria-hidden="true"
+ class="styles__icon___23x3R"
+ height="15"
+ width="15"
+ >
+ <use
+ xlink:href="#icon"
+ />
+ </svg>
+ </span>
+ <span
+ class="MuiTouchRipple-root"
+ />
+ </button>
+</div>
`;
diff --git a/src/components/CommonKit/Switch/StyledSwitch.spec.tsx b/src/components/CommonKit/Switch/StyledSwitch.spec.tsx
index 8af7bc846b26a09e14909a28e083b2aaa2fa8de1..17a5b04deb234b43cdf45a4301d116c77bf40b28 100644
--- a/src/components/CommonKit/Switch/StyledSwitch.spec.tsx
+++ b/src/components/CommonKit/Switch/StyledSwitch.spec.tsx
@@ -1,24 +1,23 @@
+import { render } from '@testing-library/react'
import { FluidType } from 'enums'
-import { mount } from 'enzyme'
import React from 'react'
import StyledSwitch from './StyledSwitch'
describe('StyledSwitch component test', () => {
it('should render correctly electricity StyledSwitch', () => {
- const wrapper = mount(<StyledSwitch fluidType={FluidType.ELECTRICITY} />)
-
- expect(wrapper.getElement()).toMatchSnapshot()
+ const { container } = render(
+ <StyledSwitch fluidType={FluidType.ELECTRICITY} />
+ )
+ expect(container).toMatchSnapshot()
})
it('should render correctly water StyledSwitch', () => {
- const wrapper = mount(<StyledSwitch fluidType={FluidType.WATER} />)
-
- expect(wrapper.getElement()).toMatchSnapshot()
+ const { container } = render(<StyledSwitch fluidType={FluidType.WATER} />)
+ expect(container).toMatchSnapshot()
})
it('should render correctly gas StyledSwitch', () => {
- const wrapper = mount(<StyledSwitch fluidType={FluidType.GAS} />)
-
- expect(wrapper.getElement()).toMatchSnapshot()
+ const { container } = render(<StyledSwitch fluidType={FluidType.GAS} />)
+ expect(container).toMatchSnapshot()
})
})
diff --git a/src/components/CommonKit/Switch/__snapshots__/StyledSwitch.spec.tsx.snap b/src/components/CommonKit/Switch/__snapshots__/StyledSwitch.spec.tsx.snap
index a69f06614469b151eed0b9a94b44c6d9ebfd0247..b93dd31b3fa8e9df25c3529abe2c7569c75a260b 100644
--- a/src/components/CommonKit/Switch/__snapshots__/StyledSwitch.spec.tsx.snap
+++ b/src/components/CommonKit/Switch/__snapshots__/StyledSwitch.spec.tsx.snap
@@ -1,19 +1,97 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`StyledSwitch component test should render correctly electricity StyledSwitch 1`] = `
-<StyledSwitch
- fluidType={0}
-/>
+<div>
+ <span
+ class="MuiSwitch-root WithStyles(ForwardRef(Switch))-root-4"
+ >
+ <span
+ aria-disabled="false"
+ class="MuiButtonBase-root MuiIconButton-root PrivateSwitchBase-root-8 MuiSwitch-switchBase WithStyles(ForwardRef(Switch))-switchBase-5 WithStyles(WithStyles(ForwardRef(Switch)))-switchBase-1 MuiSwitch-colorSecondary"
+ >
+ <span
+ class="MuiIconButton-label"
+ >
+ <input
+ class="PrivateSwitchBase-input-11 MuiSwitch-input"
+ type="checkbox"
+ value=""
+ />
+ <span
+ class="MuiSwitch-thumb"
+ />
+ </span>
+ <span
+ class="MuiTouchRipple-root"
+ />
+ </span>
+ <span
+ class="MuiSwitch-track WithStyles(ForwardRef(Switch))-track-7 WithStyles(WithStyles(ForwardRef(Switch)))-track-3"
+ />
+ </span>
+</div>
`;
exports[`StyledSwitch component test should render correctly gas StyledSwitch 1`] = `
-<StyledSwitch
- fluidType={2}
-/>
+<div>
+ <span
+ class="MuiSwitch-root WithStyles(ForwardRef(Switch))-root-26"
+ >
+ <span
+ aria-disabled="false"
+ class="MuiButtonBase-root MuiIconButton-root PrivateSwitchBase-root-30 MuiSwitch-switchBase WithStyles(ForwardRef(Switch))-switchBase-27 WithStyles(WithStyles(ForwardRef(Switch)))-switchBase-23 MuiSwitch-colorSecondary"
+ >
+ <span
+ class="MuiIconButton-label"
+ >
+ <input
+ class="PrivateSwitchBase-input-33 MuiSwitch-input"
+ type="checkbox"
+ value=""
+ />
+ <span
+ class="MuiSwitch-thumb"
+ />
+ </span>
+ <span
+ class="MuiTouchRipple-root"
+ />
+ </span>
+ <span
+ class="MuiSwitch-track WithStyles(ForwardRef(Switch))-track-29 WithStyles(WithStyles(ForwardRef(Switch)))-track-25"
+ />
+ </span>
+</div>
`;
exports[`StyledSwitch component test should render correctly water StyledSwitch 1`] = `
-<StyledSwitch
- fluidType={1}
-/>
+<div>
+ <span
+ class="MuiSwitch-root WithStyles(ForwardRef(Switch))-root-15"
+ >
+ <span
+ aria-disabled="false"
+ class="MuiButtonBase-root MuiIconButton-root PrivateSwitchBase-root-19 MuiSwitch-switchBase WithStyles(ForwardRef(Switch))-switchBase-16 WithStyles(WithStyles(ForwardRef(Switch)))-switchBase-12 MuiSwitch-colorSecondary"
+ >
+ <span
+ class="MuiIconButton-label"
+ >
+ <input
+ class="PrivateSwitchBase-input-22 MuiSwitch-input"
+ type="checkbox"
+ value=""
+ />
+ <span
+ class="MuiSwitch-thumb"
+ />
+ </span>
+ <span
+ class="MuiTouchRipple-root"
+ />
+ </span>
+ <span
+ class="MuiSwitch-track WithStyles(ForwardRef(Switch))-track-18 WithStyles(WithStyles(ForwardRef(Switch)))-track-14"
+ />
+ </span>
+</div>
`;