[Bug] Could not initialize ember app in shadow root node

[lifeart]

🐞 Describe the Bug

If I trying to initialize ember app on shadow dom root, and it's not working.

class MyApp extends HTMLElement {
  constructor() {
    super();
    this.shadow = this.attachShadow({ mode: 'open' });
  }
  connectedCallback() {
    createEmberApp(this.shadow);
  }
}

customElements.define('my-app', MyApp);

😕 Actual Behavior

vendor.js:32566 Uncaught TypeError: Cannot read property 'contains' of undefined
    at Class.setup (vendor.js:32566)
    at Class.setupEventDispatcher (vendor.js:34140)
    at Class._bootSync (vendor.js:34064)
    at App.didBecomeReady (vendor.js:35128)
    at invoke (vendor.js:59932)
    at Queue.flush (vendor.js:59823)
    at DeferredActionQueues.flush (vendor.js:60020)
    at Backburner._end (vendor.js:60554)
    at Backburner.end (vendor.js:60304)
    at Backburner._run (vendor.js:60609)

Because shadowRoot does not have class list

If I'm patching it, like:

class MyApp extends HTMLElement {
  constructor() {
    super();
    this.shadow = this.attachShadow({ mode: 'open' });
    this.shadow.classList = {
      contains: () => { return false }
    };
  }
  connectedCallback() {
    createEmberApp(this.shadow);
  }
}

customElements.define('my-app', MyApp);

I'm getting next error:

vendor.js:32571 Uncaught TypeError: Cannot read property 'classList' of null
    at vendor.js:32571
    at Class.setup (vendor.js:32579)
    at Class.setupEventDispatcher (vendor.js:34140)
    at Class._bootSync (vendor.js:34064)
    at App.didBecomeReady (vendor.js:35128)
    at invoke (vendor.js:59932)
    at Queue.flush (vendor.js:59823)
    at DeferredActionQueues.flush (vendor.js:60020)
    at Backburner._end (vendor.js:60554)
    at Backburner.end (vendor.js:60304)

from:

If I'm appending DIV into shadow root and use it as rootNode for ember APP:

class MyApp extends HTMLElement {
  constructor() {
    super();
    this.shadow = this.attachShadow({ mode: 'open' });
    this.shadow.classList = {
      contains: () => { return false }
    };
  }
  connectedCallback() {
    const node = document.createElement('div');
    this.shadow.appendChild(node);
    createEmberApp(node);
  }
}

code works fine, but once I remove "shadow patch", it still failing:

with:

To get it working, I have to append one more div into shadow root, like:

class MyApp extends HTMLElement {
  constructor() {
    super();
    this.shadow = this.attachShadow({ mode: 'open' });
  }
  connectedCallback() {
    const node = document.createElement('div');
    const appDiv = document.createElement('div');
    node.appendChild(appDiv);
    this.shadow.appendChild(node);
    createEmberApp(appDiv);
  }
}

🤔 Expected Behavior

Ember app creation should work just fine for shadow dom ROOT node.

🌍 Environment

• Ember: 3.28

➕ Additional Context

Code:

ember.js/packages/@ember/-internals/views/lib/system/event_dispatcher.js

Line 161 in a3a299c

'You cannot make a new Ember.Application using a root element that is a descendent of an existing Ember.Application',

Could we check app's rootNode for nodeType = 11 or nodeName = "#document-fragment to skip this chain of checks?