diff options
Diffstat (limited to 'spec/frontend/registry')
9 files changed, 84 insertions, 56 deletions
diff --git a/spec/frontend/registry/explorer/components/details_page/details_row_spec.js b/spec/frontend/registry/explorer/components/details_page/details_row_spec.js deleted file mode 100644 index 95b8e18d677..00000000000 --- a/spec/frontend/registry/explorer/components/details_page/details_row_spec.js +++ /dev/null @@ -1,43 +0,0 @@ -import { shallowMount } from '@vue/test-utils'; -import { GlIcon } from '@gitlab/ui'; -import component from '~/registry/explorer/components/details_page/details_row.vue'; - -describe('DetailsRow', () => { - let wrapper; - - const findIcon = () => wrapper.find(GlIcon); - const findDefaultSlot = () => wrapper.find('[data-testid="default-slot"]'); - - const mountComponent = () => { - wrapper = shallowMount(component, { - propsData: { - icon: 'clock', - }, - slots: { - default: '<div data-testid="default-slot"></div>', - }, - }); - }; - - afterEach(() => { - wrapper.destroy(); - wrapper = null; - }); - - it('contains an icon', () => { - mountComponent(); - expect(findIcon().exists()).toBe(true); - }); - - it('icon has the correct props', () => { - mountComponent(); - expect(findIcon().props()).toMatchObject({ - name: 'clock', - }); - }); - - it('has a default slot', () => { - mountComponent(); - expect(findDefaultSlot().exists()).toBe(true); - }); -}); diff --git a/spec/frontend/registry/explorer/components/details_page/tags_list_row_spec.js b/spec/frontend/registry/explorer/components/details_page/tags_list_row_spec.js index 9e876d6d8a3..a21facefc97 100644 --- a/spec/frontend/registry/explorer/components/details_page/tags_list_row_spec.js +++ b/spec/frontend/registry/explorer/components/details_page/tags_list_row_spec.js @@ -1,11 +1,12 @@ import { shallowMount } from '@vue/test-utils'; import { GlFormCheckbox, GlSprintf, GlIcon } from '@gitlab/ui'; +import { createMockDirective, getBinding } from 'helpers/vue_mock_directive'; import ClipboardButton from '~/vue_shared/components/clipboard_button.vue'; import TimeAgoTooltip from '~/vue_shared/components/time_ago_tooltip.vue'; import component from '~/registry/explorer/components/details_page/tags_list_row.vue'; import DeleteButton from '~/registry/explorer/components/delete_button.vue'; -import DetailsRow from '~/registry/explorer/components/details_page/details_row.vue'; +import DetailsRow from '~/registry/shared/components/details_row.vue'; import { REMOVE_TAG_BUTTON_TITLE, REMOVE_TAG_BUTTON_DISABLE_TOOLTIP, @@ -13,7 +14,6 @@ import { NOT_AVAILABLE_TEXT, NOT_AVAILABLE_SIZE, } from '~/registry/explorer/constants/index'; -import { createMockDirective, getBinding } from 'helpers/vue_mock_directive'; import { tagsListResponse } from '../../mock_data'; import { ListItem } from '../../stubs'; diff --git a/spec/frontend/registry/explorer/components/list_page/cli_commands_spec.js b/spec/frontend/registry/explorer/components/list_page/cli_commands_spec.js index a556be12089..b0291de5f3c 100644 --- a/spec/frontend/registry/explorer/components/list_page/cli_commands_spec.js +++ b/spec/frontend/registry/explorer/components/list_page/cli_commands_spec.js @@ -1,6 +1,6 @@ import Vuex from 'vuex'; import { mount, createLocalVue } from '@vue/test-utils'; -import { GlDropdown, GlFormGroup, GlFormInputGroup } from '@gitlab/ui'; +import { GlDeprecatedDropdown, GlFormGroup, GlFormInputGroup } from '@gitlab/ui'; import Tracking from '~/tracking'; import * as getters from '~/registry/explorer/stores/getters'; import QuickstartDropdown from '~/registry/explorer/components/list_page/cli_commands.vue'; @@ -23,7 +23,7 @@ describe('cli_commands', () => { let wrapper; let store; - const findDropdownButton = () => wrapper.find(GlDropdown); + const findDropdownButton = () => wrapper.find(GlDeprecatedDropdown); const findFormGroups = () => wrapper.findAll(GlFormGroup); const mountComponent = () => { diff --git a/spec/frontend/registry/explorer/pages/details_spec.js b/spec/frontend/registry/explorer/pages/details_spec.js index 9bc0bae5c23..66e8a4aea0d 100644 --- a/spec/frontend/registry/explorer/pages/details_spec.js +++ b/spec/frontend/registry/explorer/pages/details_spec.js @@ -13,7 +13,7 @@ import { SET_TAGS_LIST_SUCCESS, SET_TAGS_PAGINATION, SET_INITIAL_STATE, -} from '~/registry/explorer/stores/mutation_types/'; +} from '~/registry/explorer/stores/mutation_types'; import { tagsListResponse } from '../mock_data'; import { DeleteModal } from '../stubs'; diff --git a/spec/frontend/registry/explorer/pages/list_spec.js b/spec/frontend/registry/explorer/pages/list_spec.js index 2ece7593b41..b4e46fda2c4 100644 --- a/spec/frontend/registry/explorer/pages/list_spec.js +++ b/spec/frontend/registry/explorer/pages/list_spec.js @@ -1,7 +1,7 @@ import { shallowMount } from '@vue/test-utils'; import { GlSkeletonLoader, GlSprintf, GlAlert, GlSearchBoxByClick } from '@gitlab/ui'; -import Tracking from '~/tracking'; import waitForPromises from 'helpers/wait_for_promises'; +import Tracking from '~/tracking'; import component from '~/registry/explorer/pages/list.vue'; import CliCommands from '~/registry/explorer/components/list_page/cli_commands.vue'; import GroupEmptyState from '~/registry/explorer/components/list_page/group_empty_state.vue'; @@ -14,7 +14,7 @@ import { SET_IMAGES_LIST_SUCCESS, SET_PAGINATION, SET_INITIAL_STATE, -} from '~/registry/explorer/stores/mutation_types/'; +} from '~/registry/explorer/stores/mutation_types'; import { DELETE_IMAGE_SUCCESS_MESSAGE, DELETE_IMAGE_ERROR_MESSAGE, diff --git a/spec/frontend/registry/explorer/stores/actions_spec.js b/spec/frontend/registry/explorer/stores/actions_spec.js index 15f9db90910..fb93ab06ca8 100644 --- a/spec/frontend/registry/explorer/stores/actions_spec.js +++ b/spec/frontend/registry/explorer/stores/actions_spec.js @@ -1,10 +1,10 @@ -import axios from '~/lib/utils/axios_utils'; import MockAdapter from 'axios-mock-adapter'; -import * as actions from '~/registry/explorer/stores/actions'; -import * as types from '~/registry/explorer/stores/mutation_types'; import testAction from 'helpers/vuex_action_helper'; -import createFlash from '~/flash'; import { TEST_HOST } from 'helpers/test_constants'; +import axios from '~/lib/utils/axios_utils'; +import * as actions from '~/registry/explorer/stores/actions'; +import * as types from '~/registry/explorer/stores/mutation_types'; +import { deprecatedCreateFlash as createFlash } from '~/flash'; import { reposServerResponse, registryServerResponse } from '../mock_data'; jest.mock('~/flash.js'); diff --git a/spec/frontend/registry/settings/components/settings_form_spec.js b/spec/frontend/registry/settings/components/settings_form_spec.js index 9b9ca92270c..6f9518808db 100644 --- a/spec/frontend/registry/settings/components/settings_form_spec.js +++ b/spec/frontend/registry/settings/components/settings_form_spec.js @@ -1,4 +1,5 @@ import { shallowMount } from '@vue/test-utils'; +import waitForPromises from 'helpers/wait_for_promises'; import Tracking from '~/tracking'; import component from '~/registry/settings/components/settings_form.vue'; import expirationPolicyFields from '~/registry/shared/components/expiration_policy_fields.vue'; @@ -7,7 +8,6 @@ import { UPDATE_SETTINGS_ERROR_MESSAGE, UPDATE_SETTINGS_SUCCESS_MESSAGE, } from '~/registry/shared/constants'; -import waitForPromises from 'helpers/wait_for_promises'; import { stringifiedFormOptions } from '../../shared/mock_data'; describe('Settings Form', () => { diff --git a/spec/frontend/registry/settings/store/actions_spec.js b/spec/frontend/registry/settings/store/actions_spec.js index f92d10d087f..51b89f96ef2 100644 --- a/spec/frontend/registry/settings/store/actions_spec.js +++ b/spec/frontend/registry/settings/store/actions_spec.js @@ -1,5 +1,5 @@ -import Api from '~/api'; import testAction from 'helpers/vuex_action_helper'; +import Api from '~/api'; import * as actions from '~/registry/settings/store/actions'; import * as types from '~/registry/settings/store/mutation_types'; diff --git a/spec/frontend/registry/shared/components/details_row_spec.js b/spec/frontend/registry/shared/components/details_row_spec.js new file mode 100644 index 00000000000..5ae4e0ab37f --- /dev/null +++ b/spec/frontend/registry/shared/components/details_row_spec.js @@ -0,0 +1,71 @@ +import { shallowMount } from '@vue/test-utils'; +import { GlIcon } from '@gitlab/ui'; +import component from '~/registry/shared/components/details_row.vue'; + +describe('DetailsRow', () => { + let wrapper; + + const findIcon = () => wrapper.find(GlIcon); + const findDefaultSlot = () => wrapper.find('[data-testid="default-slot"]'); + + const mountComponent = props => { + wrapper = shallowMount(component, { + propsData: { + icon: 'clock', + ...props, + }, + slots: { + default: '<div data-testid="default-slot"></div>', + }, + }); + }; + + afterEach(() => { + wrapper.destroy(); + wrapper = null; + }); + + it('has a default slot', () => { + mountComponent(); + expect(findDefaultSlot().exists()).toBe(true); + }); + + describe('icon prop', () => { + it('contains an icon', () => { + mountComponent(); + expect(findIcon().exists()).toBe(true); + }); + + it('icon has the correct props', () => { + mountComponent(); + expect(findIcon().props()).toMatchObject({ + name: 'clock', + }); + }); + }); + + describe('padding prop', () => { + it('padding has a default', () => { + mountComponent(); + expect(wrapper.classes('gl-py-2')).toBe(true); + }); + + it('is reflected in the template', () => { + mountComponent({ padding: 'gl-py-4' }); + expect(wrapper.classes('gl-py-4')).toBe(true); + }); + }); + + describe('dashed prop', () => { + const borderClasses = ['gl-border-b-solid', 'gl-border-gray-100', 'gl-border-b-1']; + it('by default component has no border', () => { + mountComponent(); + expect(wrapper.classes).not.toEqual(expect.arrayContaining(borderClasses)); + }); + + it('has a border when dashed is true', () => { + mountComponent({ dashed: true }); + expect(wrapper.classes()).toEqual(expect.arrayContaining(borderClasses)); + }); + }); +}); |