title: How to check if a listener event is a passive event?
body: <p>I'm writing a gesture/action library that also manages event listeners and triggering. I have implemented my lib to support gesture objects setting passive listeners via an API that looks like this: <code>this.on('touchstart.passive', this.startHandler, { reject: errorHandler })</code>. My lib supports multiple gestures, setting multiple listeners, both passive and non-passive. The lib will make sure at most only one <em>real</em> listener will be attached to the DOM. So we can at most have 2 <code>touchstart</code> listeners, where one is passive and the other is not.</p>
  
  <p>My question and issue, is that I can not detect if a received event was attached with the <code>{ passive: true }</code> option. I thought that I could use the <code>cancelable</code> property on the native event object, since it is an error to call <code>preventDefault()</code> on a passive event. But the <code>cancelable</code> property is always true, even if the browser will throw an error on <code>preventDefault()</code>.</p>
  
  <p>I have read the <a href="https://dom.spec.whatwg.org/#observing-event-listeners" rel="nofollow noreferrer">WhatWG DOM standard on event listeners</a> and made some tests in Firefox and Chrome but can't find any information about how to distinguish the two types of events.</p>
  
  <p>It is significant for my library, since a passive event listener is keyed with a <code>".passive"</code> post-fix, e.g. <code>"touchstart.passive"</code> vs <code>"touchstart"</code>.</p>
  
  <p>How to I check the received DOM event for passive option, so I can trigger the right internal listeners?</p>
  
  <p>EDIT</p>
  
  <p>Currently the gist of my flow for attaching listeners is:</p>
  
  <pre><code>function eventNotifier(event) {
      this.fire(event.cancelable ? event.type : event.type + '.passive', new GestureEvent(event))
  }
  
  addEvent(el, realEventName, eventNotifier, options)
  nativeListeners.set(eventName, 1)
  
  function addEvent (el, type, listener, options) {
      el.addEventListener(type, listener, options || true)
  }
  </code></pre>
  
  <p><em>where <code>nativeListeners</code> is a <code>Map</code> that keep track of real event listeners</em></p>