Merge branch '285585-geo-fix-help-text' into 'master'

Geo Replicables - Fix missing help text

See merge request gitlab-org/gitlab!48378

ee/app/assets/javascripts/geo_replicable/components/geo_replicable_empty_state.vue

 <script>
 import { mapGetters } from 'vuex';
-import { GlEmptyState } from '@gitlab/ui';
+import { GlEmptyState, GlSprintf, GlLink } from '@gitlab/ui';
 
 export default {
   name: 'GeoReplicableEmptyState',
   components: {
     GlEmptyState,
+    GlSprintf,
+    GlLink,
   },
   props: {
     geoReplicableEmptySvgPath: {

ee/changelogs/unreleased/285585-geo-fix-help-text.yml

+---
+title: Geo Replicables - Fix missing help text
+merge_request: 48378
+author:
+type: fixed

ee/spec/frontend/geo_replicable/components/geo_replicable_empty_state_spec.js

-import { GlEmptyState } from '@gitlab/ui';
-import { createLocalVue, shallowMount } from '@vue/test-utils';
+import { createLocalVue, mount } from '@vue/test-utils';
+import { getByRole, getByAltText } from '@testing-library/dom';
 import Vuex from 'vuex';
 import GeoReplicableEmptyState from 'ee/geo_replicable/components/geo_replicable_empty_state.vue';
 import createStore from 'ee/geo_replicable/store';
@@ -21,7 +21,7 @@ describe('GeoReplicableEmptyState', () => {
   };
 
   const createComponent = () => {
-    wrapper = shallowMount(GeoReplicableEmptyState, {
+    wrapper = mount(GeoReplicableEmptyState, {
       localVue,
       store: createStore({ replicableType: MOCK_REPLICABLE_TYPE, graphqlFieldName: null }),
       propsData,
@@ -30,23 +30,26 @@ describe('GeoReplicableEmptyState', () => {
 
   afterEach(() => {
     wrapper.destroy();
+    wrapper = null;
   });
 
-  const findGlEmptyState = () => wrapper.find(GlEmptyState);
-
   describe('template', () => {
     beforeEach(() => {
       createComponent();
     });
 
-    describe('GlEmptyState', () => {
-      it('renders always', () => {
-        expect(findGlEmptyState().exists()).toBe(true);
-      });
+    it('renders correct link', () => {
+      expect(
+        getByRole(wrapper.element, 'link', { name: 'Geo Troubleshooting' }).getAttribute('href'),
+      ).toBe(MOCK_GEO_TROUBLESHOOTING_LINK);
+    });
 
-      it('sets correct svg', () => {
-        expect(findGlEmptyState().attributes('svgpath')).toBe(MOCK_GEO_REPLICATION_SVG_PATH);
-      });
+    it('sets correct svg', () => {
+      expect(
+        getByAltText(wrapper.element, `There are no ${MOCK_REPLICABLE_TYPE} to show`).getAttribute(
+          'src',
+        ),
+      ).toBe(MOCK_GEO_REPLICATION_SVG_PATH);
     });
   });
 });