Use jQuery niceness on blob_fork_suggestion
Fix https://gitlab.com/gitlab-org/gitlab-ce/merge_requests/10602#note_27871752
This commit is contained in:
parent
9c35162f83
commit
5f7b4cb5d8
3 changed files with 43 additions and 44 deletions
|
@ -16,47 +16,44 @@ const defaults = {
|
|||
class BlobForkSuggestion {
|
||||
constructor(options) {
|
||||
this.elementMap = Object.assign({}, defaults, options);
|
||||
this.onClickWrapper = this.onClick.bind(this);
|
||||
this.onOpenButtonClick = this.onOpenButtonClick.bind(this);
|
||||
this.onCancelButtonClick = this.onCancelButtonClick.bind(this);
|
||||
}
|
||||
|
||||
document.addEventListener('click', this.onClickWrapper);
|
||||
init() {
|
||||
this.bindEvents();
|
||||
|
||||
return this;
|
||||
}
|
||||
|
||||
bindEvents() {
|
||||
$(this.elementMap.openButtons).on('click', this.onOpenButtonClick);
|
||||
$(this.elementMap.cancelButtons).on('click', this.onCancelButtonClick);
|
||||
}
|
||||
|
||||
showSuggestionSection(forkPath, action = 'edit') {
|
||||
[].forEach.call(this.elementMap.suggestionSections, (suggestionSection) => {
|
||||
suggestionSection.classList.remove('hidden');
|
||||
});
|
||||
|
||||
[].forEach.call(this.elementMap.forkButtons, (forkButton) => {
|
||||
forkButton.setAttribute('href', forkPath);
|
||||
});
|
||||
|
||||
[].forEach.call(this.elementMap.actionTextPieces, (actionTextPiece) => {
|
||||
// eslint-disable-next-line no-param-reassign
|
||||
actionTextPiece.textContent = action;
|
||||
});
|
||||
$(this.elementMap.suggestionSections).removeClass('hidden');
|
||||
$(this.elementMap.forkButtons).attr('href', forkPath);
|
||||
$(this.elementMap.actionTextPieces).text(action);
|
||||
}
|
||||
|
||||
hideSuggestionSection() {
|
||||
[].forEach.call(this.elementMap.suggestionSections, (suggestionSection) => {
|
||||
suggestionSection.classList.add('hidden');
|
||||
});
|
||||
$(this.elementMap.suggestionSections).addClass('hidden');
|
||||
}
|
||||
|
||||
onClick(e) {
|
||||
const el = e.target;
|
||||
onOpenButtonClick(e) {
|
||||
const forkPath = $(e.currentTarget).attr('data-fork-path');
|
||||
const action = $(e.currentTarget).attr('data-action');
|
||||
this.showSuggestionSection(forkPath, action);
|
||||
}
|
||||
|
||||
if ([].includes.call(this.elementMap.openButtons, el)) {
|
||||
const { forkPath, action } = el.dataset;
|
||||
this.showSuggestionSection(forkPath, action);
|
||||
}
|
||||
|
||||
if ([].includes.call(this.elementMap.cancelButtons, el)) {
|
||||
this.hideSuggestionSection();
|
||||
}
|
||||
onCancelButtonClick() {
|
||||
this.hideSuggestionSection();
|
||||
}
|
||||
|
||||
destroy() {
|
||||
document.removeEventListener('click', this.onClickWrapper);
|
||||
$(this.elementMap.openButtons).off('click', this.onOpenButtonClick);
|
||||
$(this.elementMap.cancelButtons).off('click', this.onCancelButtonClick);
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
@ -97,7 +97,8 @@ const ShortcutsBlob = require('./shortcuts_blob');
|
|||
cancelButtons: document.querySelectorAll('.js-cancel-fork-suggestion-button'),
|
||||
suggestionSections: document.querySelectorAll('.js-file-fork-suggestion-section'),
|
||||
actionTextPieces: document.querySelectorAll('.js-file-fork-suggestion-section-action'),
|
||||
});
|
||||
})
|
||||
.init();
|
||||
}
|
||||
|
||||
switch (page) {
|
||||
|
|
|
@ -3,20 +3,21 @@ import BlobForkSuggestion from '~/blob/blob_fork_suggestion';
|
|||
describe('BlobForkSuggestion', () => {
|
||||
let blobForkSuggestion;
|
||||
|
||||
const openButtons = [document.createElement('div')];
|
||||
const forkButtons = [document.createElement('a')];
|
||||
const cancelButtons = [document.createElement('div')];
|
||||
const suggestionSections = [document.createElement('div')];
|
||||
const actionTextPieces = [document.createElement('div')];
|
||||
const openButton = document.createElement('div');
|
||||
const forkButton = document.createElement('a');
|
||||
const cancelButton = document.createElement('div');
|
||||
const suggestionSection = document.createElement('div');
|
||||
const actionTextPiece = document.createElement('div');
|
||||
|
||||
beforeEach(() => {
|
||||
blobForkSuggestion = new BlobForkSuggestion({
|
||||
openButtons,
|
||||
forkButtons,
|
||||
cancelButtons,
|
||||
suggestionSections,
|
||||
actionTextPieces,
|
||||
});
|
||||
openButtons: openButton,
|
||||
forkButtons: forkButton,
|
||||
cancelButtons: cancelButton,
|
||||
suggestionSections: suggestionSection,
|
||||
actionTextPieces: actionTextPiece,
|
||||
})
|
||||
.init();
|
||||
});
|
||||
|
||||
afterEach(() => {
|
||||
|
@ -25,13 +26,13 @@ describe('BlobForkSuggestion', () => {
|
|||
|
||||
it('showSuggestionSection', () => {
|
||||
blobForkSuggestion.showSuggestionSection('/foo', 'foo');
|
||||
expect(suggestionSections[0].classList.contains('hidden')).toEqual(false);
|
||||
expect(forkButtons[0].getAttribute('href')).toEqual('/foo');
|
||||
expect(actionTextPieces[0].textContent).toEqual('foo');
|
||||
expect(suggestionSection.classList.contains('hidden')).toEqual(false);
|
||||
expect(forkButton.getAttribute('href')).toEqual('/foo');
|
||||
expect(actionTextPiece.textContent).toEqual('foo');
|
||||
});
|
||||
|
||||
it('hideSuggestionSection', () => {
|
||||
blobForkSuggestion.hideSuggestionSection();
|
||||
expect(suggestionSections[0].classList.contains('hidden')).toEqual(true);
|
||||
expect(suggestionSection.classList.contains('hidden')).toEqual(true);
|
||||
});
|
||||
});
|
||||
|
|
Loading…
Reference in a new issue