fix(runtime-dom/v-on): support event.stopImmediatePropagation on multiple listeners

close #916
This commit is contained in:
Evan You 2020-04-15 10:35:34 -04:00
parent 3178504273
commit d45e47569d
2 changed files with 32 additions and 2 deletions

View File

@ -134,4 +134,18 @@ describe(`runtime-dom: events patching`, () => {
expect(fn).toHaveBeenCalledTimes(1) expect(fn).toHaveBeenCalledTimes(1)
expect(fn2).toHaveBeenCalledWith(event) expect(fn2).toHaveBeenCalledWith(event)
}) })
it('should support stopImmediatePropagation on multiple listeners', async () => {
const el = document.createElement('div')
const event = new Event('click')
const fn1 = jest.fn((e: Event) => {
e.stopImmediatePropagation()
})
const fn2 = jest.fn()
patchProp(el, 'onClick', null, [fn1, fn2])
el.dispatchEvent(event)
await timeout()
expect(fn1).toHaveBeenCalledTimes(1)
expect(fn2).toHaveBeenCalledTimes(0)
})
}) })

View File

@ -1,4 +1,4 @@
import { EMPTY_OBJ } from '@vue/shared' import { EMPTY_OBJ, isArray } from '@vue/shared'
import { import {
ComponentInternalInstance, ComponentInternalInstance,
callWithAsyncErrorHandling callWithAsyncErrorHandling
@ -130,7 +130,7 @@ function createInvoker(
// AFTER it was attached. // AFTER it was attached.
if (e.timeStamp >= invoker.lastUpdated - 1) { if (e.timeStamp >= invoker.lastUpdated - 1) {
callWithAsyncErrorHandling( callWithAsyncErrorHandling(
invoker.value, patchStopImmediatePropagation(e, invoker.value),
instance, instance,
ErrorCodes.NATIVE_EVENT_HANDLER, ErrorCodes.NATIVE_EVENT_HANDLER,
[e] [e]
@ -142,3 +142,19 @@ function createInvoker(
invoker.lastUpdated = getNow() invoker.lastUpdated = getNow()
return invoker return invoker
} }
function patchStopImmediatePropagation(
e: Event,
value: EventValue
): EventValue {
if (isArray(value)) {
const originalStop = e.stopImmediatePropagation
e.stopImmediatePropagation = () => {
originalStop.call(e)
;(e as any)._stopped = true
}
return value.map(fn => (e: Event) => !(e as any)._stopped && fn(e))
} else {
return value
}
}