diff options
| -rw-r--r-- | app/assets/javascripts/boards/boards_bundle.js.es6 | 42 | ||||
| -rw-r--r-- | changelogs/unreleased/add-issues-tooltip.yml | 4 | ||||
| -rw-r--r-- | spec/features/boards/add_issues_modal_spec.rb | 6 | ||||
| -rw-r--r-- | spec/features/boards/boards_spec.rb | 4 |
4 files changed, 51 insertions, 5 deletions
diff --git a/app/assets/javascripts/boards/boards_bundle.js.es6 b/app/assets/javascripts/boards/boards_bundle.js.es6 index 0c5177ced2f..55d13be6e5f 100644 --- a/app/assets/javascripts/boards/boards_bundle.js.es6 +++ b/app/assets/javascripts/boards/boards_bundle.js.es6 @@ -97,17 +97,53 @@ $(() => { modal: ModalStore.store, store: Store.state, }, + watch: { + disabled() { + this.updateTooltip(); + }, + }, computed: { disabled() { return !this.store.lists.filter(list => list.type !== 'blank' && list.type !== 'done').length; }, + tooltipTitle() { + if (this.disabled) { + return 'Please add a list to your board first'; + } + + return ''; + }, + }, + methods: { + updateTooltip() { + const $tooltip = $(this.$el); + + this.$nextTick(() => { + if (this.disabled) { + $tooltip.tooltip(); + } else { + $tooltip.tooltip('destroy'); + } + }); + }, + openModal() { + if (!this.disabled) { + this.toggleModal(true); + } + }, + }, + mounted() { + this.updateTooltip(); }, template: ` <button - class="btn btn-create pull-right prepend-left-10 has-tooltip" + class="btn btn-create pull-right prepend-left-10" type="button" - :disabled="disabled" - @click="toggleModal(true)"> + data-placement="bottom" + :class="{ 'disabled': disabled }" + :title="tooltipTitle" + :aria-disabled="disabled" + @click="openModal"> Add issues </button> `, diff --git a/changelogs/unreleased/add-issues-tooltip.yml b/changelogs/unreleased/add-issues-tooltip.yml new file mode 100644 index 00000000000..58adb6c6b5a --- /dev/null +++ b/changelogs/unreleased/add-issues-tooltip.yml @@ -0,0 +1,4 @@ +--- +title: Disabled tooltip on add issues button in usse boards +merge_request: +author: diff --git a/spec/features/boards/add_issues_modal_spec.rb b/spec/features/boards/add_issues_modal_spec.rb index 2875fc1e533..a3e24bb5ffa 100644 --- a/spec/features/boards/add_issues_modal_spec.rb +++ b/spec/features/boards/add_issues_modal_spec.rb @@ -49,6 +49,12 @@ describe 'Issue Boards add issue modal', :feature, :js do expect(page).not_to have_selector('.add-issues-modal') end + + it 'does not show tooltip on add issues button' do + button = page.find('.issue-boards-search button', text: 'Add issues') + + expect(button[:title]).not_to eq("Please add a list to your board first") + end end context 'issues list' do diff --git a/spec/features/boards/boards_spec.rb b/spec/features/boards/boards_spec.rb index 1b25b51cfb2..e247bfa2980 100644 --- a/spec/features/boards/boards_spec.rb +++ b/spec/features/boards/boards_spec.rb @@ -28,10 +28,10 @@ describe 'Issue Boards', feature: true, js: true do expect(page).to have_content('Welcome to your Issue Board!') end - it 'disables add issues button by default' do + it 'shows tooltip on add issues button' do button = page.find('.issue-boards-search button', text: 'Add issues') - expect(button[:disabled]).to eq true + expect(button[:"data-original-title"]).to eq("Please add a list to your board first") end it 'hides the blank state when clicking nevermind button' do |