Fix build errors related to CI JavaScript.

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

@@ -40,19 +40,19 @@
     fetch() {
       return this.api.fetchApprovals()
         .then(res => this.assignToRootStore('approvals', res.data))
-        .then(data => this.setMergeRequestAcceptanceStatus(data.approvalsLeft));
+        .then(data => this.setMergeRequestAcceptanceStatus(data.approvals_left));
     }
 
     approve() {
       return this.api.approveMergeRequest()
         .then(res => this.assignToRootStore('approvals', res.data))
-        .then(data => this.setMergeRequestAcceptanceStatus(data.approvalsLeft));
+        .then(data => this.setMergeRequestAcceptanceStatus(data.approvals_left));
     }
 
     unapprove() {
       return this.api.unapproveMergeRequest()
         .then(res => this.assignToRootStore('approvals', res.data))
-        .then(data => this.setMergeRequestAcceptanceStatus(data.approvalsLeft));
+        .then(data => this.setMergeRequestAcceptanceStatus(data.approvals_left));
     }
 
     setMergeRequestAcceptanceStatus(approvalsLeft) {

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

@@ -55,6 +55,9 @@
       showApproveButton() {
         return this.userCanApprove && !this.userHasApproved;
       },
+      showSuggestedApprovers() {
+        return this.suggestedApprovers && this.suggestedApprovers.length;
+      }
     },
     methods: {
       approveMergeRequest() {
@@ -67,7 +70,7 @@
     template: `
       <div class='approvals-body mr-widget-body'>
         <h4> Requires {{ approvalsRequiredStringified }}
-          <span v-if='suggestedApprovers.length'> (from {{ approverNamesStringified }}) </span>
+          <span v-if='showSuggestedApprovers'> (from {{ approverNamesStringified }}) </span>
         </h4>
         <div v-if='showApproveButton' class='append-bottom-10'>
           <button

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

+$(() => {
+  /* TODO: This needs a better home, or should be refactored. It was previously contained
+   * in a script tag in app/views/projects/merge_requests/widget/open/_accept.html.haml,
+   * but Vue chokes on script tags and prevents their execution. So it was moved here
+   * temporarily.
+   * */
+
+  $('.accept-mr-form').on('ajax:send', function() {
+    $(".accept-mr-form :input").disable();
+  });
+
+  $('.accept_merge_request').on('click', function() {
+    $('.js-merge-button').html("<i class='fa fa-spinner fa-spin'></i> Merge in progress");
+  });
+
+  $('.merge_when_build_succeeds').on('click', function() {
+    $("#merge_when_build_succeeds").val("1");
+  });
+
+  $('.js-merge-dropdown a').on('click', function(e) {
+    e.preventDefault();
+    $(this).closest("form").submit();
+  });
+});

app/views/projects/merge_requests/widget/open/_accept.html.haml

+- content_for :page_specific_javascripts do
+  = page_specific_javascript_tag('merge_request_widget/ci_bundle.js')
+
 - status_class = @pipeline ? " ci-#{@pipeline.status}" : nil
 
 = form_for [:merge, @project.namespace.becomes(Namespace), @project, @merge_request], remote: true, method: :post, html: { class: 'accept-mr-form js-quick-submit js-requires-input' } do |f|
@@ -51,21 +54,3 @@
             rows: 14, hint: true
 
     = hidden_field_tag :merge_when_build_succeeds, "", autocomplete: "off"
-
-  :javascript
-    $('.accept-mr-form').on('ajax:send', function() {
-      $(".accept-mr-form :input").disable();
-    });
-
-    $('.accept_merge_request').on('click', function() {
-      $('.js-merge-button').html("<i class='fa fa-spinner fa-spin'></i> Merge in progress");
-    });
-
-    $('.merge_when_build_succeeds').on('click', function() {
-      $("#merge_when_build_succeeds").val("1");
-    });
-
-    $('.js-merge-dropdown a').on('click', function(e) {
-      e.preventDefault();
-      $(this).closest("form").submit();
-    });

config/application.rb

@@ -97,6 +97,7 @@ module Gitlab
     config.assets.precompile << "diff_notes/diff_notes_bundle.js"
     config.assets.precompile << "lib/vue_resource.js"
     config.assets.precompile << "merge_request_widget/widget_bundle.js"
+    config.assets.precompile << "merge_request_widget/ci_bundle.js"
     config.assets.precompile << "issuable/issuable_bundle.js"
     config.assets.precompile << "boards/boards_bundle.js"
     config.assets.precompile << "cycle_analytics/cycle_analytics_bundle.js"

features/steps/project/merge_requests.rb

@@ -610,7 +610,7 @@ class Spinach::Features::ProjectMergeRequests < Spinach::FeatureSteps
 
   step 'I should not see merge button' do
     page.within '.mr-state-widget' do
-      expect(page).not_to have_button("Accept Merge Request")
+      expect(page).to have_button('Accept Merge Request', disabled: true)
     end
   end
 
@@ -622,7 +622,7 @@ class Spinach::Features::ProjectMergeRequests < Spinach::FeatureSteps
 
   step 'I should see approved merge request "Bug NS-04"' do
     page.within '.mr-state-widget' do
-      expect(page).to have_button("Accept Merge Request")
+      expect(page).to have_button('Accept Merge Request', disabled: false)
     end
   end
 
@@ -634,13 +634,13 @@ class Spinach::Features::ProjectMergeRequests < Spinach::FeatureSteps
 
   step 'I should see message that MR require an approval from me' do
     page.within '.mr-state-widget' do
-      expect(page).to have_content("Requires one more approval (from #{current_user.name})")
+      expect(page).to have_content("Requires 1 more approval (from #{current_user.name})")
     end
   end
 
   step 'I should see message that MR require an approval' do
     page.within '.mr-state-widget' do
-      expect(page).to have_content("Requires one more approval")
+      expect(page).to have_content("Requires 1 more approval")
     end
   end