Skip to content

Commit

Permalink
feat(b-navbar-toggle): add disabled prop (#5397)
Browse files Browse the repository at this point in the history
Co-authored-by: Jacob Müller
  • Loading branch information
tmorehouse committed May 18, 2020
1 parent a1543b2 commit 0b7082b
Show file tree
Hide file tree
Showing 3 changed files with 40 additions and 5 deletions.
22 changes: 17 additions & 5 deletions src/components/navbar/navbar-toggle.js
Original file line number Diff line number Diff line change
Expand Up @@ -23,6 +23,10 @@ export const BNavbarToggle = /*#__PURE__*/ Vue.extend({
target: {
type: String,
required: true
},
disabled: {
type: Boolean,
default: false
}
},
data() {
Expand All @@ -36,8 +40,10 @@ export const BNavbarToggle = /*#__PURE__*/ Vue.extend({
},
methods: {
onClick(evt) {
// Emit courtesy `click` event
this.$emit('click', evt)
if (!this.disabled) {
// Emit courtesy `click` event
this.$emit('click', evt)
}
},
handleStateEvt(id, state) {
// We listen for state events so that we can pass the
Expand All @@ -48,17 +54,23 @@ export const BNavbarToggle = /*#__PURE__*/ Vue.extend({
}
},
render(h) {
const expanded = this.toggleState
const { disabled } = this

return h(
'button',
{
staticClass: CLASS_NAME,
class: { disabled },
directives: [{ name: 'BToggle', value: this.target }],
attrs: { type: 'button', 'aria-label': this.label },
attrs: {
type: 'button',
disabled,
'aria-label': this.label
},
on: { click: this.onClick }
},
[
this.normalizeSlot('default', { expanded }) ||
this.normalizeSlot('default', { expanded: this.toggleState }) ||
h('span', { staticClass: `${CLASS_NAME}-icon` })
]
)
Expand Down
18 changes: 18 additions & 0 deletions src/components/navbar/navbar-toggle.spec.js
Original file line number Diff line number Diff line change
Expand Up @@ -159,4 +159,22 @@ describe('navbar-toggle', () => {

wrapper.destroy()
})

it('disabled prop works', async () => {
const wrapper = mount(BNavbarToggle, {
propsData: {
target: 'target-9',
disabled: true
}
})

expect(wrapper.emitted('click')).not.toBeDefined()
expect(wrapper.element.hasAttribute('disabled')).toBe(true)
expect(wrapper.classes()).toContain('disabled')

await wrapper.trigger('click')
expect(wrapper.emitted('click')).not.toBeDefined()

wrapper.destroy()
})
})
5 changes: 5 additions & 0 deletions src/components/navbar/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -78,6 +78,11 @@
"prop": "label",
"settings": true,
"description": "String to place in the toggle's 'aria-label' attribute"
},
{
"prop": "disabled",
"version": "2.15.0",
"description": "When `true`, disables the navbar toggle button, and adds class `disabled` to the button"
}
],
"events": [
Expand Down

0 comments on commit 0b7082b

Please sign in to comment.