Skip to content

Commit

Permalink
fix event name casing
Browse files Browse the repository at this point in the history
Vue broke this in a 3.0.5 release, it still worked in 3.0.4.

Fixes: #267
  • Loading branch information
RobinMalfait committed Mar 15, 2021
1 parent 663ef17 commit 70459c6
Show file tree
Hide file tree
Showing 4 changed files with 32 additions and 32 deletions.
12 changes: 6 additions & 6 deletions packages/@headlessui-vue/src/components/listbox/listbox.ts
Original file line number Diff line number Diff line change
Expand Up @@ -260,7 +260,7 @@ export let ListboxButton = defineComponent({
? [dom(api.labelRef)?.id, this.id].join(' ')
: undefined,
disabled: api.disabled,
onKeyDown: this.handleKeyDown,
onKeydown: this.handleKeyDown,
onClick: this.handleClick,
}

Expand Down Expand Up @@ -337,7 +337,7 @@ export let ListboxOptions = defineComponent({
: api.options.value[api.activeOptionIndex.value]?.id,
'aria-labelledby': dom(api.labelRef)?.id ?? dom(api.buttonRef)?.id,
id: this.id,
onKeyDown: this.handleKeyDown,
onKeydown: this.handleKeyDown,
role: 'listbox',
tabIndex: 0,
ref: 'el',
Expand Down Expand Up @@ -509,10 +509,10 @@ export let ListboxOption = defineComponent({
'aria-selected': selected.value === true ? selected.value : undefined,
onClick: handleClick,
onFocus: handleFocus,
onPointerMove: handleMove,
onMouseMove: handleMove,
onPointerLeave: handleLeave,
onMouseLeave: handleLeave,
onPointermove: handleMove,
onMousemove: handleMove,
onPointerleave: handleLeave,
onMouseleave: handleLeave,
}

return render({ props: { ...props, ...propsWeControl }, slot, attrs, slots })
Expand Down
12 changes: 6 additions & 6 deletions packages/@headlessui-vue/src/components/menu/menu.ts
Original file line number Diff line number Diff line change
Expand Up @@ -179,7 +179,7 @@ export let MenuButton = defineComponent({
'aria-haspopup': true,
'aria-controls': dom(api.itemsRef)?.id,
'aria-expanded': api.menuState.value === MenuStates.Open ? true : undefined,
onKeyDown: this.handleKeyDown,
onKeydown: this.handleKeyDown,
onClick: this.handleClick,
}

Expand Down Expand Up @@ -258,7 +258,7 @@ export let MenuItems = defineComponent({
: api.items.value[api.activeItemIndex.value]?.id,
'aria-labelledby': dom(api.buttonRef)?.id,
id: this.id,
onKeyDown: this.handleKeyDown,
onKeydown: this.handleKeyDown,
role: 'menu',
tabIndex: 0,
ref: 'el',
Expand Down Expand Up @@ -429,10 +429,10 @@ export let MenuItem = defineComponent({
'aria-disabled': disabled === true ? true : undefined,
onClick: handleClick,
onFocus: handleFocus,
onPointerMove: handleMove,
onMouseMove: handleMove,
onPointerLeave: handleLeave,
onMouseLeave: handleLeave,
onPointermove: handleMove,
onMousemove: handleMove,
onPointerleave: handleLeave,
onMouseleave: handleLeave,
}

return render({ props: { ...props, ...propsWeControl }, slot, attrs, slots })
Expand Down
4 changes: 2 additions & 2 deletions packages/@headlessui-vue/src/components/switch/switch.ts
Original file line number Diff line number Diff line change
Expand Up @@ -76,8 +76,8 @@ export let Switch = defineComponent({
'aria-labelledby': labelledby.value,
'aria-describedby': describedby.value,
onClick: this.handleClick,
onKeyUp: this.handleKeyUp,
onKeyPress: this.handleKeyPress,
onKeyup: this.handleKeyUp,
onKeypress: this.handleKeyPress,
}

if (this.$props.as === 'button') {
Expand Down
36 changes: 18 additions & 18 deletions packages/@headlessui-vue/src/test-utils/interactions.test.ts
Original file line number Diff line number Diff line change
Expand Up @@ -3,8 +3,8 @@ import { render } from './vue-testing-library'
import { type, shift, Keys } from './interactions'
import { defineComponent, h } from 'vue'

type Events = 'onKeyDown' | 'onKeyUp' | 'onKeyPress' | 'onClick' | 'onBlur' | 'onFocus'
let events: Events[] = ['onKeyDown', 'onKeyUp', 'onKeyPress', 'onClick', 'onBlur', 'onFocus']
type Events = 'onKeydown' | 'onKeyup' | 'onKeypress' | 'onClick' | 'onBlur' | 'onFocus'
let events: Events[] = ['onKeydown', 'onKeyup', 'onKeypress', 'onClick', 'onBlur', 'onFocus']

function renderTemplate(input: string | Partial<Parameters<typeof defineComponent>[0]>) {
let defaultComponents = {}
Expand Down Expand Up @@ -81,16 +81,16 @@ describe('Keyboard', () => {
],

// Canceling keydown
['a', ['keydown', 'keyup'], new Set<Events>(['onKeyDown'])],
[Keys.Space, ['keydown', 'keyup'], new Set<Events>(['onKeyDown'])],
[Keys.Enter, ['keydown', 'keyup'], new Set<Events>(['onKeyDown'])],
[Keys.Tab, ['keydown', 'keyup'], new Set<Events>(['onKeyDown'])],
[shift(Keys.Tab), ['keydown', 'keyup'], new Set<Events>(['onKeyDown'])],
['a', ['keydown', 'keyup'], new Set<Events>(['onKeydown'])],
[Keys.Space, ['keydown', 'keyup'], new Set<Events>(['onKeydown'])],
[Keys.Enter, ['keydown', 'keyup'], new Set<Events>(['onKeydown'])],
[Keys.Tab, ['keydown', 'keyup'], new Set<Events>(['onKeydown'])],
[shift(Keys.Tab), ['keydown', 'keyup'], new Set<Events>(['onKeydown'])],

// Canceling keypress
['a', ['keydown', 'keypress', 'keyup'], new Set<Events>(['onKeyPress'])],
[Keys.Space, ['keydown', 'keypress', 'keyup', 'click'], new Set<Events>(['onKeyPress'])],
[Keys.Enter, ['keydown', 'keypress', 'keyup'], new Set<Events>(['onKeyPress'])],
['a', ['keydown', 'keypress', 'keyup'], new Set<Events>(['onKeypress'])],
[Keys.Space, ['keydown', 'keypress', 'keyup', 'click'], new Set<Events>(['onKeypress'])],
[Keys.Enter, ['keydown', 'keypress', 'keyup'], new Set<Events>(['onKeypress'])],
[
Keys.Tab,
[
Expand All @@ -99,7 +99,7 @@ describe('Keyboard', () => {
event('focus', 'after'),
event('keyup', 'after'),
],
new Set<Events>(['onKeyPress']),
new Set<Events>(['onKeypress']),
],
[
shift(Keys.Tab),
Expand All @@ -109,13 +109,13 @@ describe('Keyboard', () => {
event('focus', 'before'),
event('keyup', 'before'),
],
new Set<Events>(['onKeyPress']),
new Set<Events>(['onKeypress']),
],

// Canceling keyup
['a', ['keydown', 'keypress', 'keyup'], new Set<Events>(['onKeyUp'])],
[Keys.Space, ['keydown', 'keypress', 'keyup'], new Set<Events>(['onKeyUp'])],
[Keys.Enter, ['keydown', 'keypress', 'click', 'keyup'], new Set<Events>(['onKeyUp'])],
['a', ['keydown', 'keypress', 'keyup'], new Set<Events>(['onKeyup'])],
[Keys.Space, ['keydown', 'keypress', 'keyup'], new Set<Events>(['onKeyup'])],
[Keys.Enter, ['keydown', 'keypress', 'click', 'keyup'], new Set<Events>(['onKeyup'])],
[
Keys.Tab,
[
Expand All @@ -124,7 +124,7 @@ describe('Keyboard', () => {
event('focus', 'after'),
event('keyup', 'after'),
],
new Set<Events>(['onKeyUp']),
new Set<Events>(['onKeyup']),
],
[
shift(Keys.Tab),
Expand All @@ -134,7 +134,7 @@ describe('Keyboard', () => {
event('focus', 'before'),
event('keyup', 'before'),
],
new Set<Events>(['onKeyUp']),
new Set<Events>(['onKeyup']),
],

// Cancelling blur
Expand Down Expand Up @@ -189,7 +189,7 @@ describe('Keyboard', () => {
Button: defineComponent({
setup(_props, { slots, attrs }) {
return () => {
return h('button', createProps(attrs.id as string), slots.default())
return h('button', createProps(attrs.id as string), slots.default!())
}
},
}),
Expand Down

0 comments on commit 70459c6

Please sign in to comment.