import commonModule from '../..';

describe('wsSecondaryNav directive', () => {
  let outerScope;
  let element;

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

  beforeEach(angular.mock.inject(($rootScope) => {
    outerScope = $rootScope.$new();
  }));

  function injectElement(elementHtml) {
    beforeEach(angular.mock.inject(($rootScope, $compile) => {
      element = angular.element(elementHtml);
      $compile(element)(outerScope);
      outerScope.$digest();
      element.isolateScope();
    }));
  }

  describe('with text provided', () => {
    beforeEach(() => {
      outerScope.options = [
        {
          text: 'Option 1',
          state: 'nav-state-one',
        },
        {
          text: 'Option 2',
          state: 'nav-state-two',
        },
        {
          text: 'Option 3',
          state: 'nav-state-three',
        },
      ];
    });

    injectElement('<ws-secondary-nav options="options"></ws-secondary-nav>');

    it('should render the provided options', () => {
      expect(element.html()).toContain('Option 1');
      expect(element.html()).toContain('Option 2');
      expect(element.html()).toContain('Option 3');

      expect(element.html()).toContain('ui-sref="nav-state-one"');
      expect(element.html()).toContain('ui-sref="nav-state-two"');
      expect(element.html()).toContain('ui-sref="nav-state-three"');
    });
  });

  describe('with string ids', () => {
    beforeEach(() => {
      outerScope.options = [
        {
          stringId: 'devo.nav.options.one',
          state: 'nav-state-one',
        },
        {
          stringId: 'devo.nav.options.two',
          state: 'nav-state-two',
        },
        {
          stringId: 'devo.nav.options.three',
          state: 'nav-state-three',
        },
      ];
    });

    injectElement('<ws-secondary-nav options="options"></ws-secondary-nav>');

    it('should render the provided options', () => {
      expect(element.html()).toContain('translated option one');
      expect(element.html()).toContain('translated option two');
      expect(element.html()).toContain('translated option three');

      expect(element.html()).toContain('ui-sref="nav-state-one"');
      expect(element.html()).toContain('ui-sref="nav-state-two"');
      expect(element.html()).toContain('ui-sref="nav-state-three"');
    });
  });
});
