TotalConsumption.spec.tsx

import { render, screen, waitFor } from '@testing-library/react'
import { FluidType, TimeStep } from 'enums'
import React from 'react'
import { Provider } from 'react-redux'
import { graphData } from 'tests/__mocks__/chartData.mock'
import { createMockEcolyoStore, mockChartState } from 'tests/__mocks__/store'
import TotalConsumption from './TotalConsumption'

const mockChartStore = createMockEcolyoStore({
  chart: {
    ...mockChartState,
    currentDatachart: graphData,
  },
})

describe('TotalConsumption component', () => {
  it('should be rendered correctly and render euro value', async () => {
    const { container } = render(
      <Provider store={mockChartStore}>
        <TotalConsumption fluidType={FluidType.ELECTRICITY} />
      </Provider>
    )
    await waitFor(() => null, { container })
    expect(container).toMatchSnapshot()
    expect(screen.getByText('32,92')).toBeInTheDocument()
  })

  it('should format multifluid value', async () => {
    const { container } = render(
      <Provider store={mockChartStore}>
        <TotalConsumption fluidType={FluidType.MULTIFLUID} />
      </Provider>
    )
    await waitFor(() => null, { container })
    expect(screen.getByText('130,84')).toBeInTheDocument()
  })
  it('should format multifluid value AND compared value', async () => {
    const store = createMockEcolyoStore({
      chart: {
        ...mockChartState,
        currentDatachart: graphData,
        showCompare: true,
        currentTimeStep: TimeStep.DAY,
      },
    })
    const { container } = render(
      <Provider store={store}>
        <TotalConsumption fluidType={FluidType.MULTIFLUID} />
      </Provider>
    )
    await waitFor(() => null, { container })
    expect(screen.getByText('130,84')).toBeInTheDocument()
    expect(screen.getByText('110,66')).toBeInTheDocument()
  })
  it('should display ----- when half an hour electricity data is not activated', async () => {
    const store = createMockEcolyoStore()
    const { container } = render(
      <Provider store={store}>
        <TotalConsumption fluidType={FluidType.ELECTRICITY} />
      </Provider>
    )
    await waitFor(() => null, { container })
    expect(screen.getByText('-----')).toBeInTheDocument()
  })
})