Merge branch '219861-replace-new-gl-button-subscriptions-checkout-step' into 'master'

Use new gl-button in subscriptions checkout step page

See merge request gitlab-org/gitlab!48765

ee/app/assets/javascripts/subscriptions/new/components/checkout/step.vue

 <script>
 import { mapActions, mapGetters } from 'vuex';
-import { GlFormGroup, GlDeprecatedButton } from '@gitlab/ui';
+import { GlFormGroup, GlButton } from '@gitlab/ui';
 import { convertToSnakeCase, dasherize } from '~/lib/utils/text_utility';
 import StepHeader from './step_header.vue';
 import StepSummary from './step_summary.vue';
@@ -8,7 +8,7 @@ import StepSummary from './step_summary.vue';
 export default {
   components: {
     GlFormGroup,
-    GlDeprecatedButton,
+    GlButton,
     StepHeader,
     StepSummary,
   },
@@ -66,9 +66,9 @@ export default {
       <div v-show="isActive" @keyup.enter="nextStep">
         <slot name="body" :active="isActive"></slot>
         <gl-form-group v-if="nextStepButtonText" class="gl-mt-3 gl-mb-0">
-          <gl-deprecated-button variant="success" :disabled="!isValid" @click="nextStep">
+          <gl-button variant="success" category="primary" :disabled="!isValid" @click="nextStep">
             {{ nextStepButtonText }}
-          </gl-deprecated-button>
+          </gl-button>
         </gl-form-group>
       </div>
       <step-summary v-if="isFinished" :is-editable="isEditable" :edit="edit">

ee/changelogs/unreleased/219861-replace-new-gl-button-subscriptions-checkout-step.yml

+---
+title: Use new gl-button in subscriptions checkout step page
+merge_request: 48765
+author:
+type: other

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

-import { GlDeprecatedButton } from '@gitlab/ui';
+import { GlButton } from '@gitlab/ui';
 import { shallowMount, createLocalVue } from '@vue/test-utils';
 import Vuex from 'vuex';
 import Component from 'ee/subscriptions/new/components/checkout/step.vue';
@@ -125,13 +125,13 @@ describe('Step', () => {
     it('is disabled when this step is not valid', () => {
       createComponent({ isValid: false });
 
-      expect(wrapper.find(GlDeprecatedButton).attributes('disabled')).toBe('true');
+      expect(wrapper.find(GlButton).attributes('disabled')).toBe('true');
     });
 
     it('is enabled when this step is valid', () => {
       createComponent();
 
-      expect(wrapper.find(GlDeprecatedButton).attributes('disabled')).toBeUndefined();
+      expect(wrapper.find(GlButton).attributes('disabled')).toBeUndefined();
     });
   });
 });