Merge branch '198495-strengthen-subscriptions-confirm_order-component-test-coverage' into 'master'

Strengthen subscriptions confirm_order component test coverage

Closes #198495

See merge request gitlab-org/gitlab!23976

ee/spec/frontend/subscriptions/new/components/checkout/confirm_order_spec.js

 import Vuex from 'vuex';
 import { shallowMount, createLocalVue } from '@vue/test-utils';
+import Api from 'ee/api';
 import createStore from 'ee/subscriptions/new/store';
 import * as types from 'ee/subscriptions/new/store/mutation_types';
-import { GlButton } from '@gitlab/ui';
+import { GlButton, GlLoadingIcon } from '@gitlab/ui';
 import Component from 'ee/subscriptions/new/components/checkout/confirm_order.vue';
 
 describe('Confirm Order', () => {
@@ -11,6 +12,8 @@ describe('Confirm Order', () => {
 
   let wrapper;
 
+  jest.mock('ee/api.js');
+
   const store = createStore();
 
   const createComponent = (opts = {}) => {
@@ -21,6 +24,9 @@ describe('Confirm Order', () => {
     });
   };
 
+  const findConfirmButton = () => wrapper.find(GlButton);
+  const findLoadingIcon = () => wrapper.find(GlLoadingIcon);
+
   beforeEach(() => {
     createComponent();
   });
@@ -35,7 +41,35 @@ describe('Confirm Order', () => {
     });
 
     it('button should be visible', () => {
-      expect(wrapper.find(GlButton).exists()).toBe(true);
+      expect(findConfirmButton().exists()).toBe(true);
+    });
+
+    it('shows the text "Confirm purchase"', () => {
+      expect(findConfirmButton().text()).toBe('Confirm purchase');
+    });
+
+    it('the loading indicator should not be visible', () => {
+      expect(findLoadingIcon().exists()).toBe(false);
+    });
+
+    describe('Clicking the button', () => {
+      beforeEach(() => {
+        Api.confirmOrder = jest.fn().mockReturnValue(new Promise(jest.fn()));
+
+        findConfirmButton().vm.$emit('click');
+      });
+
+      it('calls the confirmOrder API method', () => {
+        expect(Api.confirmOrder).toHaveBeenCalled();
+      });
+
+      it('shows the text "Confirming..."', () => {
+        expect(findConfirmButton().text()).toBe('Confirming...');
+      });
+
+      it('the loading indicator should be visible', () => {
+        expect(findLoadingIcon().exists()).toBe(true);
+      });
     });
   });
 
@@ -45,7 +79,7 @@ describe('Confirm Order', () => {
     });
 
     it('button should not be visible', () => {
-      expect(wrapper.find(GlButton).exists()).toBe(false);
+      expect(findConfirmButton().exists()).toBe(false);
     });
   });
 });