[BUGFIX stable] EmberComponent's element is an Element

packages/@ember/-internals/glimmer/lib/component-managers/curly.ts

@@ -38,7 +38,6 @@ import {
   validateTag,
   valueForTag,
 } from '@glimmer/validator';
-import type { SimpleElement } from '@simple-dom/interface';
 import type Component from '../component';
 import type { DynamicScope } from '../renderer';
 import type RuntimeResolver from '../resolver';
@@ -365,7 +364,7 @@ export default class CurlyComponentManager
 
   didCreateElement(
     { component, classRef, isInteractive, rootRef }: ComponentStateBucket,
-    element: SimpleElement,
+    element: Element,
     operations: ElementOperations
   ): void {
     setViewElement(component, element);

packages/@ember/-internals/glimmer/lib/component.ts

@@ -20,7 +20,7 @@ import { isUpdatableRef, updateRef } from '@glimmer/reference';
 import { normalizeProperty } from '@glimmer/runtime';
 import type { DirtyableTag } from '@glimmer/validator';
 import { createTag, dirtyTag } from '@glimmer/validator';
-import { Namespace } from '@simple-dom/interface';
+import { Namespace, type SimpleElement } from '@simple-dom/interface';
 import {
   ARGS,
   BOUNDS,
@@ -1001,7 +1001,7 @@ class Component<S = unknown>
 
     let element = _element;
     let isSVG = element.namespaceURI === Namespace.SVG;
-    let { type, normalized } = normalizeProperty(element, name);
+    let { type, normalized } = normalizeProperty(element as unknown as SimpleElement, name);
 
     if (isSVG || type === 'attr') {
       return element.getAttribute(normalized);

packages/@ember/-internals/glimmer/lib/renderer.ts

@@ -459,7 +459,7 @@ export class Renderer {
     this._clearAllRoots();
   }
 
-  getElement(view: View): Option<SimpleElement> {
+  getElement(view: View): Option<Element> {
     if (this._isInteractive) {
       return getViewElement(view);
     } else {

packages/@ember/-internals/views/lib/mixins/view_support.ts

@@ -19,7 +19,7 @@ function K(this: unknown) {
 */
 interface ViewMixin {
   rerender(): unknown;
-  element: SimpleElement;
+  element: Element;
   appendTo(selector: string | Element | SimpleElement): this;
   append(): this;
   elementId: string | null;

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

@@ -7,7 +7,6 @@ import ActionManager from './action_manager';
 import type { BootEnvironment } from '@ember/-internals/glimmer/lib/views/outlet';
 import type Component from '@ember/component';
 import type { ActionState } from '@ember/-internals/glimmer/lib/modifiers/action';
-import type { SimpleElement } from '@simple-dom/interface';
 
 /**
 @module ember
@@ -255,9 +254,7 @@ export default class EventDispatcher extends EmberObject {
     }
 
     let viewHandler = (target: Element, event: Event) => {
-      // SAFETY: SimpleElement is supposed to be a subset of Element so this _should_ be safe.
-      // However, the types are more specific in some places which necessitates the `as`.
-      let view = getElementView(target as unknown as SimpleElement);
+      let view = getElementView(target);
       let result = true;
 
       if (view) {
@@ -325,9 +322,7 @@ export default class EventDispatcher extends EmberObject {
       );
 
       do {
-        // SAFETY: SimpleElement is supposed to be a subset of Element so this _should_ be safe.
-        // However, the types are more specific in some places which necessitates the `as`.
-        if (getElementView(target as unknown as SimpleElement)) {
+        if (getElementView(target)) {
           if (viewHandler(target, event) === false) {
             event.preventDefault();
             event.stopPropagation();

packages/@ember/-internals/views/lib/system/utils.ts

@@ -4,7 +4,6 @@ import { getOwner } from '@ember/-internals/owner';
 import { guidFor } from '@ember/-internals/utils';
 import { assert } from '@ember/debug';
 import type { Dict, Option } from '@glimmer/interfaces';
-import type { SimpleElement } from '@simple-dom/interface';
 
 /**
 @module ember
@@ -68,10 +67,10 @@ export function getViewId(view: View): string {
   }
 }
 
-const ELEMENT_VIEW: WeakMap<SimpleElement, View> = new WeakMap();
-const VIEW_ELEMENT: WeakMap<View, SimpleElement> = new WeakMap();
+const ELEMENT_VIEW: WeakMap<Element, View> = new WeakMap();
+const VIEW_ELEMENT: WeakMap<View, Element> = new WeakMap();
 
-export function getElementView(element: SimpleElement): Option<View> {
+export function getElementView(element: Element): Option<View> {
   return ELEMENT_VIEW.get(element) || null;
 }
 
@@ -80,15 +79,15 @@ export function getElementView(element: SimpleElement): Option<View> {
   @method getViewElement
   @param {Ember.View} view
  */
-export function getViewElement(view: View): Option<SimpleElement> {
+export function getViewElement(view: View): Option<Element> {
   return VIEW_ELEMENT.get(view) || null;
 }
 
-export function setElementView(element: SimpleElement, view: View): void {
+export function setElementView(element: Element, view: View): void {
   ELEMENT_VIEW.set(element, view);
 }
 
-export function setViewElement(view: View, element: SimpleElement): void {
+export function setViewElement(view: View, element: Element): void {
   VIEW_ELEMENT.set(view, element);
 }
 
@@ -97,7 +96,7 @@ export function setViewElement(view: View, element: SimpleElement): void {
 // this case, we want to prevent access to the element (and vice verse) during
 // destruction.
 
-export function clearElementView(element: SimpleElement): void {
+export function clearElementView(element: Element): void {
   ELEMENT_VIEW.delete(element);
 }
 

type-tests/@ember/component-test/component.ts

@@ -151,3 +151,10 @@ class SigExample extends Component<MySig> {
     return `${name} is ${age} years old`;
   }
 }
+
+// There is no type safety mapping `Element` here
+class ElementOnComponent extends Component<{ Element: HTMLDivElement }> {
+  get hmm(): boolean {
+    return this.element.dispatchEvent(new Event('mousedown'));
+  }
+}