import commonModule from '../..';

describe('wsFancyCurrency directive', () => {
  let outerScope;
  let element;
  let container;
  let symbol;
  let value;

  beforeEach(angular.mock.module(commonModule));

  function injectElement(elementHtml) {
    beforeEach(angular.mock.inject(($rootScope, $compile) => {
      outerScope = $rootScope.$new();
      element = angular.element(elementHtml);
      $compile(element)(outerScope);
      outerScope.$digest();
      element.isolateScope();
      symbol = element.find('sup').text();
      value = element[0].querySelector('.value').innerText;
      container = angular.element(element[0].querySelector('.ws-fancy-formatting'));
    }));
  }

  describe('with only `number` attribute set', () => {
    injectElement('<ws-fancy-currency number="31415" />');

    it('displays it as currency', () => {
      expect(symbol).toEqual('$');
      expect(value).toEqual('31,415');
    });
  });

  describe('with `to-fixed` attribute set to a positive value', () => {
    injectElement('<ws-fancy-currency number="3.1415" to-fixed="3" />');

    it('rounds the number to the given fixed number of decimal points', () => {
      expect(symbol).toEqual('$');
      expect(value).toEqual('3.142');
    });
  });

  describe('with `to-fixed` attribute set to a positive value, with a trailing 0', () => {
    injectElement('<ws-fancy-currency number="3.10" to-fixed="2" />');

    it('rounds the number to the given fixed number of decimal points without truncating the trailing 0', () => {
      expect(symbol).toEqual('$');
      expect(value).toEqual('3.10');
    });
  });

  describe('with `to-fixed` attribute set to 0', () => {
    injectElement('<ws-fancy-currency number="3.1415" to-fixed="0" />');

    it('rounds the number to a whole number', () => {
      expect(symbol).toEqual('$');
      expect(value).toEqual('3');
    });
  });

  describe('with `symbol` attribute set', () => {
    injectElement('<ws-fancy-currency number="3.14" symbol="¥" />');

    it('uses the given symbol', () => {
      expect(symbol).toEqual('¥');
      expect(value).toEqual('3.14');
    });
  });

  describe('color="true" and `number` attribute is a positive number', () => {
    injectElement('<ws-fancy-currency color="true" number="3.14" />');

    it('adds the positive CSS class', () => {
      expect(container.hasClass('positive')).toBe(true);
      expect(container.hasClass('negative')).toBe(false);
      expect(container.hasClass('zero')).toBe(false);
    });
  });

  describe('`number` attribute is a positive number but `color` attribute not set', () => {
    injectElement('<ws-fancy-currency number="3.14" />');

    it('adds no CSS classes', () => {
      expect(container.hasClass('positive')).toBe(false);
      expect(container.hasClass('negative')).toBe(false);
      expect(container.hasClass('zero')).toBe(false);
    });
  });

  describe('color="true" and `number` attribute is a negative number', () => {
    injectElement('<ws-fancy-currency color="true" number="-3.14" />');

    it('adds the negative CSS class', () => {
      expect(container.hasClass('negative')).toBe(true);
      expect(container.hasClass('positive')).toBe(false);
      expect(container.hasClass('zero')).toBe(false);
    });
  });

  describe('color="true" and `number` attribute is zero', () => {
    injectElement('<ws-fancy-currency color="true" number="0" />');

    it('adds the zero CSS class', () => {
      expect(container.hasClass('zero')).toBe(true);
      expect(container.hasClass('positive')).toBe(false);
      expect(container.hasClass('negative')).toBe(false);
    });
  });

  describe('`number` attribute is of string "null"', () => {
    injectElement('<ws-fancy-currency number="null" />');
    it('displays a dash', () => {
      expect(value).toEqual('−');
      expect(symbol).toEqual('');
    });
  });

  describe('`number` attribute is of string blank', () => {
    injectElement('<ws-fancy-currency number="" />');
    it('displays a dash', () => {
      expect(value).toEqual('−');
      expect(symbol).toEqual('');
    });
  });

  describe('`number` attribute is of string undefined', () => {
    injectElement('<ws-fancy-currency number="undefined" />');
    it('displays a dash', () => {
      expect(value).toEqual('−');
      expect(symbol).toEqual('');
    });
  });
});
