3 files changed, 43 insertions, 9 deletions
diff --git a/app/assets/javascripts/vue_merge_request_widget/components/extensions/actions.vue b/app/assets/javascripts/vue_merge_request_widget/components/extensions/actions.vue
index 33a83aef057..d878a1fa2e0 100644
--- a/app/assets/javascripts/vue_merge_request_widget/components/extensions/actions.vue
+++ b/app/assets/javascripts/vue_merge_request_widget/components/extensions/actions.vue
@@ -70,6 +70,7 @@ export default {
         variant="confirm"
         size="small"
         class="gl-display-none gl-md-display-block gl-float-left"
+        data-testid="extension-actions-button"
         @click="onClickAction(btn)"
       >
         {{ btn.text }}
diff --git a/app/assets/javascripts/vue_merge_request_widget/components/extensions/base.vue b/app/assets/javascripts/vue_merge_request_widget/components/extensions/base.vue
index 549cf64fb08..7322958e6df 100644
--- a/app/assets/javascripts/vue_merge_request_widget/components/extensions/base.vue
+++ b/app/assets/javascripts/vue_merge_request_widget/components/extensions/base.vue
@@ -13,6 +13,7 @@ import * as Sentry from '@sentry/browser';
 import api from '~/api';
 import { sprintf, s__, __ } from '~/locale';
 import SmartVirtualList from '~/vue_shared/components/smart_virtual_list.vue';
+import Poll from '~/lib/utils/poll';
 import { EXTENSION_ICON_CLASS, EXTENSION_ICONS } from '../../constants';
 import StatusIcon from './status_icon.vue';
 import Actions from './actions.vue';
@@ -132,19 +133,50 @@ export default {
 
       this.triggerRedisTracking();
     },
+    initExtensionPolling() {
+      const poll = new Poll({
+        resource: {
+          fetchData: () => this.fetchCollapsedData(this.$props),
+        },
+        method: 'fetchData',
+        successCallback: (data) => {
+          if (Object.keys(data).length > 0) {
+            poll.stop();
+            this.setCollapsedData(data);
+          }
+        },
+        errorCallback: (e) => {
+          poll.stop();
+
+          this.setCollapsedError(e);
+        },
+      });
+
+      poll.makeRequest();
+    },
     loadCollapsedData() {
       this.loadingState = LOADING_STATES.collapsedLoading;
 
-      this.fetchCollapsedData(this.$props)
-        .then((data) => {
-          this.collapsedData = data;
-          this.loadingState = null;
-        })
-        .catch((e) => {
-          this.loadingState = LOADING_STATES.collapsedError;
+      if (this.$options.enablePolling) {
+        this.initExtensionPolling();
+      } else {
+        this.fetchCollapsedData(this.$props)
+          .then((data) => {
+            this.setCollapsedData(data);
+          })
+          .catch((e) => {
+            this.setCollapsedError(e);
+          });
+      }
+    },
+    setCollapsedData(data) {
+      this.collapsedData = data;
+      this.loadingState = null;
+    },
+    setCollapsedError(e) {
+      this.loadingState = LOADING_STATES.collapsedError;
 
-          Sentry.captureException(e);
-        });
+      Sentry.captureException(e);
     },
     loadAllData() {
       if (this.hasFullData) return;
diff --git a/app/assets/javascripts/vue_merge_request_widget/components/extensions/index.js b/app/assets/javascripts/vue_merge_request_widget/components/extensions/index.js
index ec6e6ed2620..8438f3492b2 100644
--- a/app/assets/javascripts/vue_merge_request_widget/components/extensions/index.js
+++ b/app/assets/javascripts/vue_merge_request_widget/components/extensions/index.js
@@ -13,6 +13,7 @@ export const registerExtension = (extension) => {
     props: extension.props,
     i18n: extension.i18n,
     expandEvent: extension.expandEvent,
+    enablePolling: extension.enablePolling,
     computed: {
       ...Object.keys(extension.computed).reduce(
         (acc, computedKey) => ({