Add latest changes from gitlab-org/gitlab@13-5-stable-eev13.5.0-rc42

14 files changed, 165 insertions, 256 deletions

diff --git a/spec/frontend/releases/components/app_edit_new_spec.js b/spec/frontend/releases/components/app_edit_new_spec.js
index e9727801c1a..d92bdc3b99a 100644
--- a/spec/frontend/releases/components/app_edit_new_spec.js
+++ b/spec/frontend/releases/components/app_edit_new_spec.js
@@ -3,12 +3,15 @@ import { mount } from '@vue/test-utils';
 import { merge } from 'lodash';
 import axios from 'axios';
 import MockAdapter from 'axios-mock-adapter';
+import { getJSONFixture } from 'helpers/fixtures';
 import ReleaseEditNewApp from '~/releases/components/app_edit_new.vue';
-import { release as originalRelease, milestones as originalMilestones } from '../mock_data';
 import * as commonUtils from '~/lib/utils/common_utils';
 import { BACK_URL_PARAM } from '~/releases/constants';
 import AssetLinksForm from '~/releases/components/asset_links_form.vue';
 
+const originalRelease = getJSONFixture('api/releases/release.json');
+const originalMilestones = originalRelease.milestones;
+
 describe('Release edit/new component', () => {
   let wrapper;
   let release;
@@ -17,7 +20,7 @@ describe('Release edit/new component', () => {
   let state;
   let mock;
 
-  const factory = ({ featureFlags = {}, store: storeUpdates = {} } = {}) => {
+  const factory = async ({ featureFlags = {}, store: storeUpdates = {} } = {}) => {
     state = {
       release,
       markdownDocsPath: 'path/to/markdown/docs',
@@ -65,6 +68,8 @@ describe('Release edit/new component', () => {
       },
     });
 
+    await wrapper.vm.$nextTick();
+
     wrapper.element.querySelectorAll('input').forEach(input => jest.spyOn(input, 'focus'));
   };
 
@@ -86,7 +91,9 @@ describe('Release edit/new component', () => {
   const findForm = () => wrapper.find('form');
 
   describe(`basic functionality tests: all tests unrelated to the "${BACK_URL_PARAM}" parameter`, () => {
-    beforeEach(factory);
+    beforeEach(async () => {
+      await factory();
+    });
 
     it('calls initializeRelease when the component is created', () => {
       expect(actions.initializeRelease).toHaveBeenCalledTimes(1);
@@ -128,7 +135,9 @@ describe('Release edit/new component', () => {
   });
 
   describe(`when the URL does not contain a "${BACK_URL_PARAM}" parameter`, () => {
-    beforeEach(factory);
+    beforeEach(async () => {
+      await factory();
+    });
 
     it(`renders a "Cancel" button with an href pointing to "${BACK_URL_PARAM}"`, () => {
       const cancelButton = wrapper.find('.js-cancel-button');
@@ -139,12 +148,12 @@ describe('Release edit/new component', () => {
   describe(`when the URL contains a "${BACK_URL_PARAM}" parameter`, () => {
     const backUrl = 'https://example.gitlab.com/back/url';
 
-    beforeEach(() => {
+    beforeEach(async () => {
       commonUtils.getParameterByName = jest
         .fn()
         .mockImplementation(paramToGet => ({ [BACK_URL_PARAM]: backUrl }[paramToGet]));
 
-      factory();
+      await factory();
     });
 
     it('renders a "Cancel" button with an href pointing to the main Releases page', () => {
@@ -154,8 +163,8 @@ describe('Release edit/new component', () => {
   });
 
   describe('when creating a new release', () => {
-    beforeEach(() => {
-      factory({
+    beforeEach(async () => {
+      await factory({
         store: {
           modules: {
             detail: {
@@ -174,7 +183,9 @@ describe('Release edit/new component', () => {
   });
 
   describe('when editing an existing release', () => {
-    beforeEach(factory);
+    beforeEach(async () => {
+      await factory();
+    });
 
     it('renders the submit button with the text "Save changes"', () => {
       expect(findSubmitButton().text()).toBe('Save changes');
@@ -182,33 +193,17 @@ describe('Release edit/new component', () => {
   });
 
   describe('asset links form', () => {
-    const findAssetLinksForm = () => wrapper.find(AssetLinksForm);
-
-    describe('when the release_asset_link_editing feature flag is disabled', () => {
-      beforeEach(() => {
-        factory({ featureFlags: { releaseAssetLinkEditing: false } });
-      });
-
-      it('does not render the asset links portion of the form', () => {
-        expect(findAssetLinksForm().exists()).toBe(false);
-      });
-    });
-
-    describe('when the release_asset_link_editing feature flag is enabled', () => {
-      beforeEach(() => {
-        factory({ featureFlags: { releaseAssetLinkEditing: true } });
-      });
+    beforeEach(factory);
 
-      it('renders the asset links portion of the form', () => {
-        expect(findAssetLinksForm().exists()).toBe(true);
-      });
+    it('renders the asset links portion of the form', () => {
+      expect(wrapper.find(AssetLinksForm).exists()).toBe(true);
     });
   });
 
   describe('validation', () => {
     describe('when the form is valid', () => {
-      beforeEach(() => {
-        factory({
+      beforeEach(async () => {
+        await factory({
           store: {
             modules: {
               detail: {
@@ -227,8 +222,8 @@ describe('Release edit/new component', () => {
     });
 
     describe('when the form is invalid', () => {
-      beforeEach(() => {
-        factory({
+      beforeEach(async () => {
+        await factory({
           store: {
             modules: {
               detail: {
diff --git a/spec/frontend/releases/components/app_index_spec.js b/spec/frontend/releases/components/app_index_spec.js
index bcb87509cc3..9f1577c2f1e 100644
--- a/spec/frontend/releases/components/app_index_spec.js
+++ b/spec/frontend/releases/components/app_index_spec.js
@@ -2,27 +2,33 @@ import { range as rge } from 'lodash';
 import Vuex from 'vuex';
 import { shallowMount, createLocalVue } from '@vue/test-utils';
 import waitForPromises from 'helpers/wait_for_promises';
+import { getJSONFixture } from 'helpers/fixtures';
 import ReleasesApp from '~/releases/components/app_index.vue';
 import createStore from '~/releases/stores';
 import createListModule from '~/releases/stores/modules/list';
 import api from '~/api';
-import {
-  pageInfoHeadersWithoutPagination,
-  pageInfoHeadersWithPagination,
-  release2 as release,
-  releases,
-} from '../mock_data';
+import { pageInfoHeadersWithoutPagination, pageInfoHeadersWithPagination } from '../mock_data';
 import { convertObjectPropsToCamelCase } from '~/lib/utils/common_utils';
-import TablePagination from '~/vue_shared/components/pagination/table_pagination.vue';
+import ReleasesPagination from '~/releases/components/releases_pagination.vue';
+
+jest.mock('~/lib/utils/common_utils', () => ({
+  ...jest.requireActual('~/lib/utils/common_utils'),
+  getParameterByName: jest.fn().mockImplementation(paramName => {
+    return `${paramName}_param_value`;
+  }),
+}));
 
 const localVue = createLocalVue();
 localVue.use(Vuex);
 
+const release = getJSONFixture('api/releases/release.json');
+const releases = [release];
+
 describe('Releases App ', () => {
   let wrapper;
   let fetchReleaseSpy;
 
-  const releasesPagination = rge(21).map(index => ({
+  const paginatedReleases = rge(21).map(index => ({
     ...convertObjectPropsToCamelCase(release, { deep: true }),
     tagName: `${index}.00`,
   }));
@@ -70,9 +76,13 @@ describe('Releases App ', () => {
       createComponent();
     });
 
-    it('calls fetchRelease with the page parameter', () => {
+    it('calls fetchRelease with the page, before, and after parameters', () => {
       expect(fetchReleaseSpy).toHaveBeenCalledTimes(1);
-      expect(fetchReleaseSpy).toHaveBeenCalledWith(expect.anything(), { page: null });
+      expect(fetchReleaseSpy).toHaveBeenCalledWith(expect.anything(), {
+        page: 'page_param_value',
+        before: 'before_param_value',
+        after: 'after_param_value',
+      });
     });
   });
 
@@ -91,7 +101,7 @@ describe('Releases App ', () => {
       expect(wrapper.contains('.js-loading')).toBe(true);
       expect(wrapper.contains('.js-empty-state')).toBe(false);
       expect(wrapper.contains('.js-success-state')).toBe(false);
-      expect(wrapper.contains(TablePagination)).toBe(false);
+      expect(wrapper.contains(ReleasesPagination)).toBe(false);
     });
   });
 
@@ -108,7 +118,7 @@ describe('Releases App ', () => {
       expect(wrapper.contains('.js-loading')).toBe(false);
       expect(wrapper.contains('.js-empty-state')).toBe(false);
       expect(wrapper.contains('.js-success-state')).toBe(true);
-      expect(wrapper.contains(TablePagination)).toBe(true);
+      expect(wrapper.contains(ReleasesPagination)).toBe(true);
     });
   });
 
@@ -116,7 +126,7 @@ describe('Releases App ', () => {
     beforeEach(() => {
       jest
         .spyOn(api, 'releases')
-        .mockResolvedValue({ data: releasesPagination, headers: pageInfoHeadersWithPagination });
+        .mockResolvedValue({ data: paginatedReleases, headers: pageInfoHeadersWithPagination });
 
       createComponent();
     });
@@ -125,7 +135,7 @@ describe('Releases App ', () => {
       expect(wrapper.contains('.js-loading')).toBe(false);
       expect(wrapper.contains('.js-empty-state')).toBe(false);
       expect(wrapper.contains('.js-success-state')).toBe(true);
-      expect(wrapper.contains(TablePagination)).toBe(true);
+      expect(wrapper.contains(ReleasesPagination)).toBe(true);
     });
   });
 
@@ -154,7 +164,7 @@ describe('Releases App ', () => {
       const newReleasePath = 'path/to/new/release';
 
       beforeEach(() => {
-        createComponent({ ...defaultInitialState, newReleasePath });
+        createComponent({ newReleasePath });
       });
 
       it('renders the "New release" button', () => {
@@ -174,4 +184,27 @@ describe('Releases App ', () => {
       });
     });
   });
+
+  describe('when the back button is pressed', () => {
+    beforeEach(() => {
+      jest
+        .spyOn(api, 'releases')
+        .mockResolvedValue({ data: releases, headers: pageInfoHeadersWithoutPagination });
+
+      createComponent();
+
+      fetchReleaseSpy.mockClear();
+
+      window.dispatchEvent(new PopStateEvent('popstate'));
+    });
+
+    it('calls fetchRelease with the page parameter', () => {
+      expect(fetchReleaseSpy).toHaveBeenCalledTimes(1);
+      expect(fetchReleaseSpy).toHaveBeenCalledWith(expect.anything(), {
+        page: 'page_param_value',
+        before: 'before_param_value',
+        after: 'after_param_value',
+      });
+    });
+  });
 });
diff --git a/spec/frontend/releases/components/app_show_spec.js b/spec/frontend/releases/components/app_show_spec.js
index 502a1053663..181fa0150f1 100644
--- a/spec/frontend/releases/components/app_show_spec.js
+++ b/spec/frontend/releases/components/app_show_spec.js
@@ -1,11 +1,13 @@
 import Vuex from 'vuex';
 import { shallowMount } from '@vue/test-utils';
-import { GlDeprecatedSkeletonLoading as GlSkeletonLoading } from '@gitlab/ui';
+import { getJSONFixture } from 'helpers/fixtures';
 import ReleaseShowApp from '~/releases/components/app_show.vue';
-import { release as originalRelease } from '../mock_data';
+import ReleaseSkeletonLoader from '~/releases/components/release_skeleton_loader.vue';
 import ReleaseBlock from '~/releases/components/release_block.vue';
 import { convertObjectPropsToCamelCase } from '~/lib/utils/common_utils';
 
+const originalRelease = getJSONFixture('api/releases/release.json');
+
 describe('Release show component', () => {
   let wrapper;
   let release;
@@ -33,7 +35,7 @@ describe('Release show component', () => {
     wrapper = shallowMount(ReleaseShowApp, { store });
   };
 
-  const findLoadingSkeleton = () => wrapper.find(GlSkeletonLoading);
+  const findLoadingSkeleton = () => wrapper.find(ReleaseSkeletonLoader);
   const findReleaseBlock = () => wrapper.find(ReleaseBlock);
 
   it('calls fetchRelease when the component is created', () => {
diff --git a/spec/frontend/releases/components/asset_links_form_spec.js b/spec/frontend/releases/components/asset_links_form_spec.js
index 582c0b32716..6794a56debc 100644
--- a/spec/frontend/releases/components/asset_links_form_spec.js
+++ b/spec/frontend/releases/components/asset_links_form_spec.js
@@ -1,7 +1,7 @@
 import Vuex from 'vuex';
 import { mount, createLocalVue } from '@vue/test-utils';
+import { getJSONFixture } from 'helpers/fixtures';
 import AssetLinksForm from '~/releases/components/asset_links_form.vue';
-import { release as originalRelease } from '../mock_data';
 import * as commonUtils from '~/lib/utils/common_utils';
 import { ENTER_KEY } from '~/lib/utils/keys';
 import { ASSET_LINK_TYPE, DEFAULT_ASSET_LINK_TYPE } from '~/releases/constants';
@@ -9,6 +9,8 @@ import { ASSET_LINK_TYPE, DEFAULT_ASSET_LINK_TYPE } from '~/releases/constants';
 const localVue = createLocalVue();
 localVue.use(Vuex);
 
+const originalRelease = getJSONFixture('api/releases/release.json');
+
 describe('Release edit component', () => {
   let wrapper;
   let release;
@@ -54,11 +56,6 @@ describe('Release edit component', () => {
     wrapper = mount(AssetLinksForm, {
       localVue,
       store,
-      provide: {
-        glFeatures: {
-          releaseAssetLinkType: true,
-        },
-      },
     });
   };
 
@@ -223,10 +220,18 @@ describe('Release edit component', () => {
       });
     });
 
-    it('selects the default asset type if no type was provided by the backend', () => {
-      const selected = wrapper.find({ ref: 'typeSelect' }).element.value;
+    describe('when no link type was provided by the backend', () => {
+      beforeEach(() => {
+        delete release.assets.links[0].linkType;
+
+        factory({ release });
+      });
+
+      it('selects the default asset type', () => {
+        const selected = wrapper.find({ ref: 'typeSelect' }).element.value;
 
-      expect(selected).toBe(DEFAULT_ASSET_LINK_TYPE);
+        expect(selected).toBe(DEFAULT_ASSET_LINK_TYPE);
+      });
     });
   });
 
diff --git a/spec/frontend/releases/components/evidence_block_spec.js b/spec/frontend/releases/components/evidence_block_spec.js
index ba60a79e464..b8c78f90fc2 100644
--- a/spec/frontend/releases/components/evidence_block_spec.js
+++ b/spec/frontend/releases/components/evidence_block_spec.js
@@ -1,11 +1,13 @@
 import { mount } from '@vue/test-utils';
 import { GlLink, GlIcon } from '@gitlab/ui';
+import { getJSONFixture } from 'helpers/fixtures';
 import { truncateSha } from '~/lib/utils/text_utility';
-import { release as originalRelease } from '../mock_data';
 import EvidenceBlock from '~/releases/components/evidence_block.vue';
 import ClipboardButton from '~/vue_shared/components/clipboard_button.vue';
 import { convertObjectPropsToCamelCase } from '~/lib/utils/common_utils';
 
+const originalRelease = getJSONFixture('api/releases/release.json');
+
 describe('Evidence Block', () => {
   let wrapper;
   let release;
@@ -35,7 +37,7 @@ describe('Evidence Block', () => {
   });
 
   it('renders the title for the dowload link', () => {
-    expect(wrapper.find(GlLink).text()).toBe('v1.1.2-evidences-1.json');
+    expect(wrapper.find(GlLink).text()).toBe(`v1.1-evidences-1.json`);
   });
 
   it('renders the correct hover text for the download', () => {
@@ -43,7 +45,7 @@ describe('Evidence Block', () => {
   });
 
   it('renders the correct file link for download', () => {
-    expect(wrapper.find(GlLink).attributes().download).toBe('v1.1.2-evidences-1.json');
+    expect(wrapper.find(GlLink).attributes().download).toBe(`v1.1-evidences-1.json`);
   });
 
   describe('sha text', () => {
diff --git a/spec/frontend/releases/components/release_block_assets_spec.js b/spec/frontend/releases/components/release_block_assets_spec.js
index 3453ecbf8ab..126ca27e8a6 100644
--- a/spec/frontend/releases/components/release_block_assets_spec.js
+++ b/spec/frontend/releases/components/release_block_assets_spec.js
@@ -1,10 +1,12 @@
 import { mount } from '@vue/test-utils';
 import { GlCollapse } from '@gitlab/ui';
 import { trimText } from 'helpers/text_helper';
-import { cloneDeep } from 'lodash';
+import { getJSONFixture } from 'helpers/fixtures';
+import { convertObjectPropsToCamelCase } from '~/lib/utils/common_utils';
 import ReleaseBlockAssets from '~/releases/components/release_block_assets.vue';
 import { ASSET_LINK_TYPE } from '~/releases/constants';
-import { assets } from '../mock_data';
+
+const { assets } = getJSONFixture('api/releases/release.json');
 
 describe('Release block assets', () => {
   let wrapper;
@@ -20,9 +22,6 @@ describe('Release block assets', () => {
 
   const createComponent = (propsData = defaultProps) => {
     wrapper = mount(ReleaseBlockAssets, {
-      provide: {
-        glFeatures: { releaseAssetLinkType: true },
-      },
       propsData,
     });
   };
@@ -31,7 +30,7 @@ describe('Release block assets', () => {
     wrapper.findAll('h5').filter(h5 => h5.text() === sections[type]);
 
   beforeEach(() => {
-    defaultProps = { assets: cloneDeep(assets) };
+    defaultProps = { assets: convertObjectPropsToCamelCase(assets, { deep: true }) };
   });
 
   describe('with default props', () => {
@@ -43,7 +42,7 @@ describe('Release block assets', () => {
       const accordionButton = findAccordionButton();
 
       expect(accordionButton.exists()).toBe(true);
-      expect(trimText(accordionButton.text())).toBe('Assets 5');
+      expect(trimText(accordionButton.text())).toBe('Assets 8');
     });
 
     it('renders the accordion as expanded by default', () => {
diff --git a/spec/frontend/releases/components/release_block_footer_spec.js b/spec/frontend/releases/components/release_block_footer_spec.js
index bde01cc0e00..f1c0c24f8ca 100644
--- a/spec/frontend/releases/components/release_block_footer_spec.js
+++ b/spec/frontend/releases/components/release_block_footer_spec.js
@@ -1,11 +1,13 @@
 import { mount } from '@vue/test-utils';
 import { GlLink, GlIcon } from '@gitlab/ui';
 import { trimText } from 'helpers/text_helper';
+import { getJSONFixture } from 'helpers/fixtures';
 import { cloneDeep } from 'lodash';
 import ReleaseBlockFooter from '~/releases/components/release_block_footer.vue';
-import { release as originalRelease } from '../mock_data';
 import { convertObjectPropsToCamelCase } from '~/lib/utils/common_utils';
 
+const originalRelease = getJSONFixture('api/releases/release.json');
+
 const mockFutureDate = new Date(9999, 0, 0).toISOString();
 let mockIsFutureRelease = false;
 
diff --git a/spec/frontend/releases/components/release_block_header_spec.js b/spec/frontend/releases/components/release_block_header_spec.js
index 9c6cbc86d3c..f2159871395 100644
--- a/spec/frontend/releases/components/release_block_header_spec.js
+++ b/spec/frontend/releases/components/release_block_header_spec.js
@@ -1,11 +1,13 @@
 import { shallowMount } from '@vue/test-utils';
 import { merge } from 'lodash';
 import { GlLink } from '@gitlab/ui';
+import { getJSONFixture } from 'helpers/fixtures';
 import ReleaseBlockHeader from '~/releases/components/release_block_header.vue';
 import { convertObjectPropsToCamelCase } from '~/lib/utils/common_utils';
-import { release as originalRelease } from '../mock_data';
 import { BACK_URL_PARAM } from '~/releases/constants';
 
+const originalRelease = getJSONFixture('api/releases/release.json');
+
 describe('Release block header', () => {
   let wrapper;
   let release;
@@ -49,7 +51,7 @@ describe('Release block header', () => {
     });
 
     it('renders the title as text', () => {
-      expect(findHeader().text()).toBe(release.name);
+      expect(findHeader().text()).toContain(release.name);
       expect(findHeaderLink().exists()).toBe(false);
     });
   });
diff --git a/spec/frontend/releases/components/release_block_metadata_spec.js b/spec/frontend/releases/components/release_block_metadata_spec.js
deleted file mode 100644
index 6f184e45600..00000000000
--- a/spec/frontend/releases/components/release_block_metadata_spec.js
+++ /dev/null
@@ -1,67 +0,0 @@
-import { mount } from '@vue/test-utils';
-import { trimText } from 'helpers/text_helper';
-import { cloneDeep } from 'lodash';
-import ReleaseBlockMetadata from '~/releases/components/release_block_metadata.vue';
-import { release as originalRelease } from '../mock_data';
-import { convertObjectPropsToCamelCase } from '~/lib/utils/common_utils';
-
-const mockFutureDate = new Date(9999, 0, 0).toISOString();
-let mockIsFutureRelease = false;
-
-jest.mock('~/vue_shared/mixins/timeago', () => ({
-  methods: {
-    timeFormatted() {
-      return mockIsFutureRelease ? 'in 1 month' : '7 fortnights ago';
-    },
-    tooltipTitle() {
-      return 'February 30, 2401';
-    },
-  },
-}));
-
-describe('Release block metadata', () => {
-  let wrapper;
-  let release;
-
-  const factory = (releaseUpdates = {}) => {
-    wrapper = mount(ReleaseBlockMetadata, {
-      propsData: {
-        release: {
-          ...convertObjectPropsToCamelCase(release, { deep: true }),
-          ...releaseUpdates,
-        },
-      },
-    });
-  };
-
-  beforeEach(() => {
-    release = cloneDeep(originalRelease);
-  });
-
-  afterEach(() => {
-    wrapper.destroy();
-    wrapper = null;
-    mockIsFutureRelease = false;
-  });
-
-  const findReleaseDateInfo = () => wrapper.find('.js-release-date-info');
-
-  describe('with all props provided', () => {
-    beforeEach(() => factory());
-
-    it('renders the release time info', () => {
-      expect(trimText(findReleaseDateInfo().text())).toBe(`released 7 fortnights ago`);
-    });
-  });
-
-  describe('with a future release date', () => {
-    beforeEach(() => {
-      mockIsFutureRelease = true;
-      factory({ releasedAt: mockFutureDate });
-    });
-
-    it('renders the release date without the author name', () => {
-      expect(trimText(findReleaseDateInfo().text())).toBe(`will be released in 1 month`);
-    });
-  });
-});
diff --git a/spec/frontend/releases/components/release_block_milestone_info_spec.js b/spec/frontend/releases/components/release_block_milestone_info_spec.js
index 0e79c45b337..45f4eaa01a9 100644
--- a/spec/frontend/releases/components/release_block_milestone_info_spec.js
+++ b/spec/frontend/releases/components/release_block_milestone_info_spec.js
@@ -1,11 +1,13 @@
 import { mount } from '@vue/test-utils';
 import { GlProgressBar, GlLink, GlBadge, GlButton } from '@gitlab/ui';
 import { trimText } from 'helpers/text_helper';
+import { getJSONFixture } from 'helpers/fixtures';
 import ReleaseBlockMilestoneInfo from '~/releases/components/release_block_milestone_info.vue';
-import { milestones as originalMilestones } from '../mock_data';
 import { MAX_MILESTONES_TO_DISPLAY } from '~/releases/constants';
 import { convertObjectPropsToCamelCase } from '~/lib/utils/common_utils';
 
+const { milestones: originalMilestones } = getJSONFixture('api/releases/release.json');
+
 describe('Release block milestone info', () => {
   let wrapper;
   let milestones;
@@ -35,7 +37,7 @@ describe('Release block milestone info', () => {
     beforeEach(() => factory({ milestones }));
 
     it('renders the correct percentage', () => {
-      expect(milestoneProgressBarContainer().text()).toContain('41% complete');
+      expect(milestoneProgressBarContainer().text()).toContain('44% complete');
     });
 
     it('renders a progress bar that displays the correct percentage', () => {
@@ -44,14 +46,24 @@ describe('Release block milestone info', () => {
       expect(progressBar.exists()).toBe(true);
       expect(progressBar.attributes()).toEqual(
         expect.objectContaining({
-          value: '22',
-          max: '54',
+          value: '4',
+          max: '9',
         }),
       );
     });
 
     it('renders a list of links to all associated milestones', () => {
-      expect(trimText(milestoneListContainer().text())).toContain('Milestones 13.6 • 13.5');
+      // The API currently returns the milestones in a non-deterministic order,
+      // which causes the frontend fixture used by this test to return the
+      // milestones in one order locally and a different order in the CI pipeline.
+      // This is a bug and is tracked here: https://gitlab.com/gitlab-org/gitlab/-/issues/259012
+      // When this bug is fixed this expectation should be updated to
+      // assert the expected order.
+      const containerText = trimText(milestoneListContainer().text());
+      expect(
+        containerText.includes('Milestones 12.4 • 12.3') ||
+          containerText.includes('Milestones 12.3 • 12.4'),
+      ).toBe(true);
 
       milestones.forEach((m, i) => {
         const milestoneLink = milestoneListContainer()
@@ -65,7 +77,7 @@ describe('Release block milestone info', () => {
     });
 
     it('renders the "Issues" section with a total count of issues associated to the milestone(s)', () => {
-      const totalIssueCount = 54;
+      const totalIssueCount = 9;
       const issuesContainerText = trimText(issuesContainer().text());
 
       expect(issuesContainerText).toContain(`Issues ${totalIssueCount}`);
@@ -73,7 +85,7 @@ describe('Release block milestone info', () => {
       const badge = issuesContainer().find(GlBadge);
       expect(badge.text()).toBe(totalIssueCount.toString());
 
-      expect(issuesContainerText).toContain('Open: 32 • Closed: 22');
+      expect(issuesContainerText).toContain('Open: 5 • Closed: 4');
     });
   });
 
diff --git a/spec/frontend/releases/components/release_block_spec.js b/spec/frontend/releases/components/release_block_spec.js
index a7f1388664b..633c6690529 100644
--- a/spec/frontend/releases/components/release_block_spec.js
+++ b/spec/frontend/releases/components/release_block_spec.js
@@ -1,15 +1,16 @@
 import $ from 'jquery';
 import { mount } from '@vue/test-utils';
-import { GlIcon } from '@gitlab/ui';
+import { getJSONFixture } from 'helpers/fixtures';
 import EvidenceBlock from '~/releases/components/evidence_block.vue';
 import ReleaseBlock from '~/releases/components/release_block.vue';
 import ReleaseBlockFooter from '~/releases/components/release_block_footer.vue';
 import timeagoMixin from '~/vue_shared/mixins/timeago';
-import { release as originalRelease } from '../mock_data';
 import * as commonUtils from '~/lib/utils/common_utils';
 import { BACK_URL_PARAM } from '~/releases/constants';
 import * as urlUtility from '~/lib/utils/url_utility';
 
+const originalRelease = getJSONFixture('api/releases/release.json');
+
 describe('Release block', () => {
   let wrapper;
   let release;
@@ -21,7 +22,6 @@ describe('Release block', () => {
       },
       provide: {
         glFeatures: {
-          releaseIssueSummary: true,
           ...featureFlags,
         },
       },
@@ -46,7 +46,7 @@ describe('Release block', () => {
     beforeEach(() => factory(release));
 
     it("renders the block with an id equal to the release's tag name", () => {
-      expect(wrapper.attributes().id).toBe('v0.3');
+      expect(wrapper.attributes().id).toBe(release.tagName);
     });
 
     it(`renders an edit button that links to the "Edit release" page with a "${BACK_URL_PARAM}" parameter`, () => {
@@ -69,50 +69,10 @@ describe('Release block', () => {
       expect(wrapper.text()).toContain(timeagoMixin.methods.timeFormatted(release.releasedAt));
     });
 
-    it('renders number of assets provided', () => {
-      expect(wrapper.find('.js-assets-count').text()).toContain(release.assets.count);
-    });
-
-    it('renders dropdown with the sources', () => {
-      expect(wrapper.findAll('.js-sources-dropdown li').length).toEqual(
-        release.assets.sources.length,
-      );
-
-      expect(wrapper.find('.js-sources-dropdown li a').attributes().href).toEqual(
-        release.assets.sources[0].url,
-      );
-
-      expect(wrapper.find('.js-sources-dropdown li a').text()).toContain(
-        release.assets.sources[0].format,
-      );
-    });
-
-    it('renders list with the links provided', () => {
-      expect(wrapper.findAll('.js-assets-list li').length).toEqual(release.assets.links.length);
-
-      expect(wrapper.find('.js-assets-list li a').attributes().href).toEqual(
-        release.assets.links[0].directAssetUrl,
-      );
-
-      expect(wrapper.find('.js-assets-list li a').text()).toContain(release.assets.links[0].name);
-    });
-
     it('renders author avatar', () => {
       expect(wrapper.find('.user-avatar-link').exists()).toBe(true);
     });
 
-    describe('external label', () => {
-      it('renders external label when link is external', () => {
-        expect(wrapper.find('.js-assets-list li a').text()).toContain('external source');
-      });
-
-      it('does not render external label when link is not external', () => {
-        expect(wrapper.find('.js-assets-list li:nth-child(2) a').text()).not.toContain(
-          'external source',
-        );
-      });
-    });
-
     it('renders the footer', () => {
       expect(wrapper.find(ReleaseBlockFooter).exists()).toBe(true);
     });
@@ -171,18 +131,14 @@ describe('Release block', () => {
   });
 
   describe('evidence block', () => {
-    it('renders the evidence block when the evidence is available and the feature flag is true', () =>
-      factory(release, { releaseEvidenceCollection: true }).then(() =>
-        expect(wrapper.find(EvidenceBlock).exists()).toBe(true),
-      ));
-
-    it('does not render the evidence block when the evidence is available but the feature flag is false', () =>
-      factory(release, { releaseEvidenceCollection: true }).then(() =>
-        expect(wrapper.find(EvidenceBlock).exists()).toBe(true),
-      ));
+    it('renders the evidence block when the evidence is available', () => {
+      return factory(release).then(() => {
+        expect(wrapper.find(EvidenceBlock).exists()).toBe(true);
+      });
+    });
 
     it('does not render the evidence block when there is no evidence', () => {
-      release.evidenceSha = null;
+      release.evidences = [];
 
       return factory(release).then(() => {
         expect(wrapper.find(EvidenceBlock).exists()).toBe(false);
@@ -239,51 +195,4 @@ describe('Release block', () => {
       });
     });
   });
-
-  describe('when the releaseIssueSummary feature flag is disabled', () => {
-    describe('with default props', () => {
-      beforeEach(() => factory(release, { releaseIssueSummary: false }));
-
-      it('renders the milestone icon', () => {
-        expect(
-          milestoneListLabel()
-            .find(GlIcon)
-            .exists(),
-        ).toBe(true);
-      });
-
-      it('renders the label as "Milestones" if more than one milestone is passed in', () => {
-        expect(
-          milestoneListLabel()
-            .find('.js-label-text')
-            .text(),
-        ).toEqual('Milestones');
-      });
-
-      it('renders a link to the milestone with a tooltip', () => {
-        const milestone = release.milestones[0];
-        const milestoneLink = wrapper.find('.js-milestone-link');
-
-        expect(milestoneLink.exists()).toBe(true);
-
-        expect(milestoneLink.text()).toBe(milestone.title);
-
-        expect(milestoneLink.attributes('href')).toBe(milestone.webUrl);
-
-        expect(milestoneLink.attributes('title')).toBe(milestone.description);
-      });
-    });
-
-    it('renders the label as "Milestone" if only a single milestone is passed in', () => {
-      release.milestones = release.milestones.slice(0, 1);
-
-      return factory(release, { releaseIssueSummary: false }).then(() => {
-        expect(
-          milestoneListLabel()
-            .find('.js-label-text')
-            .text(),
-        ).toEqual('Milestone');
-      });
-    });
-  });
 });
diff --git a/spec/frontend/releases/components/release_skeleton_loader_spec.js b/spec/frontend/releases/components/release_skeleton_loader_spec.js
new file mode 100644
index 00000000000..7fbf864568a
--- /dev/null
+++ b/spec/frontend/releases/components/release_skeleton_loader_spec.js
@@ -0,0 +1,15 @@
+import { mount } from '@vue/test-utils';
+import { GlSkeletonLoader } from '@gitlab/ui';
+import ReleaseSkeletonLoader from '~/releases/components/release_skeleton_loader.vue';
+
+describe('release_skeleton_loader.vue', () => {
+  let wrapper;
+
+  beforeEach(() => {
+    wrapper = mount(ReleaseSkeletonLoader);
+  });
+
+  it('renders a GlSkeletonLoader', () => {
+    expect(wrapper.find(GlSkeletonLoader).exists()).toBe(true);
+  });
+});
diff --git a/spec/frontend/releases/components/releases_pagination_graphql_spec.js b/spec/frontend/releases/components/releases_pagination_graphql_spec.js
index b01a28eb6c3..bba5e532e5e 100644
--- a/spec/frontend/releases/components/releases_pagination_graphql_spec.js
+++ b/spec/frontend/releases/components/releases_pagination_graphql_spec.js
@@ -29,7 +29,7 @@ describe('~/releases/components/releases_pagination_graphql.vue', () => {
 
     listModule.state.graphQlPageInfo = pageInfo;
 
-    listModule.actions.fetchReleasesGraphQl = jest.fn();
+    listModule.actions.fetchReleases = jest.fn();
 
     wrapper = mount(ReleasesPaginationGraphql, {
       store: createStore({
@@ -141,8 +141,8 @@ describe('~/releases/components/releases_pagination_graphql.vue', () => {
         findNextButton().trigger('click');
       });
 
-      it('calls fetchReleasesGraphQl with the correct after cursor', () => {
-        expect(listModule.actions.fetchReleasesGraphQl.mock.calls).toEqual([
+      it('calls fetchReleases with the correct after cursor', () => {
+        expect(listModule.actions.fetchReleases.mock.calls).toEqual([
           [expect.anything(), { after: cursors.endCursor }],
         ]);
       });
@@ -159,8 +159,8 @@ describe('~/releases/components/releases_pagination_graphql.vue', () => {
         findPrevButton().trigger('click');
       });
 
-      it('calls fetchReleasesGraphQl with the correct before cursor', () => {
-        expect(listModule.actions.fetchReleasesGraphQl.mock.calls).toEqual([
+      it('calls fetchReleases with the correct before cursor', () => {
+        expect(listModule.actions.fetchReleases.mock.calls).toEqual([
           [expect.anything(), { before: cursors.startCursor }],
         ]);
       });
diff --git a/spec/frontend/releases/components/releases_pagination_rest_spec.js b/spec/frontend/releases/components/releases_pagination_rest_spec.js
index 4fd3e085fc9..59c0c31413a 100644
--- a/spec/frontend/releases/components/releases_pagination_rest_spec.js
+++ b/spec/frontend/releases/components/releases_pagination_rest_spec.js
@@ -20,9 +20,9 @@ describe('~/releases/components/releases_pagination_rest.vue', () => {
   const createComponent = pageInfo => {
     listModule = createListModule({ projectId });
 
-    listModule.state.pageInfo = pageInfo;
+    listModule.state.restPageInfo = pageInfo;
 
-    listModule.actions.fetchReleasesRest = jest.fn();
+    listModule.actions.fetchReleases = jest.fn();
 
     wrapper = mount(ReleasesPaginationRest, {
       store: createStore({
@@ -57,8 +57,8 @@ describe('~/releases/components/releases_pagination_rest.vue', () => {
       findGlPagination().vm.$emit('input', newPage);
     });
 
-    it('calls fetchReleasesRest with the correct page', () => {
-      expect(listModule.actions.fetchReleasesRest.mock.calls).toEqual([
+    it('calls fetchReleases with the correct page', () => {
+      expect(listModule.actions.fetchReleases.mock.calls).toEqual([
         [expect.anything(), { page: newPage }],
       ]);
     });