Merge branch 'issue_24020' into 'master'

fix display hook error message ## What does this MR do? Fix hook error message display. ## Are there points in the code the reviewer needs to double check? Probably Hook will return the plain multi line text. It is better `pre` tag than `h4`. I thought of another good looking display, but I did not come up with it. 😓 ## Why was this MR needed? When the hook returns an STDERR, "Merge in progress" button spinning forever. Due to javascript's error. ## Screenshots (if relevant) When update hook returns an error like ``` XXXXXXXX YYYYYYYY ZZZZZZZZ ``` ![screen_shot](/uploads/8dac77972a309dfcb72c741dffbd7270/screen_shot.png) ## What are the relevant issue numbers? Closes #24020 See merge request !7775

Merge branch 'issue_24020' into 'master'
3a66c239 · Alfredo Sumaran · 4f365066 · 3ce2ba1a · 3a66c239 · 3a66c239
Commit 3a66c239 authored Dec 09, 2016 by Alfredo Sumaran
3 changed files
--- a/app/assets/javascripts/merge_request_widget.js.es6
+++ b/app/assets/javascripts/merge_request_widget.js.es6
@@ -101,7 +101,7 @@
              urlSuffix = deleteSourceBranch ? '?deleted_source_branch=true' : '';
              return window.location.href = window.location.pathname + urlSuffix;
            } else if (data.merge_error) {
-              return this.$widgetBody.html("<h4>" + data.merge_error + "</h4>");
+              return _this.$widgetBody.html("<h4>" + data.merge_error + "</h4>");
            } else {
              callback = function() {
                return merge_request_widget.mergeInProgress(deleteSourceBranch);

--- a/changelogs/unreleased/issue_24020.yml
+++ b/changelogs/unreleased/issue_24020.yml
+---
+title: "fix display hook error message"
+merge_request: 7775
+author: basyura
--- a/spec/javascripts/merge_request_widget_spec.js
+++ b/spec/javascripts/merge_request_widget_spec.js
@@ -106,6 +106,18 @@
      });
    });

+    describe('mergeInProgress', function() {
+       it('should display error with h4 tag', function() {
+          spyOn(this.class.$widgetBody, 'html').and.callFake(function(html) {
+            expect(html).toBe('<h4>Sorry, something went wrong.</h4>');
+          });
+          spyOn($, 'ajax').and.callFake(function(e) {
+            e.success({ merge_error: 'Sorry, something went wrong.' });
+          });
+          this.class.mergeInProgress(null);
+        });
+      });
+
    return describe('getCIStatus', function() {
      beforeEach(function() {
        this.ciStatusData = {