Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Remove label-click-implies-input-click as this behavior is handled by DOM libs #1208

Open
wants to merge 1 commit into
base: main
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
5 changes: 2 additions & 3 deletions src/event/behavior/click.ts
@@ -1,16 +1,15 @@
import {cloneEvent, getWindow, isElementType, isFocusable} from '../../utils'
import {getWindow, isElementType, isFocusable} from '../../utils'
import {blurElement, focusElement} from '../focus'
import {behavior} from './registry'

behavior.click = (event, target, instance) => {
behavior.click = (event, target) => {
const context = target.closest('button,input,label,select,textarea')
const control = context && isElementType(context, 'label') && context.control
if (control) {
return () => {
if (isFocusable(control)) {
focusElement(control)
}
instance.dispatchEvent(control, cloneEvent(event))
}
} else if (isElementType(target, 'input', {type: 'file'})) {
return () => {
Expand Down
15 changes: 2 additions & 13 deletions src/event/dispatchEvent.ts
Expand Up @@ -40,24 +40,13 @@ export function dispatchEvent(
)

if (behaviorImplementation) {
event.preventDefault()
let defaultPrevented = false
Object.defineProperty(event, 'defaultPrevented', {
get: () => defaultPrevented,
})
Object.defineProperty(event, 'preventDefault', {
value: () => {
defaultPrevented = event.cancelable
},
})

wrapEvent(() => target.dispatchEvent(event), target)

if (!defaultPrevented as boolean) {
if (!event.defaultPrevented) {
behaviorImplementation()
}

return !defaultPrevented
return !event.defaultPrevented
}

return wrapEvent(() => target.dispatchEvent(event), target)
Expand Down
2 changes: 1 addition & 1 deletion src/utility/upload.ts
Expand Up @@ -49,7 +49,7 @@ export async function upload(

input.addEventListener('fileDialog', fileDialog)

await this.click(element)
await this.click(input)

input.removeEventListener('fileDialog', fileDialog)
}
Expand Down
13 changes: 0 additions & 13 deletions tests/event/dispatchEvent.ts
Expand Up @@ -23,19 +23,6 @@ test('keep default behavior', () => {
expect(element).toBeChecked()
})

test('replace default behavior', () => {
const {element} = render(`<input type="checkbox"/>`)

const mockBehavior = mocks.fn(() => void 0)
mockPlugin.mockImplementationOnce(() => mockBehavior)

setupInstance().dispatchUIEvent(element, 'click')

expect(mockPlugin).toBeCalledTimes(1)
expect(element).not.toBeChecked()
expect(mockBehavior).toBeCalled()
})

test('prevent replaced default behavior', () => {
const {element} = render(`<input type="checkbox"/>`)
element.addEventListener('click', e => {
Expand Down
8 changes: 4 additions & 4 deletions tests/pointer/click.ts
Expand Up @@ -192,13 +192,13 @@ test('multi touch does not click', async () => {

describe('label', () => {
test('click associated control per label', async () => {
const {element, getEvents, user} = setup(
`<label for="in">foo</label><input id="in"/>`,
)
const onClick = mocks.fn()
const {element, user} = setup(`<label for="in">foo</label><input id="in"/>`)
element.nextSibling?.addEventListener('click', onClick)

await user.pointer({keys: '[MouseLeft]', target: element})

expect(getEvents('click')).toHaveLength(2)
expect(onClick).toHaveBeenCalledTimes(1)
})

test('click nested control per label', async () => {
Expand Down
17 changes: 8 additions & 9 deletions tests/utility/upload.ts
Expand Up @@ -58,18 +58,17 @@ test('relay click/upload on label to file input', async () => {
expect(getEventSnapshot()).toMatchInlineSnapshot(`
Events fired on: div

label[for="element"] - pointerover
input#element[value=""] - pointerover
div - pointerenter
label[for="element"] - mouseover
input#element[value=""] - mouseover
div - mouseenter
label[for="element"] - pointermove
label[for="element"] - mousemove
label[for="element"] - pointerdown
label[for="element"] - mousedown: primary
label[for="element"] - pointerup
label[for="element"] - mouseup: primary
label[for="element"] - click: primary
input#element[value=""] - pointermove
input#element[value=""] - mousemove
input#element[value=""] - pointerdown
input#element[value=""] - mousedown: primary
input#element[value=""] - focusin
input#element[value=""] - pointerup
input#element[value=""] - mouseup: primary
input#element[value=""] - click: primary
input#element[value=""] - focusout
input#element[value="C:\\\\fakepath\\\\hello.png"] - input
Expand Down