Merge branch '50801-error-getting-performance-bar-results-for-uuid' into 'master'

Resolve "Error getting performance bar results for <UUID>"

Closes #50801

See merge request gitlab-org/gitlab-ce!21411

4 files changed, 85 insertions, 8 deletions

diff --git a/app/assets/javascripts/performance_bar/index.js b/app/assets/javascripts/performance_bar/index.js
index 41880d27516..6e5ef0ac0b2 100644
--- a/app/assets/javascripts/performance_bar/index.js
+++ b/app/assets/javascripts/performance_bar/index.js
@@ -1,5 +1,4 @@
 import Vue from 'vue';
-import Flash from '../flash';
 import PerformanceBarService from './services/performance_bar_service';
 import PerformanceBarStore from './stores/performance_bar_store';
 
@@ -46,7 +45,8 @@ export default ({ container }) =>
             this.store.addRequestDetails(requestId, res.data.data);
           })
           .catch(() =>
-            Flash(`Error getting performance bar results for ${requestId}`),
+            // eslint-disable-next-line no-console
+            console.warn(`Error getting performance bar results for ${requestId}`),
           );
       },
     },
diff --git a/app/assets/javascripts/performance_bar/services/performance_bar_service.js b/app/assets/javascripts/performance_bar/services/performance_bar_service.js
index bc71911ae35..60d9ba62570 100644
--- a/app/assets/javascripts/performance_bar/services/performance_bar_service.js
+++ b/app/assets/javascripts/performance_bar/services/performance_bar_service.js
@@ -11,13 +11,10 @@ export default class PerformanceBarService {
 
   static registerInterceptor(peekUrl, callback) {
     const interceptor = response => {
-      const requestId = response.headers['x-request-id'];
-      // Get the request URL from response.config for Axios, and response for
-      // Vue Resource.
-      const requestUrl = (response.config || response).url;
-      const cachedResponse = response.headers['x-gitlab-from-cache'] === 'true';
+      const [fireCallback, requestId, requestUrl] =
+        PerformanceBarService.callbackParams(response, peekUrl);
 
-      if (requestUrl !== peekUrl && requestId && !cachedResponse) {
+      if (fireCallback) {
         callback(requestId, requestUrl);
       }
 
@@ -38,4 +35,16 @@ export default class PerformanceBarService {
       vueResourceInterceptor,
     );
   }
+
+  static callbackParams(response, peekUrl) {
+    const requestId = response.headers && response.headers['x-request-id'];
+    // Get the request URL from response.config for Axios, and response for
+    // Vue Resource.
+    const requestUrl = (response.config || response).url;
+    const apiRequest = requestUrl && requestUrl.match(/^\/api\//);
+    const cachedResponse = response.headers && response.headers['x-gitlab-from-cache'] === 'true';
+    const fireCallback = requestUrl !== peekUrl && requestId && !apiRequest && !cachedResponse;
+
+    return [fireCallback, requestId, requestUrl];
+  }
 }
diff --git a/changelogs/unreleased/50801-error-getting-performance-bar-results-for-uuid.yml b/changelogs/unreleased/50801-error-getting-performance-bar-results-for-uuid.yml
new file mode 100644
index 00000000000..6e57a215367
--- /dev/null
+++ b/changelogs/unreleased/50801-error-getting-performance-bar-results-for-uuid.yml
@@ -0,0 +1,5 @@
+---
+title: Don't show flash messages for performance bar errors
+merge_request: 21411
+author:
+type: other
diff --git a/spec/javascripts/performance_bar/services/performance_bar_service_spec.js b/spec/javascripts/performance_bar/services/performance_bar_service_spec.js
new file mode 100644
index 00000000000..bc6947dbe81
--- /dev/null
+++ b/spec/javascripts/performance_bar/services/performance_bar_service_spec.js
@@ -0,0 +1,63 @@
+import PerformanceBarService from '~/performance_bar/services/performance_bar_service';
+
+describe('PerformanceBarService', () => {
+  describe('callbackParams', () => {
+    describe('fireCallback', () => {
+      function fireCallback(response, peekUrl) {
+        return PerformanceBarService.callbackParams(response, peekUrl)[0];
+      }
+
+      it('returns false when the request URL is the peek URL', () => {
+        expect(fireCallback({ headers: { 'x-request-id': '123' }, url: '/peek' }, '/peek'))
+          .toBeFalsy();
+      });
+
+      it('returns false when there is no request ID', () => {
+        expect(fireCallback({ headers: {}, url: '/request' }, '/peek'))
+          .toBeFalsy();
+      });
+
+      it('returns false when the request is an API request', () => {
+        expect(fireCallback({ headers: { 'x-request-id': '123' }, url: '/api/' }, '/peek'))
+          .toBeFalsy();
+      });
+
+      it('returns false when the response is from the cache', () => {
+        expect(fireCallback({ headers: { 'x-request-id': '123', 'x-gitlab-from-cache': 'true' }, url: '/request' }, '/peek'))
+          .toBeFalsy();
+      });
+
+      it('returns true when all conditions are met', () => {
+        expect(fireCallback({ headers: { 'x-request-id': '123' }, url: '/request' }, '/peek'))
+          .toBeTruthy();
+      });
+    });
+
+    describe('requestId', () => {
+      function requestId(response, peekUrl) {
+        return PerformanceBarService.callbackParams(response, peekUrl)[1];
+      }
+
+      it('gets the request ID from the headers', () => {
+        expect(requestId({ headers: { 'x-request-id': '123' } }, '/peek'))
+          .toEqual('123');
+      });
+    });
+
+    describe('requestUrl', () => {
+      function requestUrl(response, peekUrl) {
+        return PerformanceBarService.callbackParams(response, peekUrl)[2];
+      }
+
+      it('gets the request URL from the response object', () => {
+        expect(requestUrl({ headers: {}, url: '/request' }, '/peek'))
+          .toEqual('/request');
+      });
+
+      it('gets the request URL from response.config if present', () => {
+        expect(requestUrl({ headers: {}, config: { url: '/config-url' }, url: '/request' }, '/peek'))
+          .toEqual('/config-url');
+      });
+    });
+  });
+});