diff options
author | GitLab Bot <gitlab-bot@gitlab.com> | 2021-12-20 13:37:47 +0000 |
---|---|---|
committer | GitLab Bot <gitlab-bot@gitlab.com> | 2021-12-20 13:37:47 +0000 |
commit | aee0a117a889461ce8ced6fcf73207fe017f1d99 (patch) | |
tree | 891d9ef189227a8445d83f35c1b0fc99573f4380 /spec/frontend/google_cloud | |
parent | 8d46af3258650d305f53b819eabf7ab18d22f59e (diff) | |
download | gitlab-ce-aee0a117a889461ce8ced6fcf73207fe017f1d99.tar.gz |
Add latest changes from gitlab-org/gitlab@14-6-stable-eev14.6.0-rc42
Diffstat (limited to 'spec/frontend/google_cloud')
-rw-r--r-- | spec/frontend/google_cloud/components/app_spec.js | 86 | ||||
-rw-r--r-- | spec/frontend/google_cloud/components/errors/gcp_error_spec.js | 34 | ||||
-rw-r--r-- | spec/frontend/google_cloud/components/errors/no_gcp_projects_spec.js | 33 | ||||
-rw-r--r-- | spec/frontend/google_cloud/components/home_spec.js | 61 | ||||
-rw-r--r-- | spec/frontend/google_cloud/components/service_accounts_form_spec.js | 59 | ||||
-rw-r--r-- | spec/frontend/google_cloud/components/service_accounts_list_spec.js (renamed from spec/frontend/google_cloud/components/service_accounts_spec.js) | 6 |
6 files changed, 236 insertions, 43 deletions
diff --git a/spec/frontend/google_cloud/components/app_spec.js b/spec/frontend/google_cloud/components/app_spec.js index bb86eb5c22e..570ac1e6ed1 100644 --- a/spec/frontend/google_cloud/components/app_spec.js +++ b/spec/frontend/google_cloud/components/app_spec.js @@ -1,65 +1,71 @@ import { shallowMount } from '@vue/test-utils'; -import { GlTab, GlTabs } from '@gitlab/ui'; +import { mapValues } from 'lodash'; import App from '~/google_cloud/components/app.vue'; +import Home from '~/google_cloud/components/home.vue'; import IncubationBanner from '~/google_cloud/components/incubation_banner.vue'; -import ServiceAccounts from '~/google_cloud/components/service_accounts.vue'; +import ServiceAccountsForm from '~/google_cloud/components/service_accounts_form.vue'; +import GcpError from '~/google_cloud/components/errors/gcp_error.vue'; +import NoGcpProjects from '~/google_cloud/components/errors/no_gcp_projects.vue'; + +const BASE_FEEDBACK_URL = + 'https://gitlab.com/gitlab-org/incubation-engineering/five-minute-production/meta/-/issues/new'; +const SCREEN_COMPONENTS = { + Home, + ServiceAccountsForm, + GcpError, + NoGcpProjects, +}; +const SERVICE_ACCOUNTS_FORM_PROPS = { + gcpProjects: [1, 2, 3], + environments: [4, 5, 6], + cancelPath: '', +}; +const HOME_PROPS = { + serviceAccounts: [{}, {}], + createServiceAccountUrl: '#url-create-service-account', + emptyIllustrationUrl: '#url-empty-illustration', +}; describe('google_cloud App component', () => { let wrapper; const findIncubationBanner = () => wrapper.findComponent(IncubationBanner); - const findTabs = () => wrapper.findComponent(GlTabs); - const findTabItems = () => findTabs().findAllComponents(GlTab); - const findConfigurationTab = () => findTabItems().at(0); - const findDeploymentTab = () => findTabItems().at(1); - const findServicesTab = () => findTabItems().at(2); - const findServiceAccounts = () => findConfigurationTab().findComponent(ServiceAccounts); - - beforeEach(() => { - const propsData = { - serviceAccounts: [{}, {}], - createServiceAccountUrl: '#url-create-service-account', - emptyIllustrationUrl: '#url-empty-illustration', - }; - wrapper = shallowMount(App, { propsData }); - }); afterEach(() => { wrapper.destroy(); }); - it('should contain incubation banner', () => { - expect(findIncubationBanner().exists()).toBe(true); - }); - - describe('google_cloud App tabs', () => { - it('should contain tabs', () => { - expect(findTabs().exists()).toBe(true); - }); + describe.each` + screen | extraProps | componentName + ${'gcp_error'} | ${{ error: 'mock_gcp_client_error' }} | ${'GcpError'} + ${'no_gcp_projects'} | ${{}} | ${'NoGcpProjects'} + ${'service_accounts_form'} | ${SERVICE_ACCOUNTS_FORM_PROPS} | ${'ServiceAccountsForm'} + ${'home'} | ${HOME_PROPS} | ${'Home'} + `('for screen=$screen', ({ screen, extraProps, componentName }) => { + const component = SCREEN_COMPONENTS[componentName]; - it('should contain three tab items', () => { - expect(findTabItems().length).toBe(3); + beforeEach(() => { + wrapper = shallowMount(App, { propsData: { screen, ...extraProps } }); }); - describe('configuration tab', () => { - it('should exist', () => { - expect(findConfigurationTab().exists()).toBe(true); - }); + it(`renders only ${componentName}`, () => { + const existences = mapValues(SCREEN_COMPONENTS, (x) => wrapper.findComponent(x).exists()); - it('should contain service accounts component', () => { - expect(findServiceAccounts().exists()).toBe(true); + expect(existences).toEqual({ + ...mapValues(SCREEN_COMPONENTS, () => false), + [componentName]: true, }); }); - describe('deployments tab', () => { - it('should exist', () => { - expect(findDeploymentTab().exists()).toBe(true); - }); + it(`renders the ${componentName} with props`, () => { + expect(wrapper.findComponent(component).props()).toEqual(extraProps); }); - describe('services tab', () => { - it('should exist', () => { - expect(findServicesTab().exists()).toBe(true); + it('renders incubation banner', () => { + expect(findIncubationBanner().props()).toEqual({ + shareFeedbackUrl: `${BASE_FEEDBACK_URL}?issuable_template=general_feedback`, + reportBugUrl: `${BASE_FEEDBACK_URL}?issuable_template=report_bug`, + featureRequestUrl: `${BASE_FEEDBACK_URL}?issuable_template=feature_request`, }); }); }); diff --git a/spec/frontend/google_cloud/components/errors/gcp_error_spec.js b/spec/frontend/google_cloud/components/errors/gcp_error_spec.js new file mode 100644 index 00000000000..4062a8b902a --- /dev/null +++ b/spec/frontend/google_cloud/components/errors/gcp_error_spec.js @@ -0,0 +1,34 @@ +import { shallowMount } from '@vue/test-utils'; +import { GlAlert } from '@gitlab/ui'; +import GcpError from '~/google_cloud/components/errors/gcp_error.vue'; + +describe('GcpError component', () => { + let wrapper; + + const findAlert = () => wrapper.findComponent(GlAlert); + const findBlockquote = () => wrapper.find('blockquote'); + + const propsData = { error: 'IAM and CloudResourceManager API disabled' }; + + beforeEach(() => { + wrapper = shallowMount(GcpError, { propsData }); + }); + + afterEach(() => { + wrapper.destroy(); + }); + + it('contains alert', () => { + expect(findAlert().exists()).toBe(true); + }); + + it('contains relevant text', () => { + const alertText = findAlert().text(); + expect(findAlert().props('title')).toBe(GcpError.i18n.title); + expect(alertText).toContain(GcpError.i18n.description); + }); + + it('contains error stacktrace', () => { + expect(findBlockquote().text()).toBe(propsData.error); + }); +}); diff --git a/spec/frontend/google_cloud/components/errors/no_gcp_projects_spec.js b/spec/frontend/google_cloud/components/errors/no_gcp_projects_spec.js new file mode 100644 index 00000000000..e1e20377880 --- /dev/null +++ b/spec/frontend/google_cloud/components/errors/no_gcp_projects_spec.js @@ -0,0 +1,33 @@ +import { mount } from '@vue/test-utils'; +import { GlAlert, GlButton } from '@gitlab/ui'; +import NoGcpProjects from '~/google_cloud/components/errors/no_gcp_projects.vue'; + +describe('NoGcpProjects component', () => { + let wrapper; + + const findAlert = () => wrapper.findComponent(GlAlert); + const findButton = () => wrapper.findComponent(GlButton); + + beforeEach(() => { + wrapper = mount(NoGcpProjects); + }); + + afterEach(() => { + wrapper.destroy(); + }); + + it('contains alert', () => { + expect(findAlert().exists()).toBe(true); + }); + + it('contains relevant text', () => { + expect(findAlert().props('title')).toBe(NoGcpProjects.i18n.title); + expect(findAlert().text()).toContain(NoGcpProjects.i18n.description); + }); + + it('contains create gcp project button', () => { + const button = findButton(); + expect(button.text()).toBe(NoGcpProjects.i18n.createLabel); + expect(button.attributes('href')).toBe('https://console.cloud.google.com/projectcreate'); + }); +}); diff --git a/spec/frontend/google_cloud/components/home_spec.js b/spec/frontend/google_cloud/components/home_spec.js new file mode 100644 index 00000000000..9b4c3a79f11 --- /dev/null +++ b/spec/frontend/google_cloud/components/home_spec.js @@ -0,0 +1,61 @@ +import { shallowMount } from '@vue/test-utils'; +import { GlTab, GlTabs } from '@gitlab/ui'; +import Home from '~/google_cloud/components/home.vue'; +import ServiceAccountsList from '~/google_cloud/components/service_accounts_list.vue'; + +describe('google_cloud Home component', () => { + let wrapper; + + const findTabs = () => wrapper.findComponent(GlTabs); + const findTabItems = () => findTabs().findAllComponents(GlTab); + const findTabItemsModel = () => + findTabs() + .findAllComponents(GlTab) + .wrappers.map((x) => ({ + title: x.attributes('title'), + disabled: x.attributes('disabled'), + })); + + const TEST_HOME_PROPS = { + serviceAccounts: [{}, {}], + createServiceAccountUrl: '#url-create-service-account', + emptyIllustrationUrl: '#url-empty-illustration', + }; + + beforeEach(() => { + const propsData = { + screen: 'home', + ...TEST_HOME_PROPS, + }; + wrapper = shallowMount(Home, { propsData }); + }); + + afterEach(() => { + wrapper.destroy(); + }); + + describe('google_cloud App tabs', () => { + it('should contain tabs', () => { + expect(findTabs().exists()).toBe(true); + }); + + it('should contain three tab items', () => { + expect(findTabItemsModel()).toEqual([ + { title: 'Configuration', disabled: undefined }, + { title: 'Deployments', disabled: '' }, + { title: 'Services', disabled: '' }, + ]); + }); + + describe('configuration tab', () => { + it('should contain service accounts component', () => { + const serviceAccounts = findTabItems().at(0).findComponent(ServiceAccountsList); + expect(serviceAccounts.props()).toEqual({ + list: TEST_HOME_PROPS.serviceAccounts, + createUrl: TEST_HOME_PROPS.createServiceAccountUrl, + emptyIllustrationUrl: TEST_HOME_PROPS.emptyIllustrationUrl, + }); + }); + }); + }); +}); diff --git a/spec/frontend/google_cloud/components/service_accounts_form_spec.js b/spec/frontend/google_cloud/components/service_accounts_form_spec.js new file mode 100644 index 00000000000..5394d0cdaef --- /dev/null +++ b/spec/frontend/google_cloud/components/service_accounts_form_spec.js @@ -0,0 +1,59 @@ +import { shallowMount } from '@vue/test-utils'; +import { GlButton, GlFormGroup, GlFormSelect } from '@gitlab/ui'; +import ServiceAccountsForm from '~/google_cloud/components/service_accounts_form.vue'; + +describe('ServiceAccountsForm component', () => { + let wrapper; + + const findHeader = () => wrapper.find('header'); + const findAllFormGroups = () => wrapper.findAllComponents(GlFormGroup); + const findAllFormSelects = () => wrapper.findAllComponents(GlFormSelect); + const findAllButtons = () => wrapper.findAllComponents(GlButton); + + const propsData = { gcpProjects: [], environments: [], cancelPath: '#cancel-url' }; + + beforeEach(() => { + wrapper = shallowMount(ServiceAccountsForm, { propsData }); + }); + + afterEach(() => { + wrapper.destroy(); + }); + + it('contains header', () => { + expect(findHeader().exists()).toBe(true); + }); + + it('contains GCP project form group', () => { + const formGroup = findAllFormGroups().at(0); + expect(formGroup.exists()).toBe(true); + }); + + it('contains GCP project dropdown', () => { + const select = findAllFormSelects().at(0); + expect(select.exists()).toBe(true); + }); + + it('contains Environments form group', () => { + const formGorup = findAllFormGroups().at(1); + expect(formGorup.exists()).toBe(true); + }); + + it('contains Environments dropdown', () => { + const select = findAllFormSelects().at(1); + expect(select.exists()).toBe(true); + }); + + it('contains Submit button', () => { + const button = findAllButtons().at(0); + expect(button.exists()).toBe(true); + expect(button.text()).toBe(ServiceAccountsForm.i18n.submitLabel); + }); + + it('contains Cancel button', () => { + const button = findAllButtons().at(1); + expect(button.exists()).toBe(true); + expect(button.text()).toBe(ServiceAccountsForm.i18n.cancelLabel); + expect(button.attributes('href')).toBe('#cancel-url'); + }); +}); diff --git a/spec/frontend/google_cloud/components/service_accounts_spec.js b/spec/frontend/google_cloud/components/service_accounts_list_spec.js index 3d097078f03..cdb3f74051c 100644 --- a/spec/frontend/google_cloud/components/service_accounts_spec.js +++ b/spec/frontend/google_cloud/components/service_accounts_list_spec.js @@ -1,6 +1,6 @@ import { mount } from '@vue/test-utils'; import { GlButton, GlEmptyState, GlTable } from '@gitlab/ui'; -import ServiceAccounts from '~/google_cloud/components/service_accounts.vue'; +import ServiceAccountsList from '~/google_cloud/components/service_accounts_list.vue'; describe('ServiceAccounts component', () => { describe('when the project does not have any service accounts', () => { @@ -15,7 +15,7 @@ describe('ServiceAccounts component', () => { createUrl: '#create-url', emptyIllustrationUrl: '#empty-illustration-url', }; - wrapper = mount(ServiceAccounts, { propsData }); + wrapper = mount(ServiceAccountsList, { propsData }); }); afterEach(() => { @@ -48,7 +48,7 @@ describe('ServiceAccounts component', () => { createUrl: '#create-url', emptyIllustrationUrl: '#empty-illustration-url', }; - wrapper = mount(ServiceAccounts, { propsData }); + wrapper = mount(ServiceAccountsList, { propsData }); }); it('shows the title', () => { |