gitlab-org--gitlab-foss/spec/javascripts/project_select_combo_button_spec.js

import $ from 'jquery';
import ProjectSelectComboButton from '~/project_select_combo_button';

const fixturePath = 'static/project_select_combo_button.html';

describe('Project Select Combo Button', function() {
  preloadFixtures(fixturePath);

  beforeEach(function() {
    this.defaults = {
      label: 'Select project to create issue',
      groupId: 12345,
      projectMeta: {
        name: 'My Cool Project',
        url: 'http://mycoolproject.com',
      },
      newProjectMeta: {
        name: 'My Other Cool Project',
        url: 'http://myothercoolproject.com',
      },
      localStorageKey: 'group-12345-new-issue-recent-project',
      relativePath: 'issues/new',
    };

    loadFixtures(fixturePath);

    this.newItemBtn = document.querySelector('.new-project-item-link');
    this.projectSelectInput = document.querySelector('.project-item-select');
  });

  describe('on page load when localStorage is empty', function() {
    beforeEach(function() {
      this.comboButton = new ProjectSelectComboButton(this.projectSelectInput);
    });

    it('newItemBtn href is null', function() {
      expect(this.newItemBtn.getAttribute('href')).toBe('');
    });

    it('newItemBtn text is the plain default label', function() {
      expect(this.newItemBtn.textContent).toBe(this.defaults.label);
    });
  });

  describe('on page load when localStorage is filled', function() {
    beforeEach(function() {
      window.localStorage.setItem(
        this.defaults.localStorageKey,
        JSON.stringify(this.defaults.projectMeta),
      );
      this.comboButton = new ProjectSelectComboButton(this.projectSelectInput);
    });

    it('newItemBtn href is correctly set', function() {
      expect(this.newItemBtn.getAttribute('href')).toBe(this.defaults.projectMeta.url);
    });

    it('newItemBtn text is the cached label', function() {
      expect(this.newItemBtn.textContent).toBe(`New issue in ${this.defaults.projectMeta.name}`);
    });

    afterEach(function() {
      window.localStorage.clear();
    });
  });

  describe('after selecting a new project', function() {
    beforeEach(function() {
      this.comboButton = new ProjectSelectComboButton(this.projectSelectInput);

      // mock the effect of selecting an item from the projects dropdown (select2)
      $('.project-item-select')
        .val(JSON.stringify(this.defaults.newProjectMeta))
        .trigger('change');
    });

    it('newItemBtn href is correctly set', function() {
      expect(this.newItemBtn.getAttribute('href')).toBe('http://myothercoolproject.com/issues/new');
    });

    it('newItemBtn text is the selected project label', function() {
      expect(this.newItemBtn.textContent).toBe(`New issue in ${this.defaults.newProjectMeta.name}`);
    });

    afterEach(function() {
      window.localStorage.clear();
    });
  });

  describe('deriveTextVariants', function() {
    beforeEach(function() {
      this.mockExecutionContext = {
        resourceType: '',
        resourceLabel: '',
      };

      this.comboButton = new ProjectSelectComboButton(this.projectSelectInput);

      this.method = this.comboButton.deriveTextVariants.bind(this.mockExecutionContext);
    });

    it('correctly derives test variants for merge requests', function() {
      this.mockExecutionContext.resourceType = 'merge_requests';
      this.mockExecutionContext.resourceLabel = 'New merge request';

      const returnedVariants = this.method();

      expect(returnedVariants.localStorageItemType).toBe('new-merge-request');
      expect(returnedVariants.defaultTextPrefix).toBe('New merge request');
      expect(returnedVariants.presetTextSuffix).toBe('merge request');
    });

    it('correctly derives text variants for issues', function() {
      this.mockExecutionContext.resourceType = 'issues';
      this.mockExecutionContext.resourceLabel = 'New issue';

      const returnedVariants = this.method();

      expect(returnedVariants.localStorageItemType).toBe('new-issue');
      expect(returnedVariants.defaultTextPrefix).toBe('New issue');
      expect(returnedVariants.presetTextSuffix).toBe('issue');
    });
  });
});