weeks_preset_mixin_spec.js 5.21 KB
Newer Older
Kushal Pandya's avatar
Kushal Pandya committed
1 2 3
import Vue from 'vue';

import EpicItemTimelineComponent from 'ee/roadmap/components/epic_item_timeline.vue';
4 5
import { getTimeframeForWeeksView } from 'ee/roadmap/utils/roadmap_utils';

Kushal Pandya's avatar
Kushal Pandya committed
6 7
import { PRESET_TYPES } from 'ee/roadmap/constants';

8 9
import mountComponent from 'helpers/vue_mount_component_helper';
import { mockTimeframeInitialDate, mockEpic } from 'ee_jest/roadmap/mock_data';
10 11

const mockTimeframeWeeks = getTimeframeForWeeksView(mockTimeframeInitialDate);
Kushal Pandya's avatar
Kushal Pandya committed
12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42

const createComponent = ({
  presetType = PRESET_TYPES.WEEKS,
  timeframe = mockTimeframeWeeks,
  timeframeItem = mockTimeframeWeeks[0],
  epic = mockEpic,
}) => {
  const Component = Vue.extend(EpicItemTimelineComponent);

  return mountComponent(Component, {
    presetType,
    timeframe,
    timeframeItem,
    epic,
  });
};

describe('WeeksPresetMixin', () => {
  let vm;

  afterEach(() => {
    vm.$destroy();
  });

  describe('methods', () => {
    describe('hasStartDateForWeek', () => {
      it('returns true when Epic.startDate falls within timeframeItem', () => {
        vm = createComponent({
          epic: Object.assign({}, mockEpic, { startDate: mockTimeframeWeeks[1] }),
          timeframeItem: mockTimeframeWeeks[1],
        });
43

Kushal Pandya's avatar
Kushal Pandya committed
44 45 46 47 48 49 50 51
        expect(vm.hasStartDateForWeek()).toBe(true);
      });

      it('returns false when Epic.startDate does not fall within timeframeItem', () => {
        vm = createComponent({
          epic: Object.assign({}, mockEpic, { startDate: mockTimeframeWeeks[0] }),
          timeframeItem: mockTimeframeWeeks[1],
        });
52

Kushal Pandya's avatar
Kushal Pandya committed
53 54 55 56 57 58 59 60
        expect(vm.hasStartDateForWeek()).toBe(false);
      });
    });

    describe('getLastDayOfWeek', () => {
      it('returns date object set to last day of the week from provided timeframeItem', () => {
        vm = createComponent({});
        const lastDayOfWeek = vm.getLastDayOfWeek(mockTimeframeWeeks[0]);
61

62
        expect(lastDayOfWeek.getDate()).toBe(23);
Kushal Pandya's avatar
Kushal Pandya committed
63 64 65 66 67 68
        expect(lastDayOfWeek.getMonth()).toBe(11);
        expect(lastDayOfWeek.getFullYear()).toBe(2017);
      });
    });

    describe('isTimeframeUnderEndDateForWeek', () => {
69 70
      const timeframeItem = new Date(2018, 0, 7); // Jan 7, 2018

Kushal Pandya's avatar
Kushal Pandya committed
71 72 73 74 75 76
      beforeEach(() => {
        vm = createComponent({});
      });

      it('returns true if provided timeframeItem is under epicEndDate', () => {
        const epicEndDate = new Date(2018, 0, 3); // Jan 3, 2018
77

78 79 80 81 82 83 84
        vm = createComponent({
          epic: Object.assign({}, mockEpic, {
            endDate: epicEndDate,
          }),
        });

        expect(vm.isTimeframeUnderEndDateForWeek(timeframeItem)).toBe(true);
Kushal Pandya's avatar
Kushal Pandya committed
85 86 87 88
      });

      it('returns false if provided timeframeItem is NOT under epicEndDate', () => {
        const epicEndDate = new Date(2018, 0, 15); // Jan 15, 2018
89

90 91 92 93 94 95 96
        vm = createComponent({
          epic: Object.assign({}, mockEpic, {
            endDate: epicEndDate,
          }),
        });

        expect(vm.isTimeframeUnderEndDateForWeek(timeframeItem)).toBe(false);
Kushal Pandya's avatar
Kushal Pandya committed
97 98 99 100 101 102
      });
    });

    describe('getBarWidthForSingleWeek', () => {
      it('returns calculated bar width based on provided cellWidth and day of week', () => {
        vm = createComponent({});
103

Kushal Pandya's avatar
Kushal Pandya committed
104 105 106 107 108 109 110 111 112 113 114
        expect(Math.floor(vm.getBarWidthForSingleWeek(300, 1))).toBe(42); // 10% size
        expect(Math.floor(vm.getBarWidthForSingleWeek(300, 3))).toBe(128); // 50% size
        expect(vm.getBarWidthForSingleWeek(300, 7)).toBe(300); // Full size
      });
    });

    describe('getTimelineBarStartOffsetForWeeks', () => {
      it('returns empty string when Epic startDate is out of range', () => {
        vm = createComponent({
          epic: Object.assign({}, mockEpic, { startDateOutOfRange: true }),
        });
115

Florie Guibert's avatar
Florie Guibert committed
116
        expect(vm.getTimelineBarStartOffsetForWeeks(vm.epic)).toBe('');
Kushal Pandya's avatar
Kushal Pandya committed
117 118 119 120 121 122 123 124 125
      });

      it('returns empty string when Epic startDate is undefined and endDate is out of range', () => {
        vm = createComponent({
          epic: Object.assign({}, mockEpic, {
            startDateUndefined: true,
            endDateOutOfRange: true,
          }),
        });
126

Florie Guibert's avatar
Florie Guibert committed
127
        expect(vm.getTimelineBarStartOffsetForWeeks(vm.epic)).toBe('');
Kushal Pandya's avatar
Kushal Pandya committed
128 129 130 131 132 133 134 135
      });

      it('return `left: 0;` when Epic startDate is first day of the week', () => {
        vm = createComponent({
          epic: Object.assign({}, mockEpic, {
            startDate: mockTimeframeWeeks[0],
          }),
        });
136

Florie Guibert's avatar
Florie Guibert committed
137
        expect(vm.getTimelineBarStartOffsetForWeeks(vm.epic)).toBe('left: 0;');
Kushal Pandya's avatar
Kushal Pandya committed
138 139
      });

Florie Guibert's avatar
Florie Guibert committed
140
      it('returns proportional `left` value based on Epic startDate and days in the week', () => {
Kushal Pandya's avatar
Kushal Pandya committed
141 142 143 144 145
        vm = createComponent({
          epic: Object.assign({}, mockEpic, {
            startDate: new Date(2018, 0, 15),
          }),
        });
146

Florie Guibert's avatar
Florie Guibert committed
147
        expect(vm.getTimelineBarStartOffsetForWeeks(vm.epic)).toContain('left: 38');
Kushal Pandya's avatar
Kushal Pandya committed
148 149 150 151 152 153 154 155 156 157 158 159
      });
    });

    describe('getTimelineBarWidthForWeeks', () => {
      it('returns calculated width value based on Epic.startDate and Epic.endDate', () => {
        vm = createComponent({
          timeframeItem: mockTimeframeWeeks[0],
          epic: Object.assign({}, mockEpic, {
            startDate: new Date(2018, 0, 1), // Jan 1, 2018
            endDate: new Date(2018, 1, 2), // Feb 2, 2018
          }),
        });
160

161
        expect(Math.floor(vm.getTimelineBarWidthForWeeks())).toBe(1208);
Kushal Pandya's avatar
Kushal Pandya committed
162 163 164 165
      });
    });
  });
});