Create timezones fixtures

ee/spec/frontend/oncall_schedule/__snapshots__/add_edit_schedule_form_spec.js.snap

@@ -39,86 +39,10 @@ exports[`AddEditScheduleForm renders form layout 1`] = `
     required=""
     state="true"
   >
-    <gl-dropdown-stub
-      category="primary"
+    <div
       class="timezone-dropdown gl-w-full"
-      headertext="Select timezone"
-      hideheaderborder="true"
       id="schedule-timezone"
-      size="medium"
-      text=""
-      variant="default"
-    >
-       
-      <gl-search-box-by-type-stub
-        clearbuttontitle="Clear"
-        value=""
-      />
-       
-      <gl-dropdown-item-stub
-        avatarurl=""
-        iconcolor=""
-        iconname=""
-        iconrightarialabel=""
-        iconrightname=""
-        ischecked="true"
-        ischeckitem="true"
-        secondarytext=""
-      >
-        <span
-          class="gl-white-space-nowrap"
-        >
-          (UTC -12:00) -12 International Date Line West
-        </span>
-      </gl-dropdown-item-stub>
-      <gl-dropdown-item-stub
-        avatarurl=""
-        iconcolor=""
-        iconname=""
-        iconrightarialabel=""
-        iconrightname=""
-        ischeckitem="true"
-        secondarytext=""
-      >
-        <span
-          class="gl-white-space-nowrap"
-        >
-          (UTC -11:00) SST American Samoa
-        </span>
-      </gl-dropdown-item-stub>
-      <gl-dropdown-item-stub
-        avatarurl=""
-        iconcolor=""
-        iconname=""
-        iconrightarialabel=""
-        iconrightname=""
-        ischeckitem="true"
-        secondarytext=""
-      >
-        <span
-          class="gl-white-space-nowrap"
-        >
-          (UTC -11:00) SST Midway Island
-        </span>
-      </gl-dropdown-item-stub>
-      <gl-dropdown-item-stub
-        avatarurl=""
-        iconcolor=""
-        iconname=""
-        iconrightarialabel=""
-        iconrightname=""
-        ischeckitem="true"
-        secondarytext=""
-      >
-        <span
-          class="gl-white-space-nowrap"
-        >
-          (UTC -7:00) PT Pacific Time (US & Canada)
-        </span>
-      </gl-dropdown-item-stub>
-       
-      <!---->
-    </gl-dropdown-stub>
+    />
   </gl-form-group-stub>
 </gl-form-stub>
 `;

ee/spec/frontend/oncall_schedule/add_edit_schedule_form_spec.js

@@ -3,8 +3,10 @@ import { shallowMount } from '@vue/test-utils';
 import AddEditScheduleForm, {
   i18n,
 } from 'ee/oncall_schedules/components/add_edit_schedule_form.vue';
+import { stubComponent } from 'helpers/stub_component';
 import { getOncallSchedulesQueryResponse } from './mocks/apollo_mock';
-import mockTimezones from './mocks/mock_timezones.json';
+
+const mockTimezones = getJSONFixture('timezones/full.json');
 
 describe('AddEditScheduleForm', () => {
   let wrapper;
@@ -13,7 +15,7 @@ describe('AddEditScheduleForm', () => {
   const mockSchedule =
     getOncallSchedulesQueryResponse.data.project.incidentManagementOncallSchedules.nodes[0];
 
-  const createComponent = ({ props = {} } = {}) => {
+  const createComponent = ({ props = {}, stubs = {} } = {}) => {
     wrapper = shallowMount(AddEditScheduleForm, {
       propsData: {
         form: {
@@ -36,13 +38,10 @@ describe('AddEditScheduleForm', () => {
           mutate,
         },
       },
+      stubs,
     });
   };
 
-  beforeEach(() => {
-    createComponent();
-  });
-
   afterEach(() => {
     wrapper.destroy();
   });
@@ -53,6 +52,13 @@ describe('AddEditScheduleForm', () => {
   const findScheduleName = () => wrapper.find(GlFormGroup);
 
   it('renders form layout', () => {
+    createComponent({
+      stubs: {
+        GlDropdown: stubComponent(GlDropdown, {
+          template: `<div />`,
+        }),
+      },
+    });
     expect(wrapper.element).toMatchSnapshot();
   });
 
@@ -68,6 +74,10 @@ describe('AddEditScheduleForm', () => {
   });
 
   describe('Timezone select', () => {
+    beforeEach(() => {
+      createComponent();
+    });
+
     it('has options based on provided BE data', () => {
       expect(findDropdownOptions()).toHaveLength(mockTimezones.length);
     });
@@ -81,6 +91,10 @@ describe('AddEditScheduleForm', () => {
     });
 
     describe('timezones filtering', () => {
+      beforeEach(() => {
+        createComponent();
+      });
+
       it('should filter options based on search term', async () => {
         const searchTerm = 'Pacific';
         findTimezoneSearchBox().vm.$emit('input', searchTerm);

ee/spec/frontend/oncall_schedule/add_edit_schedule_modal_spec.js

@@ -18,7 +18,8 @@ import {
   updateScheduleResponse,
   updateScheduleResponseWithErrors,
 } from './mocks/apollo_mock';
-import mockTimezones from './mocks/mock_timezones.json';
+
+const mockTimezones = getJSONFixture('timezones/full.json');
 
 describe('AddScheduleModal', () => {
   let wrapper;

ee/spec/frontend/oncall_schedule/common_utils_spec.js

@@ -7,7 +7,8 @@ import {
   setParticipantsColors,
 } from 'ee/oncall_schedules/utils/common_utils';
 import * as ColorUtils from '~/lib/utils/color_utils';
-import mockTimezones from './mocks/mock_timezones.json';
+
+const mockTimezones = getJSONFixture('timezones/full.json');
 
 describe('getFormattedTimezone', () => {
   it('formats the timezone', () => {

ee/spec/frontend/oncall_schedule/mocks/mock_timezones.json

-[
-  {
-    "identifier": "Etc/GMT+12",
-    "name": "International Date Line West",
-    "abbr": "-12",
-    "formatted_offset": "-12:00"
-  },
-  {
-    "identifier": "Pacific/Pago_Pago",
-    "name": "American Samoa",
-    "abbr": "SST",
-    "formatted_offset": "-11:00"
-  },
-  {
-    "identifier": "Pacific/Midway",
-    "name": "Midway Island",
-    "abbr": "SST",
-    "formatted_offset": "-11:00"
-  },
-  {
-    "identifier": "America/Los_Angeles",
-    "name": "Pacific Time (US & Canada)",
-    "abbr": "PT",
-    "formatted_offset": "-7:00"
-  }
-]

ee/spec/frontend/oncall_schedule/oncall_schedule_spec.js

@@ -14,7 +14,8 @@ import { shallowMountExtended } from 'helpers/vue_test_utils_helper';
 import waitForPromises from 'helpers/wait_for_promises';
 import * as dateTimeUtility from '~/lib/utils/datetime/date_calculation_utility';
 import { getOncallSchedulesQueryResponse } from './mocks/apollo_mock';
-import mockTimezones from './mocks/mock_timezones.json';
+
+const mockTimezones = getJSONFixture('timezones/full.json');
 
 const localVue = createLocalVue();
 localVue.use(VueApollo);

spec/frontend/deploy_freeze/helpers.js

 import { secondsToHours } from '~/lib/utils/datetime_utility';
 
 export const freezePeriodsFixture = getJSONFixture('/api/freeze-periods/freeze_periods.json');
-export const timezoneDataFixture = getJSONFixture('/api/freeze-periods/timezone_data.json');
+export const timezoneDataFixture = getJSONFixture('/timezones/short.json');
 
 export const findTzByName = (identifier = '') =>
   timezoneDataFixture.find(({ name }) => name.toLowerCase() === identifier.toLowerCase());

spec/frontend/fixtures/freeze_period.rb

@@ -39,13 +39,4 @@ RSpec.describe 'Freeze Periods (JavaScript fixtures)' do
       expect(response).to be_successful
     end
   end
-
-  describe TimeZoneHelper, '(JavaScript fixtures)' do
-    let(:response) { timezone_data.to_json }
-
-    it 'api/freeze-periods/timezone_data.json' do
-      # Looks empty but does things
-      # More info: https://gitlab.com/gitlab-org/gitlab/-/merge_requests/38525/diffs#note_391048415
-    end
-  end
 end

spec/frontend/fixtures/timezones.rb

+# frozen_string_literal: true
+
+require 'spec_helper'
+
+RSpec.describe TimeZoneHelper, '(JavaScript fixtures)' do
+  include JavaScriptFixturesHelpers
+  include TimeZoneHelper
+
+  let(:response) { @timezones.sort_by! { |tz| tz[:name] }.to_json }
+
+  before(:all) do
+    clean_frontend_fixtures('timezones/')
+  end
+
+  it 'timezones/short.json' do
+    @timezones = timezone_data(format: :short)
+  end
+
+  it 'timezones/full.json' do
+    @timezones = timezone_data(format: :full)
+  end
+end