Fix: Actions with options may run out of order

src/core/action_descriptor.ts

@@ -29,6 +29,8 @@ export const defaultActionDescriptorFilters: ActionDescriptorFilters = {
   },
 }
 
+export const nativeActionDescriptors: string[] = ["capture", "once", "passive", "!passive"]
+
 export interface ActionDescriptor {
   eventTarget: EventTarget
   eventOptions: AddEventListenerOptions

src/core/dispatcher.ts

@@ -2,6 +2,7 @@ import { Application } from "./application"
 import { Binding } from "./binding"
 import { BindingObserverDelegate } from "./binding_observer"
 import { EventListener } from "./event_listener"
+import { nativeActionDescriptors } from "./action_descriptor"
 
 export class Dispatcher implements BindingObserverDelegate {
   readonly application: Application
@@ -112,8 +113,9 @@ export class Dispatcher implements BindingObserverDelegate {
 
   private cacheKey(eventName: string, eventOptions: any): string {
     const parts = [eventName]
-    Object.keys(eventOptions)
-      .sort()
+
+    nativeActionDescriptors
+      .filter((key) => key in eventOptions)
       .forEach((key) => {
         parts.push(`${eventOptions[key] ? "" : "!"}${key}`)
       })

src/tests/modules/core/action_ordering_tests.ts

@@ -34,6 +34,18 @@ export default class ActionOrderingTests extends LogControllerTestCase {
     )
   }
 
+  async "test adding an action to the left with a :stop modifier"() {
+    this.actionValue = "c#log3:stop c#log d#log2"
+    await this.nextFrame
+    await this.triggerEvent(this.buttonElement, "click")
+
+    this.assertActions(
+      { name: "log3", identifier: "c", eventType: "click", currentTarget: this.buttonElement },
+      { name: "log", identifier: "c", eventType: "click", currentTarget: this.buttonElement },
+      { name: "log2", identifier: "d", eventType: "click", currentTarget: this.buttonElement }
+    )
+  }
+
   async "test removing an action from the right"() {
     this.actionValue = "c#log d#log2"
     await this.nextFrame