Delegate event bubbling does not match native behavior in shadow dom

[michaelw85]

I'm submitting a bug report

• Library Version: Latest version, current master (2.3.2)

Please tell us about your environment:

• Operating System: Windows 10

• Node Version: v10.15.1

• NPM Version: 6.9.0

• Webpack 4.27.0

• Browser: Chrome Version 75.0.3770.100 (Official Build) (64-bit)

• Language: all

Current behavior: When using a click delegate on a custom element with shadow dom the callback is not fired.

<custom-comp click.delegate="expectToTrigger()"></...>

Expected/desired behavior: According to this documentation and by testing in chrome click events should be able to cross the shadow dom boundary.

• What is the expected behavior? Click delegate should fire on custom element regardless of using shadow dom or not.

• What is the motivation / use case for changing the behavior? Behavior should be similar/equal to native behavior since I'm under the impression this is the vision of Aurelia. From a technical perspective I am now forced to use the less performant trigger or custom events.

Possible root cause: event-manager:70

function handleDelegatedEvent(event) {
  event.propagationStopped = false;
  let target = findOriginalEventTarget(event);

  while (target && !event.propagationStopped) {
    if (target.delegatedCallbacks) {
      let callback = target.delegatedCallbacks[event.type];
      if (callback) {
        if (event.stopPropagation !== stopPropagation) {
          event.standardStopPropagation = event.stopPropagation;
          event.stopPropagation = stopPropagation;
        }
        if ('handleEvent' in callback) {
          callback.handleEvent(event);
        } else {
          callback(event);
        }
      }
    }

    // 🔽🔽🔽 this will receive null when the shadow root is reached and will break the loop
    target = target.parentNode;
  }
}