Commit f6624b5c authored by Mike Greiling's avatar Mike Greiling

fix eslint failures on Diff and MergeRequestTabs

parent 825fea63
/* eslint-disable */ /* eslint-disable class-methods-use-this, no-param-reassign */
((global) => { ((global) => {
const UNFOLD_COUNT = 20; const UNFOLD_COUNT = 20;
...@@ -29,7 +29,8 @@ ...@@ -29,7 +29,8 @@
const newLineNumber = ref[1]; const newLineNumber = ref[1];
const offset = newLineNumber - oldLineNumber; const offset = newLineNumber - oldLineNumber;
const bottom = $target.hasClass('js-unfold-bottom'); const bottom = $target.hasClass('js-unfold-bottom');
let since, to; let since;
let to;
let unfold = true; let unfold = true;
if (bottom) { if (bottom) {
...@@ -54,19 +55,19 @@ ...@@ -54,19 +55,19 @@
const view = file.data('view'); const view = file.data('view');
const params = { since, to, bottom, offset, unfold, view }; const params = { since, to, bottom, offset, unfold, view };
$.get(link, params, (response) => $target.parent().replaceWith(response)); $.get(link, params, response => $target.parent().replaceWith(response));
} }
handleClickLineNum(event) { handleClickLineNum(event) {
const hash = $(event.currentTarget).attr('href'); const hash = $(event.currentTarget).attr('href');
event.preventDefault(); event.preventDefault();
if (history.pushState) { if (window.history.pushState) {
history.pushState(null, null, hash); window.history.pushState(null, null, hash);
} else { } else {
window.location.hash = hash; window.location.hash = hash;
} }
this.highlighSelectedLine(); this.highlighSelectedLine();
}; }
diffViewType() { diffViewType() {
return $('.inline-parallel-buttons a.active').data('view-type'); return $('.inline-parallel-buttons a.active').data('view-type');
...@@ -76,10 +77,7 @@ ...@@ -76,10 +77,7 @@
if (!line.children().length) { if (!line.children().length) {
return [0, 0]; return [0, 0];
} }
return line.find('.diff-line-num').map((i, elm) => parseInt($(elm).data('linenumber'), 10));
return line.find('.diff-line-num').map(function() {
return parseInt($(this).data('linenumber'));
});
} }
highlighSelectedLine() { highlighSelectedLine() {
...@@ -96,5 +94,4 @@ ...@@ -96,5 +94,4 @@
} }
global.Diff = Diff; global.Diff = Diff;
})(window.gl || (window.gl = {})); })(window.gl || (window.gl = {}));
/* eslint-disable max-len, func-names, space-before-function-paren, no-var, space-before-blocks, prefer-rest-params, wrap-iife, no-use-before-define, no-underscore-dangle, no-undef, one-var, one-var-declaration-per-line, quotes, comma-dangle, consistent-return, prefer-template, no-param-reassign, camelcase, vars-on-top, space-in-parens, curly, prefer-arrow-callback, no-unused-vars, no-return-assign, semi, object-shorthand, operator-assignment, padded-blocks, max-len */ /* eslint-disable no-new, no-param-reassign, class-methods-use-this */
/* global Breakpoints, Cookies, DiffNotesApp */
/*= require js.cookie */
/*= require breakpoints */
/* eslint-disable max-len */
// MergeRequestTabs // MergeRequestTabs
// //
// Handles persisting and restoring the current tab selection and lazily-loading // Handles persisting and restoring the current tab selection and lazily-loading
// content on the MergeRequests#show page. // content on the MergeRequests#show page.
//
/*= require js.cookie */
// //
// ### Example Markup // ### Example Markup
// //
...@@ -45,11 +48,15 @@ ...@@ -45,11 +48,15 @@
// </div> // </div>
// </div> // </div>
// //
/* eslint-enable max-len */
((global) => { ((global) => {
// Store the `location` object, allowing for easier stubbing in tests
let location = window.location;
class MergeRequestTabs { class MergeRequestTabs {
constructor({ action, setUrl, buildsLoaded } = {}) { constructor({ action, setUrl, buildsLoaded, stubLocation } = {}) {
this.diffsLoaded = false; this.diffsLoaded = false;
this.buildsLoaded = false; this.buildsLoaded = false;
this.pipelinesLoaded = false; this.pipelinesLoaded = false;
...@@ -63,8 +70,10 @@ ...@@ -63,8 +70,10 @@
this.tabShown = this.tabShown.bind(this); this.tabShown = this.tabShown.bind(this);
this.showTab = this.showTab.bind(this); this.showTab = this.showTab.bind(this);
// Store the `location` object, allowing for easier stubbing in tests if (stubLocation) {
this._location = window.location; location = stubLocation;
}
this.bindEvents(); this.bindEvents();
this.activateTab(action); this.activateTab(action);
this.initAffix(); this.initAffix();
...@@ -97,15 +106,15 @@ ...@@ -97,15 +106,15 @@
this.resetViewContainer(); this.resetViewContainer();
} else if (this.isDiffAction(action)) { } else if (this.isDiffAction(action)) {
this.loadDiff($target.attr('href')); this.loadDiff($target.attr('href'));
if ((typeof bp !== "undefined" && bp !== null) && bp.getBreakpointSize() !== 'lg') { if (Breakpoints.get().getBreakpointSize() !== 'lg') {
this.shrinkView(); this.shrinkView();
} }
if (this.diffViewType() === 'parallel') { if (this.diffViewType() === 'parallel') {
this.expandViewContainer(); this.expandViewContainer();
} }
const navBarHeight = $('.navbar-gitlab').outerHeight(); const navBarHeight = $('.navbar-gitlab').outerHeight();
$.scrollTo(".merge-request-details .merge-request-tabs", { $.scrollTo('.merge-request-details .merge-request-tabs', {
offset: -navBarHeight offset: -navBarHeight,
}); });
} else if (action === 'builds') { } else if (action === 'builds') {
this.loadBuilds($target.attr('href')); this.loadBuilds($target.attr('href'));
...@@ -125,13 +134,12 @@ ...@@ -125,13 +134,12 @@
} }
scrollToElement(container) { scrollToElement(container) {
if (window.location.hash) { if (location.hash) {
const navBarHeight = $('.navbar-gitlab').outerHeight() + $('.layout-nav').outerHeight() + document.querySelector('.js-tabs-affix').offsetHeight; const navBarHeight = $('.navbar-gitlab').outerHeight() + $('.layout-nav').outerHeight() + document.querySelector('.js-tabs-affix').offsetHeight;
const navBarHeight = $('.navbar-gitlab').outerHeight() + $('.layout-nav').outerHeight(); const $el = $(`${container} ${location.hash}:not(.match)`);
const $el = $(`${container} ${window.location.hash}:not(.match)`);
if ($el.length) { if ($el.length) {
$.scrollTo($el[0], { $.scrollTo($el[0], {
offset: -navBarHeight offset: -navBarHeight,
}); });
} }
} }
...@@ -139,11 +147,9 @@ ...@@ -139,11 +147,9 @@
// Activate a tab based on the current action // Activate a tab based on the current action
activateTab(action) { activateTab(action) {
if (action === 'show') { const activate = action === 'show' ? 'notes' : action;
action = 'notes';
}
// important note: the .tab('show') method triggers 'shown.bs.tab' event itself // important note: the .tab('show') method triggers 'shown.bs.tab' event itself
$(`.merge-request-tabs a[data-action='${action}']`).tab('show'); $(`.merge-request-tabs a[data-action='${activate}']`).tab('show');
} }
// Replaces the current Merge Request-specific action in the URL with a new one // Replaces the current Merge Request-specific action in the URL with a new one
...@@ -167,33 +173,29 @@ ...@@ -167,33 +173,29 @@
// //
// Returns the new URL String // Returns the new URL String
setCurrentAction(action) { setCurrentAction(action) {
// Normalize action, just to be safe this.currentAction = action === 'show' ? 'notes' : action;
if (action === 'show') {
action = 'notes';
}
this.currentAction = action;
// Remove a trailing '/commits' '/diffs' '/builds' '/pipelines' '/new' '/new/diffs' // Remove a trailing '/commits' '/diffs' '/builds' '/pipelines' '/new' '/new/diffs'
let new_state = this._location.pathname.replace(/\/(commits|diffs|builds|pipelines|new|new\/diffs)(\.html)?\/?$/, ''); let newState = location.pathname.replace(/\/(commits|diffs|builds|pipelines|new|new\/diffs)(\.html)?\/?$/, '');
// Append the new action if we're on a tab other than 'notes' // Append the new action if we're on a tab other than 'notes'
if (action !== 'notes') { if (this.currentAction !== 'notes') {
new_state += `/${action}`; newState += `/${this.currentAction}`;
} }
// Ensure parameters and hash come along for the ride // Ensure parameters and hash come along for the ride
new_state += this._location.search + this._location.hash; newState += location.search + location.hash;
// Replace the current history state with the new one without breaking // Replace the current history state with the new one without breaking
// Turbolinks' history. // Turbolinks' history.
// //
// See https://github.com/rails/turbolinks/issues/363 // See https://github.com/rails/turbolinks/issues/363
history.replaceState({ window.history.replaceState({
turbolinks: true, turbolinks: true,
url: new_state url: newState,
}, document.title, new_state); }, document.title, newState);
return new_state; return newState;
} }
loadCommits(source) { loadCommits(source) {
...@@ -203,11 +205,11 @@ ...@@ -203,11 +205,11 @@
this.ajaxGet({ this.ajaxGet({
url: `${source}.json`, url: `${source}.json`,
success: (data) => { success: (data) => {
document.querySelector("div#commits").innerHTML = data.html; document.querySelector('div#commits').innerHTML = data.html;
gl.utils.localTimeAgo($('.js-timeago', 'div#commits')); gl.utils.localTimeAgo($('.js-timeago', 'div#commits'));
this.commitsLoaded = true; this.commitsLoaded = true;
this.scrollToElement("#commits"); this.scrollToElement('#commits');
} },
}); });
} }
...@@ -222,7 +224,7 @@ ...@@ -222,7 +224,7 @@
url.href = source; url.href = source;
this.ajaxGet({ this.ajaxGet({
url: `${url.pathname}.json${this._location.search}`, url: `${url.pathname}.json${location.search}`,
success: (data) => { success: (data) => {
$('#diffs').html(data.html); $('#diffs').html(data.html);
...@@ -233,14 +235,14 @@ ...@@ -233,14 +235,14 @@
gl.utils.localTimeAgo($('.js-timeago', 'div#diffs')); gl.utils.localTimeAgo($('.js-timeago', 'div#diffs'));
$('#diffs .js-syntax-highlight').syntaxHighlight(); $('#diffs .js-syntax-highlight').syntaxHighlight();
if (this.diffViewType() === 'parallel' && this.isDiffAction(this.currentAction) ) { if (this.diffViewType() === 'parallel' && this.isDiffAction(this.currentAction)) {
this.expandViewContainer(); this.expandViewContainer();
} }
this.diffsLoaded = true; this.diffsLoaded = true;
this.scrollToElement("#diffs"); this.scrollToElement('#diffs');
new gl.Diff(); new gl.Diff();
} },
}); });
} }
...@@ -251,12 +253,12 @@ ...@@ -251,12 +253,12 @@
this.ajaxGet({ this.ajaxGet({
url: `${source}.json`, url: `${source}.json`,
success: (data) => { success: (data) => {
document.querySelector("div#builds").innerHTML = data.html; document.querySelector('div#builds').innerHTML = data.html;
gl.utils.localTimeAgo($('.js-timeago', 'div#builds')); gl.utils.localTimeAgo($('.js-timeago', 'div#builds'));
this.buildsLoaded = true; this.buildsLoaded = true;
new gl.Pipelines(); new gl.Pipelines();
this.scrollToElement("#builds"); this.scrollToElement('#builds');
} },
}); });
} }
...@@ -270,8 +272,8 @@ ...@@ -270,8 +272,8 @@
$('#pipelines').html(data.html); $('#pipelines').html(data.html);
gl.utils.localTimeAgo($('.js-timeago', '#pipelines')); gl.utils.localTimeAgo($('.js-timeago', '#pipelines'));
this.pipelinesLoaded = true; this.pipelinesLoaded = true;
this.scrollToElement("#pipelines"); this.scrollToElement('#pipelines');
} },
}); });
} }
...@@ -287,10 +289,9 @@ ...@@ -287,10 +289,9 @@
beforeSend: () => this.toggleLoading(true), beforeSend: () => this.toggleLoading(true),
complete: () => this.toggleLoading(false), complete: () => this.toggleLoading(false),
dataType: 'json', dataType: 'json',
type: 'GET' type: 'GET',
}; };
options = $.extend({}, defaults, options); $.ajax($.extend({}, defaults, options));
$.ajax(options);
} }
diffViewType() { diffViewType() {
...@@ -298,7 +299,7 @@ ...@@ -298,7 +299,7 @@
} }
isDiffAction(action) { isDiffAction(action) {
return action === 'diffs' || action === 'new/diffs' return action === 'diffs' || action === 'new/diffs';
} }
expandViewContainer() { expandViewContainer() {
...@@ -356,11 +357,13 @@ ...@@ -356,11 +357,13 @@
const $layoutNav = $('.layout-nav'); const $layoutNav = $('.layout-nav');
$tabs.off('affix.bs.affix affix-top.bs.affix') $tabs.off('affix.bs.affix affix-top.bs.affix')
.affix({ offset: { .affix({
offset: {
top: () => ( top: () => (
$diffTabs.offset().top - $tabs.height() - $fixedNav.height() - $layoutNav.height() $diffTabs.offset().top - $tabs.height() - $fixedNav.height() - $layoutNav.height()
) ),
}}) },
})
.on('affix.bs.affix', () => $diffTabs.css({ marginTop: $tabs.height() })) .on('affix.bs.affix', () => $diffTabs.css({ marginTop: $tabs.height() }))
.on('affix-top.bs.affix', () => $diffTabs.css({ marginTop: '' })); .on('affix-top.bs.affix', () => $diffTabs.css({ marginTop: '' }));
...@@ -372,5 +375,4 @@ ...@@ -372,5 +375,4 @@
} }
global.MergeRequestTabs = MergeRequestTabs; global.MergeRequestTabs = MergeRequestTabs;
})(window.gl || (window.gl = {})); })(window.gl || (window.gl = {}));
/* eslint-disable space-before-function-paren, no-var, comma-dangle, dot-notation, quotes, no-undef, no-return-assign, no-underscore-dangle, camelcase, padded-blocks, max-len */ /* eslint-disable no-var, comma-dangle, object-shorthand */
/*= require merge_request_tabs */ /*= require merge_request_tabs */
//= require breakpoints //= require breakpoints
(function() { (function () {
describe('MergeRequestTabs', function() { describe('MergeRequestTabs', function () {
var stubLocation; var stubLocation = {};
stubLocation = function(stubs) { var setLocation = function (stubs) {
var defaults; var defaults = {
defaults = {
pathname: '', pathname: '',
search: '', search: '',
hash: '' hash: ''
}; };
return $.extend(defaults, stubs); $.extend(stubLocation, defaults, stubs || {});
}; };
fixture.preload('merge_request_tabs.html'); fixture.preload('merge_request_tabs.html');
beforeEach(function() {
this["class"] = new gl.MergeRequestTabs(); beforeEach(function () {
return this.spies = { this.class = new gl.MergeRequestTabs({ stubLocation: stubLocation });
ajax: spyOn($, 'ajax').and.callFake(function() {}), setLocation();
history: spyOn(history, 'replaceState').and.callFake(function() {})
this.spies = {
ajax: spyOn($, 'ajax').and.callFake(function () {}),
history: spyOn(window.history, 'replaceState').and.callFake(function () {})
}; };
}); });
describe('#activateTab', function() {
beforeEach(function() { describe('#activateTab', function () {
beforeEach(function () {
fixture.load('merge_request_tabs.html'); fixture.load('merge_request_tabs.html');
return this.subject = this["class"].activateTab; this.subject = this.class.activateTab;
}); });
it('shows the first tab when action is show', function() { it('shows the first tab when action is show', function () {
this.subject('show'); this.subject('show');
return expect($('#notes')).toHaveClass('active'); expect($('#notes')).toHaveClass('active');
}); });
it('shows the notes tab when action is notes', function() { it('shows the notes tab when action is notes', function () {
this.subject('notes'); this.subject('notes');
return expect($('#notes')).toHaveClass('active'); expect($('#notes')).toHaveClass('active');
}); });
it('shows the commits tab when action is commits', function() { it('shows the commits tab when action is commits', function () {
this.subject('commits'); this.subject('commits');
return expect($('#commits')).toHaveClass('active'); expect($('#commits')).toHaveClass('active');
}); });
return it('shows the diffs tab when action is diffs', function() { it('shows the diffs tab when action is diffs', function () {
this.subject('diffs'); this.subject('diffs');
return expect($('#diffs')).toHaveClass('active'); expect($('#diffs')).toHaveClass('active');
}); });
}); });
return describe('#setCurrentAction', function() {
beforeEach(function() { describe('#setCurrentAction', function () {
return this.subject = this["class"].setCurrentAction; beforeEach(function () {
this.subject = this.class.setCurrentAction;
}); });
it('changes from commits', function() { it('changes from commits', function () {
this["class"]._location = stubLocation({ setLocation({
pathname: '/foo/bar/merge_requests/1/commits' pathname: '/foo/bar/merge_requests/1/commits'
}); });
expect(this.subject('notes')).toBe('/foo/bar/merge_requests/1'); expect(this.subject('notes')).toBe('/foo/bar/merge_requests/1');
return expect(this.subject('diffs')).toBe('/foo/bar/merge_requests/1/diffs'); expect(this.subject('diffs')).toBe('/foo/bar/merge_requests/1/diffs');
}); });
it('changes from diffs', function() { it('changes from diffs', function () {
this["class"]._location = stubLocation({ setLocation({
pathname: '/foo/bar/merge_requests/1/diffs' pathname: '/foo/bar/merge_requests/1/diffs'
}); });
expect(this.subject('notes')).toBe('/foo/bar/merge_requests/1'); expect(this.subject('notes')).toBe('/foo/bar/merge_requests/1');
return expect(this.subject('commits')).toBe('/foo/bar/merge_requests/1/commits'); expect(this.subject('commits')).toBe('/foo/bar/merge_requests/1/commits');
}); });
it('changes from diffs.html', function() { it('changes from diffs.html', function () {
this["class"]._location = stubLocation({ setLocation({
pathname: '/foo/bar/merge_requests/1/diffs.html' pathname: '/foo/bar/merge_requests/1/diffs.html'
}); });
expect(this.subject('notes')).toBe('/foo/bar/merge_requests/1'); expect(this.subject('notes')).toBe('/foo/bar/merge_requests/1');
return expect(this.subject('commits')).toBe('/foo/bar/merge_requests/1/commits'); expect(this.subject('commits')).toBe('/foo/bar/merge_requests/1/commits');
}); });
it('changes from notes', function() { it('changes from notes', function () {
this["class"]._location = stubLocation({ setLocation({
pathname: '/foo/bar/merge_requests/1' pathname: '/foo/bar/merge_requests/1'
}); });
expect(this.subject('diffs')).toBe('/foo/bar/merge_requests/1/diffs'); expect(this.subject('diffs')).toBe('/foo/bar/merge_requests/1/diffs');
return expect(this.subject('commits')).toBe('/foo/bar/merge_requests/1/commits'); expect(this.subject('commits')).toBe('/foo/bar/merge_requests/1/commits');
}); });
it('includes search parameters and hash string', function() { it('includes search parameters and hash string', function () {
this["class"]._location = stubLocation({ setLocation({
pathname: '/foo/bar/merge_requests/1/diffs', pathname: '/foo/bar/merge_requests/1/diffs',
search: '?view=parallel', search: '?view=parallel',
hash: '#L15-35' hash: '#L15-35'
}); });
return expect(this.subject('show')).toBe('/foo/bar/merge_requests/1?view=parallel#L15-35'); expect(this.subject('show')).toBe('/foo/bar/merge_requests/1?view=parallel#L15-35');
}); });
it('replaces the current history state', function() { it('replaces the current history state', function () {
var new_state; var newState;
this["class"]._location = stubLocation({ setLocation({
pathname: '/foo/bar/merge_requests/1' pathname: '/foo/bar/merge_requests/1'
}); });
new_state = this.subject('commits'); newState = this.subject('commits');
return expect(this.spies.history).toHaveBeenCalledWith({ expect(this.spies.history).toHaveBeenCalledWith({
turbolinks: true, turbolinks: true,
url: new_state url: newState
}, document.title, new_state); }, document.title, newState);
}); });
return it('treats "show" like "notes"', function() { it('treats "show" like "notes"', function () {
this["class"]._location = stubLocation({ setLocation({
pathname: '/foo/bar/merge_requests/1/commits' pathname: '/foo/bar/merge_requests/1/commits'
}); });
return expect(this.subject('show')).toBe('/foo/bar/merge_requests/1'); expect(this.subject('show')).toBe('/foo/bar/merge_requests/1');
}); });
}); });
}); });
}).call(this); }).call(this);
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment