kotovalexarian-likes-gitlab
/
gitlab-org--gitlab-foss
1
0
Fork 0
Code Releases Activity

Removes disabled state from projects dropdown in dashboard page

This commit is contained in:
Filipa Lacerda 2017-08-30 15:16:37 +01:00
parent 8274e0fe3c
commit 4342f81af2
3 changed files with 35 additions and 39 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
app/assets/javascripts/project_select_combo_button.js
View File

@ -13,8 +13,16 @@ export default class ProjectSelectComboButton {
}
bindEvents() {
this.projectSelectInput.siblings('.new-project-item-select-button')
.on('click', this.openDropdown);
const dropdownButton = this.projectSelectInput.siblings('.new-project-item-select-button');
dropdownButton.on('click', this.openDropdown);
this.newItemBtn.on('click', (e) => {
if (!this.getProjectFromLocalStorage()) {
e.preventDefault();
dropdownButton.trigger('click');
}
});
this.projectSelectInput.on('change', () => this.selectProject());
}
@ -56,10 +64,8 @@ export default class ProjectSelectComboButton {
if (project) {
this.newItemBtn.attr('href', project.url);
this.newItemBtn.text(`${this.formattedText.defaultTextPrefix} in ${project.name}`);
this.newItemBtn.enable();
} else {
this.newItemBtn.text(`Select project to create ${this.formattedText.presetTextSuffix}`);
this.newItemBtn.disable();
}
}

5
changelogs/unreleased/37179-dashboard-project-dropdown.yml Normal file
View File

@ -0,0 +1,5 @@
---
title: Removes disabled state from dashboard project button
merge_request:
author:
type: fixed

55
spec/javascripts/project_select_combo_button_spec.js
View File

@ -2,10 +2,10 @@ import ProjectSelectComboButton from '~/project_select_combo_button';
const fixturePath = 'static/project_select_combo_button.html.raw';
describe('Project Select Combo Button', function () {
describe('Project Select Combo Button', () => {
preloadFixtures(fixturePath);
beforeEach(function () {
beforeEach(() => {
this.defaults = {
label: 'Select project to create issue',
groupId: 12345,
@ -27,53 +27,43 @@ describe('Project Select Combo Button', function () {
this.projectSelectInput = document.querySelector('.project-item-select');
});
describe('on page load when localStorage is empty', function () {
beforeEach(function () {
describe('on page load when localStorage is empty', () => {
beforeEach(() => {
this.comboButton = new ProjectSelectComboButton(this.projectSelectInput);
});
it('newItemBtn is disabled', function () {
expect(this.newItemBtn.hasAttribute('disabled')).toBe(true);
expect(this.newItemBtn.classList.contains('disabled')).toBe(true);
});
it('newItemBtn href is null', function () {
it('newItemBtn href is null', () => {
expect(this.newItemBtn.getAttribute('href')).toBe('');
});
it('newItemBtn text is the plain default label', function () {
it('newItemBtn text is the plain default label', () => {
expect(this.newItemBtn.textContent).toBe(this.defaults.label);
});
});
describe('on page load when localStorage is filled', function () {
beforeEach(function () {
describe('on page load when localStorage is filled', () => {
beforeEach(() => {
window.localStorage
.setItem(this.defaults.localStorageKey, JSON.stringify(this.defaults.projectMeta));
this.comboButton = new ProjectSelectComboButton(this.projectSelectInput);
});
it('newItemBtn is not disabled', function () {
expect(this.newItemBtn.hasAttribute('disabled')).toBe(false);
expect(this.newItemBtn.classList.contains('disabled')).toBe(false);
});
it('newItemBtn href is correctly set', function () {
it('newItemBtn href is correctly set', () => {
expect(this.newItemBtn.getAttribute('href')).toBe(this.defaults.projectMeta.url);
});
it('newItemBtn text is the cached label', function () {
it('newItemBtn text is the cached label', () => {
expect(this.newItemBtn.textContent)
.toBe(`New issue in ${this.defaults.projectMeta.name}`);
});
afterEach(function () {
afterEach(() => {
window.localStorage.clear();
});
});
describe('after selecting a new project', function () {
beforeEach(function () {
describe('after selecting a new project', () => {
beforeEach(() => {
this.comboButton = new ProjectSelectComboButton(this.projectSelectInput);
// mock the effect of selecting an item from the projects dropdown (select2)
@ -82,28 +72,23 @@ describe('Project Select Combo Button', function () {
.trigger('change');
});
it('newItemBtn is not disabled', function () {
expect(this.newItemBtn.hasAttribute('disabled')).toBe(false);
expect(this.newItemBtn.classList.contains('disabled')).toBe(false);
});
it('newItemBtn href is correctly set', function () {
it('newItemBtn href is correctly set', () => {
expect(this.newItemBtn.getAttribute('href'))
.toBe('http://myothercoolproject.com/issues/new');
});
it('newItemBtn text is the selected project label', function () {
it('newItemBtn text is the selected project label', () => {
expect(this.newItemBtn.textContent)
.toBe(`New issue in ${this.defaults.newProjectMeta.name}`);
});
afterEach(function () {
afterEach(() => {
window.localStorage.clear();
});
});
describe('deriveTextVariants', function () {
beforeEach(function () {
describe('deriveTextVariants', () => {
beforeEach(() => {
this.mockExecutionContext = {
resourceType: '',
resourceLabel: '',
@ -114,7 +99,7 @@ describe('Project Select Combo Button', function () {
this.method = this.comboButton.deriveTextVariants.bind(this.mockExecutionContext);
});
it('correctly derives test variants for merge requests', function () {
it('correctly derives test variants for merge requests', () => {
this.mockExecutionContext.resourceType = 'merge_requests';
this.mockExecutionContext.resourceLabel = 'New merge request';
@ -125,7 +110,7 @@ describe('Project Select Combo Button', function () {
expect(returnedVariants.presetTextSuffix).toBe('merge request');
});
it('correctly derives text variants for issues', function () {
it('correctly derives text variants for issues', () => {
this.mockExecutionContext.resourceType = 'issues';
this.mockExecutionContext.resourceLabel = 'New issue';