From 0966c6d2c674f288be3f1adf576a2fa2aada3691 Mon Sep 17 00:00:00 2001 From: Steffen Rauh Date: Thu, 17 Nov 2016 13:05:32 +0100 Subject: Fix compatibility with Internet Explorer 11 for merge requests --- app/assets/javascripts/lib/utils/common_utils.js | 13 +++++++++ app/assets/javascripts/merge_request_tabs.js.es6 | 5 ++-- ...-compatibility-with-ie11-for-merge-requests.yml | 4 +++ .../javascripts/lib/utils/common_utils_spec.js.es6 | 32 ++++++++++++++++++++++ spec/javascripts/merge_request_tabs_spec.js | 13 ++++++++- 5 files changed, 63 insertions(+), 4 deletions(-) create mode 100644 changelogs/unreleased/fix-compatibility-with-ie11-for-merge-requests.yml create mode 100644 spec/javascripts/lib/utils/common_utils_spec.js.es6 diff --git a/app/assets/javascripts/lib/utils/common_utils.js b/app/assets/javascripts/lib/utils/common_utils.js index 29cba1a49dd..8fa80502d92 100644 --- a/app/assets/javascripts/lib/utils/common_utils.js +++ b/app/assets/javascripts/lib/utils/common_utils.js @@ -97,6 +97,19 @@ return $('body').data('page').split(':')[0]; }; + gl.utils.parseUrl = function (url) { + var parser = document.createElement('a'); + parser.href = url; + return parser; + }; + + gl.utils.parseUrlPathname = function (url) { + var parsedUrl = gl.utils.parseUrl(url); + // parsedUrl.pathname will return an absolute path for Firefox and a relative path for IE11 + // We have to make sure we always have an absolute path. + return parsedUrl.pathname.charAt(0) === '/' ? parsedUrl.pathname : '/' + parsedUrl.pathname; + }; + gl.utils.isMetaKey = function(e) { return e.metaKey || e.ctrlKey || e.altKey || e.shiftKey; }; diff --git a/app/assets/javascripts/merge_request_tabs.js.es6 b/app/assets/javascripts/merge_request_tabs.js.es6 index 583fb9fc03d..771803edb7c 100644 --- a/app/assets/javascripts/merge_request_tabs.js.es6 +++ b/app/assets/javascripts/merge_request_tabs.js.es6 @@ -225,11 +225,10 @@ // We extract pathname for the current Changes tab anchor href // some pages like MergeRequestsController#new has query parameters on that anchor - const url = document.createElement('a'); - url.href = source; + var urlPathname = gl.utils.parseUrlPathname(source); this.ajaxGet({ - url: `${url.pathname}.json${location.search}`, + url: `${urlPathname}.json${location.search}`, success: (data) => { $('#diffs').html(data.html); diff --git a/changelogs/unreleased/fix-compatibility-with-ie11-for-merge-requests.yml b/changelogs/unreleased/fix-compatibility-with-ie11-for-merge-requests.yml new file mode 100644 index 00000000000..db92e45d8f1 --- /dev/null +++ b/changelogs/unreleased/fix-compatibility-with-ie11-for-merge-requests.yml @@ -0,0 +1,4 @@ +--- +title: Fix compatibility with Internet Explorer 11 for merge requests +merge_request: 7525 +author: Steffen Rauh diff --git a/spec/javascripts/lib/utils/common_utils_spec.js.es6 b/spec/javascripts/lib/utils/common_utils_spec.js.es6 new file mode 100644 index 00000000000..ef75f600898 --- /dev/null +++ b/spec/javascripts/lib/utils/common_utils_spec.js.es6 @@ -0,0 +1,32 @@ +//= require lib/utils/common_utils + +(() => { + describe('common_utils', () => { + describe('gl.utils.parseUrl', () => { + it('returns an anchor tag with url', () => { + expect(gl.utils.parseUrl('/some/absolute/url').pathname).toContain('some/absolute/url'); + }); + it('url is escaped', () => { + // IE11 will return a relative pathname while other browsers will return a full pathname. + // parseUrl uses an anchor element for parsing an url. With relative urls, the anchor + // element will create an absolute url relative to the current execution context. + // The JavaScript test suite is executed at '/teaspoon' which will lead to an absolute + // url starting with '/teaspoon'. + expect(gl.utils.parseUrl('" test="asf"').pathname).toEqual('/teaspoon/%22%20test=%22asf%22'); + }); + }); + describe('gl.utils.parseUrlPathname', () => { + beforeEach(() => { + spyOn(gl.utils, 'parseUrl').and.callFake(url => ({ + pathname: url, + })); + }); + it('returns an absolute url when given an absolute url', () => { + expect(gl.utils.parseUrlPathname('/some/absolute/url')).toEqual('/some/absolute/url'); + }); + it('returns an absolute url when given a relative url', () => { + expect(gl.utils.parseUrlPathname('some/relative/url')).toEqual('/some/relative/url'); + }); + }); + }); +})(); diff --git a/spec/javascripts/merge_request_tabs_spec.js b/spec/javascripts/merge_request_tabs_spec.js index 65e4177ecfe..4facc42c5b4 100644 --- a/spec/javascripts/merge_request_tabs_spec.js +++ b/spec/javascripts/merge_request_tabs_spec.js @@ -2,6 +2,8 @@ /*= require merge_request_tabs */ //= require breakpoints +//= require lib/utils/common_utils +//= require jquery.scrollTo (function () { describe('MergeRequestTabs', function () { @@ -21,13 +23,13 @@ setLocation(); this.spies = { - ajax: spyOn($, 'ajax').and.callFake(function () {}), history: spyOn(window.history, 'replaceState').and.callFake(function () {}) }; }); describe('#activateTab', function () { beforeEach(function () { + spyOn($, 'ajax').and.callFake(function() {}); fixture.load('merge_request_tabs.html'); this.subject = this.class.activateTab; }); @@ -51,6 +53,7 @@ describe('#setCurrentAction', function () { beforeEach(function () { + spyOn($, 'ajax').and.callFake(function() {}); this.subject = this.class.setCurrentAction; }); it('changes from commits', function () { @@ -107,5 +110,13 @@ expect(this.subject('show')).toBe('/foo/bar/merge_requests/1'); }); }); + describe('#loadDiff', function() { + it('requires an absolute pathname', function() { + spyOn($, 'ajax').and.callFake(function(options) { + expect(options.url).toEqual('/foo/bar/merge_requests/1/diffs.json'); + }); + this.class.loadDiff('/foo/bar/merge_requests/1/diffs'); + }); + }); }); }).call(this); -- cgit v1.2.1