@jetshop/core/hooks/usePrice.test.js

import { selectPriceType, usePrice } from './usePrice';
import { render } from '@testing-library/react';
import ChannelContext from '../components/ChannelContext';
import React from 'react';

describe('selectPriceType', () => {
  let includeVat;
  let priceObj;
  let initialPriceObj = {
    vat: 10,
    incVat: 30,
    exVat: 20
  };

  beforeEach(() => {
    // Reset the price object
    priceObj = initialPriceObj;
  });

  describe('when includeVat is true', () => {
    beforeEach(() => {
      includeVat = true;
    });
    it('returns only the vat-included value', () => {
      expect(selectPriceType(includeVat, priceObj)).toMatchObject({
        value: 30
      });
    });
    describe('when the passed price object is undefined', () => {
      beforeEach(() => {
        priceObj = undefined;
      });
      it('returns null', () => {
        expect(selectPriceType(includeVat, priceObj)).toBe(null);
      });
    });
  });

  describe('when includeVat is false', () => {
    beforeEach(() => {
      includeVat = false;
    });
    it('returns the vat portion and the exVat value', () => {
      expect(selectPriceType(includeVat, priceObj)).toMatchObject({
        value: 20,
        vat: 10
      });
    });
    describe('when the passed price object is undefined', () => {
      it('returns an object with a null value', () => {
        priceObj = undefined;
        expect(selectPriceType(includeVat, priceObj)).toBe(null);
      });
    });
  });
});

const defaultOpts = {
  price: {
    incVat: 12498.75,
    exVat: 9999,
    vat: 2499.75
  }
};

describe('usePrice', () => {
  it('renders using a custom formatter if provided', () => {
    const { getByText } = setup({
      ...defaultOpts,
      formatter: price => (
        <div>
          <span>{price}</span>
          <span>hi</span>
        </div>
      )
    });

    expect(getByText('12498.75'));
    expect(getByText('hi'));
  });
  it('allows currency to be overridden', () => {
    const { getByText } = setup({
      ...defaultOpts,
      currencyOverride: { code: 'EUR', culture: 'en-IE' }
    });

    expect(getByText('€12,498.75'));
  });
  it('allows includeVat to be overriden', () => {
    const { getByText } = setup({ ...defaultOpts, includeVat: false });

    expect(getByText('SEK 9,999.00'));
  });
  it('sets `hasDiscount` when the price is discounted', () => {
    const { getByText: getByTextDefault } = setup({ ...defaultOpts });
    expect(getByTextDefault('no discount'));

    const { getByText } = setup({
      ...defaultOpts,
      previousPrice: { incVat: 50000.0, exVat: 42000.0, vat: 8000.0 }
    });

    expect(getByText('discounted'));
  });
  it('returns the currency code and culture', () => {
    const { getByText } = setup({ ...defaultOpts });

    expect(getByText('SEK'));
    expect(getByText('sv-SE'));
  });
});

function setup(opts = defaultOpts) {
  const channelCountries = [
    {
      id: 'AU',
      code: 'AU',
      name: 'Australia',
      isDefault: true
    },
    {
      code: 'NZ',
      id: 'NZ',
      name: 'New Zealand',
      isDefault: false
    }
  ];
  const utils = render(
    <ChannelContext.Provider
      value={{
        selectedChannel: {
          countries: channelCountries,
          settings: {
            pricesIncVat: true
          },
          currency: {
            id: 'SEK',
            name: 'SEK',
            isDefault: true,
            format: {
              code: 'SEK',
              culture: 'sv-SE',
              decimals: 2
            }
          }
        }
      }}
    >
      <Wrapper opts={opts} />
    </ChannelContext.Provider>
  );

  return { ...utils };
}

function Wrapper({ opts }) {
  const { currencyLocale, formattedPricing, hasDiscount } = usePrice(opts);

  return (
    <>
      <div>{formattedPricing.price}</div>
      <div>{hasDiscount ? 'discounted' : 'no discount'}</div>
      <div>
        <span>{currencyLocale.code}</span>
        <span>{currencyLocale.culture}</span>
      </div>
    </>
  );
}