diff options
Diffstat (limited to 'spec/frontend/vue_mr_widget/components/terraform')
3 files changed, 298 insertions, 0 deletions
diff --git a/spec/frontend/vue_mr_widget/components/terraform/mock_data.js b/spec/frontend/vue_mr_widget/components/terraform/mock_data.js new file mode 100644 index 00000000000..ae280146c22 --- /dev/null +++ b/spec/frontend/vue_mr_widget/components/terraform/mock_data.js @@ -0,0 +1,31 @@ +export const invalidPlanWithName = { + job_name: 'Invalid Plan', + job_path: '/path/to/ci/logs/1', + tf_report_error: 'api_error', +}; + +export const invalidPlanWithoutName = { + tf_report_error: 'invalid_json_format', +}; + +export const validPlanWithName = { + create: 10, + update: 20, + delete: 30, + job_name: 'Valid Plan', + job_path: '/path/to/ci/logs/1', +}; + +export const validPlanWithoutName = { + create: 10, + update: 20, + delete: 30, + job_path: '/path/to/ci/logs/1', +}; + +export const plans = { + invalid_plan_one: invalidPlanWithName, + invalid_plan_two: invalidPlanWithName, + valid_plan_one: validPlanWithName, + valid_plan_two: validPlanWithoutName, +}; diff --git a/spec/frontend/vue_mr_widget/components/terraform/mr_widget_terraform_container_spec.js b/spec/frontend/vue_mr_widget/components/terraform/mr_widget_terraform_container_spec.js new file mode 100644 index 00000000000..be43f10c03e --- /dev/null +++ b/spec/frontend/vue_mr_widget/components/terraform/mr_widget_terraform_container_spec.js @@ -0,0 +1,172 @@ +import { GlSkeletonLoading, GlSprintf } from '@gitlab/ui'; +import { invalidPlanWithName, plans, validPlanWithName } from './mock_data'; +import { shallowMount } from '@vue/test-utils'; +import axios from '~/lib/utils/axios_utils'; +import MockAdapter from 'axios-mock-adapter'; +import MrWidgetExpanableSection from '~/vue_merge_request_widget/components/mr_widget_expandable_section.vue'; +import MrWidgetTerraformContainer from '~/vue_merge_request_widget/components/terraform/mr_widget_terraform_container.vue'; +import Poll from '~/lib/utils/poll'; +import TerraformPlan from '~/vue_merge_request_widget/components/terraform/terraform_plan.vue'; + +describe('MrWidgetTerraformConainer', () => { + let mock; + let wrapper; + + const propsData = { endpoint: '/path/to/terraform/report.json' }; + + const findHeader = () => wrapper.find('[data-testid="terraform-header-text"]'); + const findPlans = () => wrapper.findAll(TerraformPlan).wrappers.map(x => x.props('plan')); + + const mockPollingApi = (response, body, header) => { + mock.onGet(propsData.endpoint).reply(response, body, header); + }; + + const mountWrapper = () => { + wrapper = shallowMount(MrWidgetTerraformContainer, { + propsData, + stubs: { MrWidgetExpanableSection, GlSprintf }, + }); + return axios.waitForAll(); + }; + + beforeEach(() => { + mock = new MockAdapter(axios); + }); + + afterEach(() => { + wrapper.destroy(); + mock.restore(); + }); + + describe('when data is loading', () => { + beforeEach(() => { + mockPollingApi(200, plans, {}); + + return mountWrapper().then(() => { + wrapper.setData({ loading: true }); + return wrapper.vm.$nextTick(); + }); + }); + + it('diplays loading skeleton', () => { + expect(wrapper.contains(GlSkeletonLoading)).toBe(true); + expect(wrapper.contains(MrWidgetExpanableSection)).toBe(false); + }); + }); + + describe('when data has finished loading', () => { + beforeEach(() => { + mockPollingApi(200, plans, {}); + return mountWrapper(); + }); + + it('displays terraform content', () => { + expect(wrapper.contains(GlSkeletonLoading)).toBe(false); + expect(wrapper.contains(MrWidgetExpanableSection)).toBe(true); + expect(findPlans()).toEqual(Object.values(plans)); + }); + + describe('when data includes one invalid plan', () => { + beforeEach(() => { + const invalidPlanGroup = { bad_plan: invalidPlanWithName }; + mockPollingApi(200, invalidPlanGroup, {}); + return mountWrapper(); + }); + + it('displays header text for one invalid plan', () => { + expect(findHeader().text()).toBe('1 Terraform report failed to generate'); + }); + }); + + describe('when data includes multiple invalid plans', () => { + beforeEach(() => { + const invalidPlanGroup = { + bad_plan_one: invalidPlanWithName, + bad_plan_two: invalidPlanWithName, + }; + + mockPollingApi(200, invalidPlanGroup, {}); + return mountWrapper(); + }); + + it('displays header text for multiple invalid plans', () => { + expect(findHeader().text()).toBe('2 Terraform reports failed to generate'); + }); + }); + + describe('when data includes one valid plan', () => { + beforeEach(() => { + const validPlanGroup = { valid_plan: validPlanWithName }; + mockPollingApi(200, validPlanGroup, {}); + return mountWrapper(); + }); + + it('displays header text for one valid plans', () => { + expect(findHeader().text()).toBe('1 Terraform report was generated in your pipelines'); + }); + }); + + describe('when data includes multiple valid plans', () => { + beforeEach(() => { + const validPlanGroup = { + valid_plan_one: validPlanWithName, + valid_plan_two: validPlanWithName, + }; + mockPollingApi(200, validPlanGroup, {}); + return mountWrapper(); + }); + + it('displays header text for multiple valid plans', () => { + expect(findHeader().text()).toBe('2 Terraform reports were generated in your pipelines'); + }); + }); + }); + + describe('polling', () => { + let pollRequest; + let pollStop; + + beforeEach(() => { + pollRequest = jest.spyOn(Poll.prototype, 'makeRequest'); + pollStop = jest.spyOn(Poll.prototype, 'stop'); + }); + + afterEach(() => { + pollRequest.mockRestore(); + pollStop.mockRestore(); + }); + + describe('successful poll', () => { + beforeEach(() => { + mockPollingApi(200, plans, {}); + + return mountWrapper(); + }); + + it('does not make additional requests after poll is successful', () => { + expect(pollRequest).toHaveBeenCalledTimes(1); + expect(pollStop).toHaveBeenCalledTimes(1); + }); + }); + + describe('polling fails', () => { + beforeEach(() => { + mockPollingApi(500, null, {}); + return mountWrapper(); + }); + + it('stops loading', () => { + expect(wrapper.contains(GlSkeletonLoading)).toBe(false); + }); + + it('generates one broken plan', () => { + expect(findPlans()).toEqual([{ tf_report_error: 'api_error' }]); + }); + + it('does not make additional requests after poll is unsuccessful', () => { + expect(pollRequest).toHaveBeenCalledTimes(1); + expect(pollStop).toHaveBeenCalledTimes(1); + }); + }); + }); +}); diff --git a/spec/frontend/vue_mr_widget/components/terraform/terraform_plan_spec.js b/spec/frontend/vue_mr_widget/components/terraform/terraform_plan_spec.js new file mode 100644 index 00000000000..cc68ba0d9df --- /dev/null +++ b/spec/frontend/vue_mr_widget/components/terraform/terraform_plan_spec.js @@ -0,0 +1,95 @@ +import { GlLink, GlSprintf } from '@gitlab/ui'; +import { shallowMount } from '@vue/test-utils'; +import TerraformPlan from '~/vue_merge_request_widget/components/terraform/terraform_plan.vue'; +import { + invalidPlanWithName, + invalidPlanWithoutName, + validPlanWithName, + validPlanWithoutName, +} from './mock_data'; + +describe('TerraformPlan', () => { + let wrapper; + + const findIcon = () => wrapper.find('[data-testid="change-type-icon"]'); + const findLogButton = () => wrapper.find('[data-testid="terraform-report-link"]'); + + const mountWrapper = propsData => { + wrapper = shallowMount(TerraformPlan, { stubs: { GlLink, GlSprintf }, propsData }); + }; + + afterEach(() => { + wrapper.destroy(); + }); + + describe('valid plan with job_name', () => { + beforeEach(() => { + mountWrapper({ plan: validPlanWithName }); + }); + + it('displays a document icon', () => { + expect(findIcon().attributes('name')).toBe('doc-changes'); + }); + + it('diplays the header text with a name', () => { + expect(wrapper.text()).toContain( + `The Terraform report ${validPlanWithName.job_name} was generated in your pipelines.`, + ); + }); + + it('diplays the reported changes', () => { + expect(wrapper.text()).toContain( + `Reported Resource Changes: ${validPlanWithName.create} to add, ${validPlanWithName.update} to change, ${validPlanWithName.delete} to delete`, + ); + }); + + it('renders button when url is found', () => { + expect(findLogButton().exists()).toBe(true); + expect(findLogButton().text()).toEqual('View full log'); + }); + }); + + describe('valid plan without job_name', () => { + beforeEach(() => { + mountWrapper({ plan: validPlanWithoutName }); + }); + + it('diplays the header text without a name', () => { + expect(wrapper.text()).toContain('A Terraform report was generated in your pipelines.'); + }); + }); + + describe('invalid plan with job_name', () => { + beforeEach(() => { + mountWrapper({ plan: invalidPlanWithName }); + }); + + it('displays a warning icon', () => { + expect(findIcon().attributes('name')).toBe('warning'); + }); + + it('diplays the header text with a name', () => { + expect(wrapper.text()).toContain( + `The Terraform report ${invalidPlanWithName.job_name} failed to generate.`, + ); + }); + + it('diplays generic error since report values are missing', () => { + expect(wrapper.text()).toContain('Generating the report caused an error.'); + }); + }); + + describe('invalid plan with out job_name', () => { + beforeEach(() => { + mountWrapper({ plan: invalidPlanWithoutName }); + }); + + it('diplays the header text without a name', () => { + expect(wrapper.text()).toContain('A Terraform report failed to generate.'); + }); + + it('does not render button because url is missing', () => { + expect(findLogButton().exists()).toBe(false); + }); + }); +}); |