DataloadSectionValue.spec.tsx

import { DataloadSectionType, FluidType } from 'enums'
import { mount } from 'enzyme'
import toJson from 'enzyme-to-json'
import { Dataload } from 'models'
import React from 'react'
import {
  baseDataLoad,
  baseMultiFluidDataLoad,
} from 'tests/__mocks__/chartData.mock'
import DataloadSectionValue from './DataloadSectionValue'

const mockToggleEstimationModal = jest.fn()

describe('DataloadSectionValue component', () => {
  const mockDataload: Dataload = baseDataLoad
  const mockMultiDataload: Dataload = baseMultiFluidDataLoad
  it('should render correctly', () => {
    const wrapper = mount(
      <DataloadSectionValue
        dataload={mockDataload}
        fluidType={FluidType.ELECTRICITY}
        dataloadSectionType={DataloadSectionType.NO_COMPARE}
        toggleEstimationModal={mockToggleEstimationModal}
      />
    )
    expect(toJson(wrapper)).toMatchSnapshot()
  })

  describe('case Singlefluid', () => {
    it('should render with unit when value < 1000', () => {
      const wrapper = mount(
        <DataloadSectionValue
          dataload={mockDataload}
          fluidType={FluidType.ELECTRICITY}
          dataloadSectionType={DataloadSectionType.NO_COMPARE}
          toggleEstimationModal={mockToggleEstimationModal}
        />
      )
      expect(
        wrapper.find(DataloadSectionValue).first().contains('12,00')
      ).toBeTruthy()
      expect(wrapper.find('.text-18-normal').text()).toBe(
        'FLUID.ELECTRICITY.UNIT'
      )
    })
    it('should render with mega unit when value >= 1000', () => {
      const _mockDatalaod: Dataload = { ...mockDataload, value: 1000 }
      const wrapper = mount(
        <DataloadSectionValue
          dataload={_mockDatalaod}
          fluidType={FluidType.ELECTRICITY}
          dataloadSectionType={DataloadSectionType.NO_COMPARE}
          toggleEstimationModal={mockToggleEstimationModal}
        />
      )
      expect(
        wrapper.find(DataloadSectionValue).first().contains('1,00')
      ).toBeTruthy()
      expect(wrapper.find('.text-18-normal').text()).toBe(
        'FLUID.ELECTRICITY.MEGAUNIT'
      )
    })
  })

  describe('case Multifluid', () => {
    it('should render correctly when comparison', () => {
      const wrapper = mount(
        <DataloadSectionValue
          dataload={mockMultiDataload}
          fluidType={FluidType.MULTIFLUID}
          dataloadSectionType={DataloadSectionType.RIGHT}
          toggleEstimationModal={mockToggleEstimationModal}
        />
      )
      expect(
        wrapper.find(DataloadSectionValue).first().contains('12,00')
      ).toBeTruthy()
      expect(wrapper.find('.euroUnit').exists()).toBeTruthy()
    })
    it('should render correctly with a estimated link when no comparison', () => {
      const wrapper = mount(
        <DataloadSectionValue
          dataload={mockMultiDataload}
          fluidType={FluidType.MULTIFLUID}
          dataloadSectionType={DataloadSectionType.NO_COMPARE}
          toggleEstimationModal={mockToggleEstimationModal}
        />
      )
      expect(
        wrapper.find(DataloadSectionValue).first().contains('12,00')
      ).toBeTruthy()
      expect(wrapper.find('.euroUnit').exists()).toBeTruthy()
      expect(wrapper.find('.estimated').exists()).toBeTruthy()
      expect(wrapper.find('.estimated').text()).toBe(
        'consumption_visualizer.estimated'
      )
    })
    it('should call toggleEstimationModal when click on the estimated link', () => {
      const wrapper = mount(
        <DataloadSectionValue
          dataload={mockMultiDataload}
          fluidType={FluidType.MULTIFLUID}
          dataloadSectionType={DataloadSectionType.NO_COMPARE}
          toggleEstimationModal={mockToggleEstimationModal}
        />
      )
      wrapper.find('.estimated').simulate('click')
      expect(mockToggleEstimationModal).toHaveBeenCalled()
    })
  })
})