diff --git a/src/compiler/compile/nodes/Element.ts b/src/compiler/compile/nodes/Element.ts index 6636c6b87b..79bf4e14b8 100644 --- a/src/compiler/compile/nodes/Element.ts +++ b/src/compiler/compile/nodes/Element.ts @@ -80,7 +80,8 @@ const valid_modifiers = new Set([ 'capture', 'once', 'passive', - 'self' + 'nonpassive', + 'self', ]); const passive_events = new Set([ diff --git a/src/compiler/compile/render_dom/wrappers/Element/EventHandler.ts b/src/compiler/compile/render_dom/wrappers/Element/EventHandler.ts index 157e186ea6..fe02087eb7 100644 --- a/src/compiler/compile/render_dom/wrappers/Element/EventHandler.ts +++ b/src/compiler/compile/render_dom/wrappers/Element/EventHandler.ts @@ -45,12 +45,24 @@ export default class EventHandlerWrapper { const args = []; - const opts = ['passive', 'once', 'capture'].filter(mod => this.node.modifiers.has(mod)); - if (opts.length) { - args.push((opts.length === 1 && opts[0] === 'capture') - ? TRUE - : x`{ ${opts.map(opt => p`${opt}: true`)} }`); - } else if (block.renderer.options.dev) { + const opts = ['nonpassive', 'passive', 'once', 'capture'].filter(mod => this.node.modifiers.has(mod)); + if (opts.length) { + let opts_as_string; + + if (opts[0] === 'nonpassive') { + opts.shift(); + + if (!opts.includes('passive')) { + opts.push('passive'); + } + opts_as_string = opts.map(opt => p`${opt}: ${opt === 'passive' ? false : true}`); + } + else { + opts_as_string = opts.map(opt => p`${opt}: true`); + } + args.push((opts.length === 1 && opts[0] === 'capture') ? TRUE : x`{ ${opts_as_string} }`); + } + else if (block.renderer.options.dev) { args.push(FALSE); } diff --git a/test/validator/samples/event-modifiers-invalid/errors.json b/test/validator/samples/event-modifiers-invalid/errors.json index 8be2ca7348..59a142d632 100644 --- a/test/validator/samples/event-modifiers-invalid/errors.json +++ b/test/validator/samples/event-modifiers-invalid/errors.json @@ -1,5 +1,5 @@ [{ - "message": "Valid event modifiers are preventDefault, stopPropagation, capture, once, passive or self", + "message": "Valid event modifiers are preventDefault, stopPropagation, capture, once, passive, nonpassive or self", "code": "invalid-event-modifier", "start": { "line": 1,