Merge branch 'fix-broken-master-specs' into 'master'

Fix broken master specs

See merge request !1190

app/assets/javascripts/commit/pipelines/pipelines_store.js.es6

@@ -26,7 +26,7 @@ class PipelinesStore {
    */
   startTimeAgoLoops() {
     const startTimeLoops = () => {
-      this.timeLoopInterval = setInterval(function timeloopInterval() {
+      this.timeLoopInterval = setInterval(() => {
         this.$children[0].$children.reduce((acc, component) => {
           const timeAgoComponent = component.$children.filter(el => el.$options._componentTag === 'time-ago')[0];
           acc.push(timeAgoComponent);

app/assets/javascripts/diff_notes/components/comment_resolve_btn.js.es6

 /* eslint-disable comma-dangle, object-shorthand, func-names, no-else-return, quotes, no-lonely-if, max-len */
 /* global Vue */
 /* global CommentsStore */
+const Vue = require('vue');
 
 (() => {
   const CommentAndResolveBtn = Vue.extend({

app/assets/javascripts/diff_notes/components/jump_to_discussion.js.es6

@@ -2,6 +2,7 @@
 /* global Vue */
 /* global DiscussionMixins */
 /* global CommentsStore */
+const Vue = require('vue');
 
 (() => {
   const JumpToDiscussion = Vue.extend({

app/assets/javascripts/diff_notes/components/resolve_btn.js.es6

@@ -3,6 +3,7 @@
 /* global CommentsStore */
 /* global ResolveService */
 /* global Flash */
+const Vue = require('vue');
 
 (() => {
   const ResolveBtn = Vue.extend({
@@ -16,6 +17,7 @@
     },
     data: function () {
       return {
+        note: {},
         discussions: CommentsStore.state,
         loading: false
       };
@@ -30,13 +32,6 @@
       discussion: function () {
         return this.discussions[this.discussionId];
       },
-      note: function () {
-        if (this.discussion) {
-          return this.discussion.getNote(this.noteId);
-        } else {
-          return undefined;
-        }
-      },
       buttonText: function () {
         if (this.isResolved) {
           return `Resolved by ${this.resolvedByName}`;
@@ -106,6 +101,8 @@
     },
     created: function () {
       CommentsStore.create(this.discussionId, this.noteId, this.canResolve, this.resolved, this.resolvedBy);
+
+      this.note = this.discussion.getNote(this.noteId);
     }
   });
 

app/assets/javascripts/diff_notes/components/resolve_count.js.es6

@@ -2,6 +2,7 @@
 /* global Vue */
 /* global DiscussionMixins */
 /* global CommentsStore */
+const Vue = require('vue');
 
 ((w) => {
   w.ResolveCount = Vue.extend({

app/assets/javascripts/diff_notes/components/resolve_discussion_btn.js.es6

@@ -2,6 +2,7 @@
 /* global Vue */
 /* global CommentsStore */
 /* global ResolveService */
+const Vue = require('vue');
 
 (() => {
   const ResolveDiscussionBtn = Vue.extend({
@@ -13,13 +14,11 @@
     },
     data: function() {
       return {
-        discussions: CommentsStore.state
+        discussions: CommentsStore.state,
+        discussion: {},
       };
     },
     computed: {
-      discussion: function () {
-        return this.discussions[this.discussionId];
-      },
       showButton: function () {
         if (this.discussion) {
           return this.discussion.isResolvable();
@@ -56,6 +55,8 @@
     },
     created: function () {
       CommentsStore.createDiscussion(this.discussionId, this.canResolve);
+
+      this.discussion = this.discussions[this.discussionId];
     }
   });
 

app/assets/javascripts/diff_notes/diff_notes_bundle.js.es6

 /* eslint-disable func-names, comma-dangle, new-cap, no-new, import/newline-after-import, no-multi-spaces, max-len */
 /* global Vue */
 /* global ResolveCount */
+/* global ResolveServiceClass */
 
 function requireAll(context) { return context.keys().map(context); }
+const Vue = require('vue');
 requireAll(require.context('./models',     false, /^\.\/.*\.(js|es6)$/));
 requireAll(require.context('./stores',     false, /^\.\/.*\.(js|es6)$/));
 requireAll(require.context('./services',   false, /^\.\/.*\.(js|es6)$/));
@@ -10,11 +12,14 @@ requireAll(require.context('./mixins',     false, /^\.\/.*\.(js|es6)$/));
 requireAll(require.context('./components', false, /^\.\/.*\.(js|es6)$/));
 
 $(() => {
+  const projectPath = document.querySelector('.merge-request').dataset.projectPath;
   const COMPONENT_SELECTOR = 'resolve-btn, resolve-discussion-btn, jump-to-discussion, comment-and-resolve-btn';
 
   window.gl = window.gl || {};
   window.gl.diffNoteApps = {};
 
+  window.ResolveService = new ResolveServiceClass(projectPath);
+
   gl.diffNotesCompileComponents = () => {
     const $components = $(COMPONENT_SELECTOR).filter(function () {
       return $(this).closest('resolve-count').length !== 1;
@@ -44,6 +49,6 @@ $(() => {
     el: '#resolve-count-app',
     components: {
       'resolve-count': ResolveCount
-    }
+    },
   });
 });

app/assets/javascripts/diff_notes/services/resolve.js.es6

@@ -3,20 +3,21 @@
 /* global Flash */
 /* global CommentsStore */
 
-((w) => {
-  class ResolveServiceClass {
-    constructor() {
-      this.noteResource = Vue.resource('notes{/noteId}/resolve');
-      this.discussionResource = Vue.resource('merge_requests{/mergeRequestId}/discussions{/discussionId}/resolve');
+window.Vue.use(require('vue-resource'));
+
+(() => {
+  window.ResolveServiceClass = class ResolveServiceClass {
+    constructor(rootPath) {
+      this.noteResource = Vue.resource(`${rootPath}/notes{/noteId}/resolve`);
+      this.discussionResource = Vue.resource(`${rootPath}/merge_requests{/mergeRequestId}/discussions{/discussionId}/resolve`);
     }
 
     setCSRF() {
       Vue.http.headers.common['X-CSRF-Token'] = $.rails.csrfToken();
     }
 
-    prepareRequest(root) {
+    prepareRequest() {
       this.setCSRF();
-      Vue.http.options.root = root;
     }
 
     resolve(projectPath, noteId) {
@@ -87,7 +88,5 @@
         discussionId
       }, {});
     }
-  }
-
-  w.ResolveService = new ResolveServiceClass();
-})(window);
+  };
+})();

app/assets/javascripts/merge_request_widget/approvals/approvals_api.js.es6

-/* global Vue */
 /* global Flash */
 
+window.Vue = require('vue');
+window.Vue.use(require('vue-resource'));
+
+const Vue = window.Vue;
 require('./approvals_store');
 
-(() => {
-  class ApprovalsApi {
-    constructor(endpoint) {
-      gl.ApprovalsApi = this;
-      this.init(endpoint);
-    }
+class ApprovalsApi {
+  constructor(endpoint) {
+    gl.ApprovalsApi = this;
+    this.init(endpoint);
+  }
 
-    init(mergeRequestEndpoint) {
-      this.baseEndpoint = `${mergeRequestEndpoint}/approvals`;
-      Vue.http.headers.common['X-CSRF-Token'] = $.rails.csrfToken();
-    }
+  init(mergeRequestEndpoint) {
+    this.baseEndpoint = `${mergeRequestEndpoint}/approvals`;
+    Vue.http.headers.common['X-CSRF-Token'] = $.rails.csrfToken();
+  }
 
-    fetchApprovals() {
-      const flashErrorMessage = 'An error occured while retrieving approval data for this merge request.';
+  fetchApprovals() {
+    const flashErrorMessage = 'An error occured while retrieving approval data for this merge request.';
 
-      return Vue.http.get(this.baseEndpoint).catch(() => new Flash(flashErrorMessage));
-    }
+    return Vue.http.get(this.baseEndpoint).catch(() => new Flash(flashErrorMessage));
+  }
 
-    approveMergeRequest() {
-      const flashErrorMessage = 'An error occured while submitting your approval.';
+  approveMergeRequest() {
+    const flashErrorMessage = 'An error occured while submitting your approval.';
 
-      return Vue.http.post(this.baseEndpoint).catch(() => new Flash(flashErrorMessage));
-    }
+    return Vue.http.post(this.baseEndpoint).catch(() => new Flash(flashErrorMessage));
+  }
 
-    unapproveMergeRequest() {
-      const flashErrorMessage = 'An error occured while removing your approval.';
+  unapproveMergeRequest() {
+    const flashErrorMessage = 'An error occured while removing your approval.';
 
-      return Vue.http.delete(this.baseEndpoint).catch(() => new Flash(flashErrorMessage));
-    }
+    return Vue.http.delete(this.baseEndpoint).catch(() => new Flash(flashErrorMessage));
   }
+}
 
-  gl.ApprovalsApi = ApprovalsApi;
-})();
+window.gl = window.gl || {};
+window.gl.ApprovalsApi = ApprovalsApi;

app/assets/javascripts/merge_request_widget/approvals/approvals_bundle.js.es6

-function requireAll(context) { return context.keys().map(context); }
-
 require('./approvals_store');
 require('./approvals_api');
-
-requireAll(require.context('./components', true, /^\.\/.*\.(js|es6)$/));
+require('./components/approvals_body');
+require('./components/approvals_footer');

app/assets/javascripts/merge_request_widget/approvals/approvals_store.js.es6

-/* global Vue */
-
 require('./approvals_api');
 
-(() => {
-  let singleton;
+let singleton;
 
-  class MergeRequestApprovalsStore {
-    constructor(rootStore) {
-      if (!singleton) {
-        singleton = this;
-        this.init(rootStore);
-      }
-      return singleton;
+class MergeRequestApprovalsStore {
+  constructor(rootStore) {
+    if (!singleton) {
+      singleton = this;
+      this.init(rootStore);
     }
+    return singleton;
+  }
 
-    init(rootStore) {
-      this.rootStore = rootStore;
-      this.api = new gl.ApprovalsApi(rootStore.rootEl.dataset.endpoint);
-      this.state = {
-        fetching: false,
-      };
-    }
+  init(rootStore) {
+    this.rootStore = rootStore;
+    this.api = new gl.ApprovalsApi(rootStore.rootEl.dataset.endpoint);
+    this.state = {
+      fetching: false,
+    };
+  }
 
-    initStoreOnce() {
-      const state = this.state;
-      if (!state.fetching) {
-        state.fetching = true;
-        return this.fetch()
-          .then(() => {
-            state.fetching = false;
-            this.assignToRootStore('showApprovals', true);
-          });
-      }
-      return Promise.resolve();
-    }
+  initStoreOnce() {
+    const state = this.state;
+    if (!state.fetching) {
+      state.fetching = true;
+      return this.fetch()
+        .then(() => {
+          state.fetching = false;
+          this.assignToRootStore('showApprovals', true);
+        });
+    }
+    return Promise.resolve();
+  }
 
-    fetch() {
-      return this.api.fetchApprovals()
-        .then(res => this.assignToRootStore('approvals', res.json()))
-        .then(data => this.setMergeRequestAcceptanceStatus(data.approvals_left));
-    }
+  fetch() {
+    return this.api.fetchApprovals()
+      .then(res => this.assignToRootStore('approvals', res.json()))
+      .then(data => this.setMergeRequestAcceptanceStatus(data.approvals_left));
+  }
 
-    approve() {
-      return this.api.approveMergeRequest()
-        .then(res => this.assignToRootStore('approvals', res.json()))
-        .then(data => this.setMergeRequestAcceptanceStatus(data.approvals_left));
-    }
+  approve() {
+    return this.api.approveMergeRequest()
+      .then(res => this.assignToRootStore('approvals', res.json()))
+      .then(data => this.setMergeRequestAcceptanceStatus(data.approvals_left));
+  }
 
-    unapprove() {
-      return this.api.unapproveMergeRequest()
-        .then(res => this.assignToRootStore('approvals', res.json()))
-        .then(data => this.setMergeRequestAcceptanceStatus(data.approvals_left));
-    }
+  unapprove() {
+    return this.api.unapproveMergeRequest()
+      .then(res => this.assignToRootStore('approvals', res.json()))
+      .then(data => this.setMergeRequestAcceptanceStatus(data.approvals_left));
+  }
 
-    setMergeRequestAcceptanceStatus(approvalsLeft) {
-      return this.rootStore.assignToData('disableAcceptance', !!approvalsLeft);
-    }
+  setMergeRequestAcceptanceStatus(approvalsLeft) {
+    return this.rootStore.assignToData('disableAcceptance', !!approvalsLeft);
+  }
 
-    assignToRootStore(key, data) {
-      return this.rootStore.assignToData(key, data);
-    }
+  assignToRootStore(key, data) {
+    return this.rootStore.assignToData(key, data);
   }
-  gl.MergeRequestApprovalsStore = MergeRequestApprovalsStore;
-})(window.gl || (window.gl = {}));
+}
+
+window.gl = window.gl || {};
+window.gl.MergeRequestApprovalsStore = MergeRequestApprovalsStore;

app/assets/javascripts/merge_request_widget/approvals/components/approvals_body.js.es6

 /* global Vue */
 
+const Vue = require('vue');
 require('../approvals_store');
 require('../approvals_api');
 
-(() => {
-  Vue.component('approvals-body', {
-    name: 'approvals-body',
-    props: {
-      approvedBy: {
-        type: Array,
-        required: false,
-      },
-      approvalsLeft: {
-        type: Number,
-        required: false,
-      },
-      userCanApprove: {
-        type: Boolean,
-        required: false,
-      },
-      userHasApproved: {
-        type: Boolean,
-        required: false,
-      },
-      suggestedApprovers: {
-        type: Array,
-        required: false,
-      },
+Vue.component('approvals-body', {
+  name: 'approvals-body',
+  props: {
+    approvedBy: {
+      type: Array,
+      required: false,
     },
-    data() {
-      return {
-        approving: false,
-      };
+    approvalsLeft: {
+      type: Number,
+      required: false,
     },
-    computed: {
-      approvalsRequiredStringified() {
-        const baseString = `${this.approvalsLeft} more approval`;
-        return this.approvalsLeft === 1 ? baseString : `${baseString}s`;
-      },
-      approverNamesStringified() {
-        const approvers = this.suggestedApprovers;
+    userCanApprove: {
+      type: Boolean,
+      required: false,
+    },
+    userHasApproved: {
+      type: Boolean,
+      required: false,
+    },
+    suggestedApprovers: {
+      type: Array,
+      required: false,
+    },
+  },
+  data() {
+    return {
+      approving: false,
+    };
+  },
+  computed: {
+    approvalsRequiredStringified() {
+      const baseString = `${this.approvalsLeft} more approval`;
+      return this.approvalsLeft === 1 ? baseString : `${baseString}s`;
+    },
+    approverNamesStringified() {
+      const approvers = this.suggestedApprovers;
 
-        if (!approvers) {
-          return '';
-        }
+      if (!approvers) {
+        return '';
+      }
 
-        return approvers.length === 1 ? approvers[0].name :
-          approvers.reduce((memo, curr, index) => {
-            const nextMemo = `${memo}${curr.name}`;
+      return approvers.length === 1 ? approvers[0].name :
+        approvers.reduce((memo, curr, index) => {
+          const nextMemo = `${memo}${curr.name}`;
 
-            if (index === approvers.length - 2) { // second to last index
-              return `${nextMemo} or `;
-            } else if (index === approvers.length - 1) { // last index
-              return nextMemo;
-            }
+          if (index === approvers.length - 2) { // second to last index
+            return `${nextMemo} or `;
+          } else if (index === approvers.length - 1) { // last index
+            return nextMemo;
+          }
 
-            return `${nextMemo}, `;
-          }, '');
-      },
-      showApproveButton() {
-        return this.userCanApprove && !this.userHasApproved;
-      },
-      showSuggestedApprovers() {
-        return this.suggestedApprovers && this.suggestedApprovers.length;
-      },
+          return `${nextMemo}, `;
+        }, '');
+    },
+    showApproveButton() {
+      return this.userCanApprove && !this.userHasApproved;
     },
-    methods: {
-      approveMergeRequest() {
-        this.approving = true;
-        return gl.ApprovalsStore.approve().then(() => {
-          this.approving = false;
-        });
-      },
+    showSuggestedApprovers() {
+      return this.suggestedApprovers && this.suggestedApprovers.length;
     },
-    beforeCreate() {
-      gl.ApprovalsStore.initStoreOnce();
+  },
+  methods: {
+    approveMergeRequest() {
+      this.approving = true;
+      return gl.ApprovalsStore.approve().then(() => {
+        this.approving = false;
+      });
     },
-    template: `
-      <div class='approvals-body mr-widget-footer mr-approvals-footer'>
-        <h4> Requires {{ approvalsRequiredStringified }}
-          <span v-if='showSuggestedApprovers'> (from {{ approverNamesStringified }}) </span>
-        </h4>
-        <div v-if='showApproveButton' class='append-bottom-10'>
-          <button
-            :disabled='approving'
-            @click='approveMergeRequest'
-            class='btn btn-primary approve-btn'>
-            Approve Merge Request
-          </button>
-        </div>
+  },
+  beforeCreate() {
+    gl.ApprovalsStore.initStoreOnce();
+  },
+  template: `
+    <div class='approvals-body mr-widget-footer mr-approvals-footer'>
+      <h4> Requires {{ approvalsRequiredStringified }}
+        <span v-if='showSuggestedApprovers'> (from {{ approverNamesStringified }}) </span>
+      </h4>
+      <div v-if='showApproveButton' class='append-bottom-10'>
+        <button
+          :disabled='approving'
+          @click='approveMergeRequest'
+          class='btn btn-primary approve-btn'>
+          Approve Merge Request
+        </button>
       </div>
-    `,
-  });
-})();
+    </div>
+  `,
+});

app/assets/javascripts/merge_request_widget/approvals/components/approvals_footer.js.es6

 /* global Vue */
 
+const Vue = require('vue');
 require('../approvals_store');
 require('../../../vue_common_component/link_to_member_avatar');
 
-(() => {
-  Vue.component('approvals-footer', {
-    name: 'approvals-footer',
-    props: {
-      approvedBy: {
-        type: Array,
-        required: false,
-      },
-      approvalsLeft: {
-        type: Number,
-        required: false,
-      },
-      userCanApprove: {
-        type: Boolean,
-        required: false,
-      },
-      userHasApproved: {
-        type: Boolean,
-        required: false,
-      },
-      suggestedApprovers: {
-        type: Array,
-        required: false,
-      },
-      pendingAvatarSvg: {
-        type: String,
-        required: true,
-      },
-      checkmarkSvg: {
-        type: String,
-        required: true,
-      },
+Vue.component('approvals-footer', {
+  name: 'approvals-footer',
+  props: {
+    approvedBy: {
+      type: Array,
+      required: false,
     },
-    data() {
-      return {
-        unapproving: false,
-      };
+    approvalsLeft: {
+      type: Number,
+      required: false,
     },
-    computed: {
-      showUnapproveButton() {
-        return this.userHasApproved && !this.userCanApprove;
-      },
+    userCanApprove: {
+      type: Boolean,
+      required: false,
     },
-    methods: {
-      unapproveMergeRequest() {
-        this.unapproving = true;
-        gl.ApprovalsStore.unapprove().then(() => {
-          this.unapproving = false;
-        });
-      },
+    userHasApproved: {
+      type: Boolean,
+      required: false,
     },
-    beforeCreate() {
-      gl.ApprovalsStore.initStoreOnce();
+    suggestedApprovers: {
+      type: Array,
+      required: false,
     },
-    template: `
-      <div class='mr-widget-footer approved-by-users approvals-footer clearfix mr-approvals-footer'>
-        <span class='approvers-prefix'> Approved by </span>
-        <span v-for='approver in approvedBy'>
-          <link-to-member-avatar
-            extra-link-class='approver-avatar'
-            :avatar-url='approver.user.avatar_url'
-            :display-name='approver.user.name'
-            :profile-url='approver.user.web_url'
-            :avatar-html='checkmarkSvg'
-            :show-tooltip='true'>
-          </link-to-member-avatar>
-        </span>
-        <span v-for='n in approvalsLeft'>
-          <link-to-member-avatar
-            :clickable='false'
-            :avatar-html='pendingAvatarSvg'
-            :show-tooltip='false'
-            extra-link-class='hide-asset'>
-          </link-to-member-avatar>
-        </span>
-        <span class='unapprove-btn-wrap' v-if='showUnapproveButton'>
-          <button
-            :disabled='unapproving'
-            @click='unapproveMergeRequest'
-            class='btn btn-link unapprove-btn'>
-            <i class='fa fa-close'></i>
-            Remove your approval</span>
-          </button>
-        </span>
-      </div>
-    `,
-  });
-})();
+    pendingAvatarSvg: {
+      type: String,
+      required: true,
+    },
+    checkmarkSvg: {
+      type: String,
+      required: true,
+    },
+  },
+  data() {
+    return {
+      unapproving: false,
+    };
+  },
+  computed: {
+    showUnapproveButton() {
+      return this.userHasApproved && !this.userCanApprove;
+    },
+  },
+  methods: {
+    unapproveMergeRequest() {
+      this.unapproving = true;
+      gl.ApprovalsStore.unapprove().then(() => {
+        this.unapproving = false;
+      });
+    },
+  },
+  beforeCreate() {
+    gl.ApprovalsStore.initStoreOnce();
+  },
+  template: `
+    <div class='mr-widget-footer approved-by-users approvals-footer clearfix mr-approvals-footer'>
+      <span class='approvers-prefix'> Approved by </span>
+      <span v-for='approver in approvedBy'>
+        <link-to-member-avatar
+          extra-link-class='approver-avatar'
+          :avatar-url='approver.user.avatar_url'
+          :display-name='approver.user.name'
+          :profile-url='approver.user.web_url'
+          :avatar-html='checkmarkSvg'
+          :show-tooltip='true'>
+        </link-to-member-avatar>
+      </span>
+      <span v-for='n in approvalsLeft'>
+        <link-to-member-avatar
+          :clickable='false'
+          :avatar-html='pendingAvatarSvg'
+          :show-tooltip='false'
+          extra-link-class='hide-asset'>
+        </link-to-member-avatar>
+      </span>
+      <span class='unapprove-btn-wrap' v-if='showUnapproveButton'>
+        <button
+          :disabled='unapproving'
+          @click='unapproveMergeRequest'
+          class='btn btn-link unapprove-btn'>
+          <i class='fa fa-close'></i>
+          Remove your approval</span>
+        </button>
+      </span>
+    </div>
+  `,
+});

app/assets/javascripts/merge_request_widget/widget_bundle.js.es6

-/* global Vue */
-
+/* global merge_request_widget */
+const Vue = require('vue');
 require('./widget_store');
 require('./approvals/approvals_bundle');
 
-(() => {
-  $(() => {
-    const rootEl = document.getElementById('merge-request-widget-app');
-    const widgetSharedStore = new gl.MergeRequestWidgetStore(rootEl);
+window.gl = window.gl || {};
+
+$(() => {
+  const rootEl = document.getElementById('merge-request-widget-app');
+  const widgetSharedStore = new gl.MergeRequestWidgetStore(rootEl);
 
-    gl.MergeRequestWidgetApp = new Vue({
-      el: rootEl,
-      data: widgetSharedStore.data,
-    });
+  gl.MergeRequestWidgetApp = new Vue({
+    el: rootEl,
+    data: widgetSharedStore.data,
+    mounted() {
+      // re-init the MiniPipelineGraph because of Vue is messing with the element
+      merge_request_widget.initMiniPipelineGraph();
+    },
   });
-})(window.gl || (window.gl = {}));
+});

app/assets/javascripts/merge_request_widget/widget_store.js.es6

 require('./approvals/approvals_store');
 
-(() => {
-  let singleton;
-
-  class MergeRequestWidgetStore {
-    constructor(rootEl) {
-      if (!singleton) {
-        singleton = gl.MergeRequestWidget.Store = this;
-        this.init(rootEl);
-      }
-      return singleton;
+let singleton;
+
+class MergeRequestWidgetStore {
+  constructor(rootEl) {
+    if (!singleton) {
+      singleton = gl.MergeRequestWidget.Store = this;
+      this.init(rootEl);
     }
+    return singleton;
+  }
 
-    init(rootEl) {
-      this.rootEl = rootEl;
-      this.data = {};
+  init(rootEl) {
+    this.rootEl = rootEl;
+    this.data = {};
 
-      // init other widget stores here
-      this.initWidgetState();
-      this.initApprovals();
-    }
+    // init other widget stores here
+    this.initWidgetState();
+    this.initApprovals();
+  }
 
-    initWidgetState() {
-      this.assignToData('showApprovals', false);
-      this.assignToData('disableAcceptance', this.rootEl.dataset.approvalPending === 'true');
-    }
+  initWidgetState() {
+    this.assignToData('showApprovals', false);
+    this.assignToData('disableAcceptance', this.rootEl.dataset.approvalPending === 'true');
+  }
 
-    initApprovals() {
-      gl.ApprovalsStore = new gl.MergeRequestApprovalsStore(this);
-      this.assignToData('approvals', {});
-    }
+  initApprovals() {
+    gl.ApprovalsStore = new gl.MergeRequestApprovalsStore(this);
+    this.assignToData('approvals', {});
+  }
 
-    assignToData(key, val) {
-      this.data[key] = val;
-      return val;
-    }
+  assignToData(key, val) {
+    this.data[key] = val;
+    return val;
   }
-  gl.MergeRequestWidgetStore = MergeRequestWidgetStore;
-})(window.gl || (window.gl = {}));
+}
+
+window.gl = window.gl || {};
+window.gl.MergeRequestWidgetStore = MergeRequestWidgetStore;

app/assets/javascripts/vue_realtime_listener/index.js.es6

@@ -14,5 +14,16 @@
     window.addEventListener('focus', startIntervals);
     window.addEventListener('blur', removeIntervals);
     document.addEventListener('beforeunload', removeAll);
+
+    // add removeAll methods to stack
+    const stack = gl.VueRealtimeListener.reset;
+    gl.VueRealtimeListener.reset = () => {
+      gl.VueRealtimeListener.reset = stack;
+      removeAll();
+      stack();
+    };
   };
+
+  // remove all event listeners and intervals
+  gl.VueRealtimeListener.reset = () => undefined; // noop
 })(window.gl || (window.gl = {}));

app/views/projects/merge_requests/_show.html.haml

@@ -3,10 +3,9 @@
 - page_description     @merge_request.description
 - page_card_attributes @merge_request.card_attributes
 - content_for :page_specific_javascripts do
-  = page_specific_javascript_bundle_tag('lib_vue')
   = page_specific_javascript_bundle_tag('diff_notes')
 
-.merge-request{ 'data-url' => merge_request_path(@merge_request) }
+.merge-request{ 'data-url' => merge_request_path(@merge_request), 'data-project-path' => project_path(@merge_request.project) }
   = render "projects/merge_requests/show/mr_title"
 
   .merge-request-details.issuable-details{ data: { id: @merge_request.project.id } }

spec/javascripts/commit/pipelines/pipelines_store_spec.js.es6

@@ -7,6 +7,9 @@ describe('Store', () => {
     store = new gl.commits.pipelines.PipelinesStore();
   });
 
+  // unregister intervals and event handlers
+  afterEach(() => gl.VueRealtimeListener.reset());
+
   it('should start with a blank state', () => {
     expect(store.state.pipelines.length).toBe(0);
   });