Karma: Fix css selector for loading icon

The GitLab UI update changed the spinner selector from `spinner` to
`gl-spinner`, so we need to update it, so that our tests won't fail.

10 files changed, 17 insertions, 15 deletions

diff --git a/spec/javascripts/badges/components/badge_list_spec.js b/spec/javascripts/badges/components/badge_list_spec.js
index 2f72c9ed89d..2fa807657de 100644
--- a/spec/javascripts/badges/components/badge_list_spec.js
+++ b/spec/javascripts/badges/components/badge_list_spec.js
@@ -60,7 +60,7 @@ describe('BadgeList component', () => {
 
     Vue.nextTick()
       .then(() => {
-        const loadingIcon = vm.$el.querySelector('.spinner');
+        const loadingIcon = vm.$el.querySelector('.gl-spinner');
 
         expect(loadingIcon).toBeVisible();
       })
diff --git a/spec/javascripts/badges/components/badge_spec.js b/spec/javascripts/badges/components/badge_spec.js
index 4e4d1ae2e99..c82a03a628a 100644
--- a/spec/javascripts/badges/components/badge_spec.js
+++ b/spec/javascripts/badges/components/badge_spec.js
@@ -15,7 +15,7 @@ describe('Badge component', () => {
     const buttons = vm.$el.querySelectorAll('button');
     return {
       badgeImage: vm.$el.querySelector('img.project-badge'),
-      loadingIcon: vm.$el.querySelector('.spinner'),
+      loadingIcon: vm.$el.querySelector('.gl-spinner'),
       reloadButton: buttons[buttons.length - 1],
     };
   };
diff --git a/spec/javascripts/boards/board_list_spec.js b/spec/javascripts/boards/board_list_spec.js
index 9c9b435d7fd..6774a46ed58 100644
--- a/spec/javascripts/boards/board_list_spec.js
+++ b/spec/javascripts/boards/board_list_spec.js
@@ -148,7 +148,7 @@ describe('Board list component', () => {
     component.list.loadingMore = true;
 
     Vue.nextTick(() => {
-      expect(component.$el.querySelector('.board-list-count .spinner')).not.toBeNull();
+      expect(component.$el.querySelector('.board-list-count .gl-spinner')).not.toBeNull();
 
       done();
     });
diff --git a/spec/javascripts/registry/components/app_spec.js b/spec/javascripts/registry/components/app_spec.js
index 7b9b8d2b039..e7675669f7a 100644
--- a/spec/javascripts/registry/components/app_spec.js
+++ b/spec/javascripts/registry/components/app_spec.js
@@ -106,7 +106,7 @@ describe('Registry List', () => {
 
     it('should render a loading spinner', done => {
       Vue.nextTick(() => {
-        expect(vm.$el.querySelector('.spinner')).not.toBe(null);
+        expect(vm.$el.querySelector('.gl-spinner')).not.toBe(null);
         done();
       });
     });
diff --git a/spec/javascripts/reports/components/grouped_test_reports_app_spec.js b/spec/javascripts/reports/components/grouped_test_reports_app_spec.js
index a17494966a3..1f1e626ed33 100644
--- a/spec/javascripts/reports/components/grouped_test_reports_app_spec.js
+++ b/spec/javascripts/reports/components/grouped_test_reports_app_spec.js
@@ -34,7 +34,7 @@ describe('Grouped Test Reports App', () => {
 
     it('renders success summary text', done => {
       setTimeout(() => {
-        expect(vm.$el.querySelector('.fa-spinner')).toBeNull();
+        expect(vm.$el.querySelector('.gl-spinner')).toBeNull();
         expect(vm.$el.querySelector('.js-code-text').textContent.trim()).toEqual(
           'Test summary contained no changed test results out of 11 total tests',
         );
@@ -61,7 +61,7 @@ describe('Grouped Test Reports App', () => {
 
     it('renders success summary text', done => {
       setTimeout(() => {
-        expect(vm.$el.querySelector('.spinner')).not.toBeNull();
+        expect(vm.$el.querySelector('.gl-spinner')).not.toBeNull();
         expect(vm.$el.querySelector('.js-code-text').textContent.trim()).toEqual(
           'Test summary results are being parsed',
         );
@@ -81,7 +81,7 @@ describe('Grouped Test Reports App', () => {
 
     it('renders failed summary text + new badge', done => {
       setTimeout(() => {
-        expect(vm.$el.querySelector('.spinner')).toBeNull();
+        expect(vm.$el.querySelector('.gl-spinner')).toBeNull();
         expect(vm.$el.querySelector('.js-code-text').textContent.trim()).toEqual(
           'Test summary contained 2 failed test results out of 11 total tests',
         );
@@ -109,7 +109,7 @@ describe('Grouped Test Reports App', () => {
 
     it('renders summary text', done => {
       setTimeout(() => {
-        expect(vm.$el.querySelector('.spinner')).toBeNull();
+        expect(vm.$el.querySelector('.gl-spinner')).toBeNull();
         expect(vm.$el.querySelector('.js-code-text').textContent.trim()).toEqual(
           'Test summary contained 2 failed test results and 2 fixed test results out of 11 total tests',
         );
@@ -137,7 +137,7 @@ describe('Grouped Test Reports App', () => {
 
     it('renders summary text', done => {
       setTimeout(() => {
-        expect(vm.$el.querySelector('.spinner')).toBeNull();
+        expect(vm.$el.querySelector('.gl-spinner')).toBeNull();
         expect(vm.$el.querySelector('.js-code-text').textContent.trim()).toEqual(
           'Test summary contained 2 fixed test results out of 11 total tests',
         );
@@ -190,7 +190,7 @@ describe('Grouped Test Reports App', () => {
     });
 
     it('renders loading summary text with loading icon', done => {
-      expect(vm.$el.querySelector('.spinner')).not.toBeNull();
+      expect(vm.$el.querySelector('.gl-spinner')).not.toBeNull();
       expect(vm.$el.querySelector('.js-code-text').textContent.trim()).toEqual(
         'Test summary results are being parsed',
       );
diff --git a/spec/javascripts/vue_mr_widget/components/mr_widget_status_icon_spec.js b/spec/javascripts/vue_mr_widget/components/mr_widget_status_icon_spec.js
index f622f52a7b9..5aac37d28df 100644
--- a/spec/javascripts/vue_mr_widget/components/mr_widget_status_icon_spec.js
+++ b/spec/javascripts/vue_mr_widget/components/mr_widget_status_icon_spec.js
@@ -18,7 +18,7 @@ describe('MR widget status icon component', () => {
     it('renders loading icon', () => {
       vm = mountComponent(Component, { status: 'loading' });
 
-      expect(vm.$el.querySelector('.mr-widget-icon span').classList).toContain('spinner');
+      expect(vm.$el.querySelector('.mr-widget-icon span').classList).toContain('gl-spinner');
     });
   });
 
diff --git a/spec/javascripts/vue_mr_widget/components/states/mr_widget_auto_merge_failed_spec.js b/spec/javascripts/vue_mr_widget/components/states/mr_widget_auto_merge_failed_spec.js
index d93badf8cd3..55a11a72551 100644
--- a/spec/javascripts/vue_mr_widget/components/states/mr_widget_auto_merge_failed_spec.js
+++ b/spec/javascripts/vue_mr_widget/components/states/mr_widget_auto_merge_failed_spec.js
@@ -38,7 +38,9 @@ describe('MRWidgetAutoMergeFailed', () => {
 
     Vue.nextTick(() => {
       expect(vm.$el.querySelector('button').getAttribute('disabled')).toEqual('disabled');
-      expect(vm.$el.querySelector('button .loading-container span').classList).toContain('spinner');
+      expect(vm.$el.querySelector('button .loading-container span').classList).toContain(
+        'gl-spinner',
+      );
       done();
     });
   });
diff --git a/spec/javascripts/vue_mr_widget/components/states/mr_widget_checking_spec.js b/spec/javascripts/vue_mr_widget/components/states/mr_widget_checking_spec.js
index 96e512d222a..70c70eca746 100644
--- a/spec/javascripts/vue_mr_widget/components/states/mr_widget_checking_spec.js
+++ b/spec/javascripts/vue_mr_widget/components/states/mr_widget_checking_spec.js
@@ -20,7 +20,7 @@ describe('MRWidgetChecking', () => {
   });
 
   it('renders loading icon', () => {
-    expect(vm.$el.querySelector('.mr-widget-icon span').classList).toContain('spinner');
+    expect(vm.$el.querySelector('.mr-widget-icon span').classList).toContain('gl-spinner');
   });
 
   it('renders information about merging', () => {
diff --git a/spec/javascripts/vue_shared/components/file_icon_spec.js b/spec/javascripts/vue_shared/components/file_icon_spec.js
index 5bea8c43da3..1f61e19fa84 100644
--- a/spec/javascripts/vue_shared/components/file_icon_spec.js
+++ b/spec/javascripts/vue_shared/components/file_icon_spec.js
@@ -72,7 +72,7 @@ describe('File Icon component', () => {
 
     const { classList } = vm.$el.querySelector('.loading-container span');
 
-    expect(classList.contains('spinner')).toEqual(true);
+    expect(classList.contains('gl-spinner')).toEqual(true);
   });
 
   it('should add a special class and a size class', () => {
diff --git a/spec/javascripts/vue_shared/components/header_ci_component_spec.js b/spec/javascripts/vue_shared/components/header_ci_component_spec.js
index a9c1a67b39b..2b059e5e9f4 100644
--- a/spec/javascripts/vue_shared/components/header_ci_component_spec.js
+++ b/spec/javascripts/vue_shared/components/header_ci_component_spec.js
@@ -88,7 +88,7 @@ describe('Header CI Component', () => {
       vm.actions[0].isLoading = true;
 
       Vue.nextTick(() => {
-        expect(vm.$el.querySelector('.btn .spinner').getAttribute('style')).toBeFalsy();
+        expect(vm.$el.querySelector('.btn .gl-spinner').getAttribute('style')).toBeFalsy();
         done();
       });
     });