refactor(core): minimize code in the element-like instructions (angular#61563)

Minor changes to the element and elementContainer instructions to
move as much code as possible out of those instructions.

PR Close angular#61563

Author: pkozlowski-opensource

packages/core/src/render3/instructions/element.ts

@@ -71,7 +71,6 @@ export function ɵɵelementStart(
 ): typeof ɵɵelementStart {
   const lView = getLView();
   const tView = getTView();
-  const bindingsEnabled = getBindingsEnabled();
   ngDevMode &&
     assertEqual(
       getBindingIndex(),
@@ -80,25 +79,17 @@ export function ɵɵelementStart(
     );
   const tNode = elementLikeStartShared(
     lView,
-    tView,
     index,
     TNodeType.Element,
     name,
     _locateOrCreateElementNode,
-    bindingsEnabled,
+    getBindingsEnabled(),
     attrsIndex,
     localRefsIndex,
   );
 
   if (ngDevMode && tView.firstCreatePass) {
-    const lView = getLView();
-    validateElementIsKnown(
-      lView[tNode.index],
-      lView,
-      tNode.value,
-      tView.schemas,
-      isDirectiveHost(tNode),
-    );
+    validateElementIsKnown(lView, tNode);
   }
 
   return ɵɵelementStart;

packages/core/src/render3/instructions/element_container.ts

@@ -51,7 +51,6 @@ export function ɵɵelementContainerStart(
 ): typeof ɵɵelementContainerStart {
   const lView = getLView();
   const tView = getTView();
-  const bindingsEnabled = getBindingsEnabled();
   ngDevMode &&
     assertEqual(
       getBindingIndex(),
@@ -60,12 +59,11 @@ export function ɵɵelementContainerStart(
     );
   elementLikeStartShared(
     lView,
-    tView,
     index,
     TNodeType.ElementContainer,
     'ng-container',
     _locateOrCreateElementContainerNode,
-    bindingsEnabled,
+    getBindingsEnabled(),
     attrsIndex,
     localRefsIndex,
   );

packages/core/src/render3/instructions/element_validation.ts

@@ -12,10 +12,12 @@ import {CUSTOM_ELEMENTS_SCHEMA, NO_ERRORS_SCHEMA, SchemaMetadata} from '../../me
 import {throwError} from '../../util/assert';
 import {getComponentDef} from '../def_getters';
 import {ComponentDef} from '../interfaces/definition';
-import {TNodeType} from '../interfaces/node';
+import {TElementNode, TNode, TNodeType} from '../interfaces/node';
 import {RComment, RElement} from '../interfaces/renderer_dom';
-import {CONTEXT, DECLARATION_COMPONENT_VIEW, LView} from '../interfaces/view';
+import {isDirectiveHost} from '../interfaces/type_checks';
+import {CONTEXT, DECLARATION_COMPONENT_VIEW, LView, TVIEW} from '../interfaces/view';
 import {isAnimationProp} from '../util/attrs_utils';
+import {getNativeByTNode} from '../util/view_utils';
 
 let shouldThrowErrorOnUnknownElement = false;
 
@@ -65,27 +67,22 @@ export function ɵgetUnknownPropertyStrictMode() {
  * - the element matches any directive
  * - the element is allowed by one of the schemas
  *
- * @param element Element to validate
- * @param lView An `LView` that represents a current component that is being rendered
- * @param tagName Name of the tag to check
- * @param schemas Array of schemas
- * @param hasDirectives Boolean indicating that the element matches any directive
+ * @param lView An `LView` associated with a template is being rendered
+ * @param tNode TNode representing an element to be validated
  */
-export function validateElementIsKnown(
-  element: RElement,
-  lView: LView,
-  tagName: string | null,
-  schemas: SchemaMetadata[] | null,
-  hasDirectives: boolean,
-): void {
+export function validateElementIsKnown(lView: LView, tNode: TElementNode): void {
+  const tView = lView[TVIEW];
+
   // If `schemas` is set to `null`, that's an indication that this Component was compiled in AOT
   // mode where this check happens at compile time. In JIT mode, `schemas` is always present and
   // defined as an array (as an empty array in case `schemas` field is not defined) and we should
   // execute the check below.
-  if (schemas === null) return;
+  if (tView.schemas === null) return;
+
+  const tagName = tNode.value;
 
   // If the element matches any directive, it's considered as valid.
-  if (!hasDirectives && tagName !== null) {
+  if (!isDirectiveHost(tNode) && tagName !== null) {
     // The element is unknown if it's an instance of HTMLUnknownElement, or it isn't registered
     // as a custom element. Note that unknown elements with a dash in their name won't be instances
     // of HTMLUnknownElement in browsers that support web components.
@@ -94,12 +91,12 @@ export function validateElementIsKnown(
       // Domino doesn't expose HTMLUnknownElement globally.
       (typeof HTMLUnknownElement !== 'undefined' &&
         HTMLUnknownElement &&
-        element instanceof HTMLUnknownElement) ||
+        getNativeByTNode(tNode, lView) instanceof HTMLUnknownElement) ||
       (typeof customElements !== 'undefined' &&
         tagName.indexOf('-') > -1 &&
         !customElements.get(tagName));
 
-    if (isUnknown && !matchingSchemas(schemas, tagName)) {
+    if (isUnknown && !matchingSchemas(tView.schemas, tagName)) {
       const isHostStandalone = isHostComponentStandalone(lView);
       const templateLocation = getTemplateLocationDetails(lView);
       const schemas = `'${isHostStandalone ? '@Component' : '@NgModule'}.schemas'`;

packages/core/src/render3/instructions/shared.ts

@@ -568,7 +568,6 @@ function setInputsFromAttrs<T>(
 /** Shared code between instructions that indicate the start of an element. */
 export function elementLikeStartShared(
   lView: LView,
-  tView: TView,
   index: number,
   type: TNodeType.Element | TNodeType.ElementContainer,
   name: string,
@@ -584,9 +583,9 @@ export function elementLikeStartShared(
   localRefsIndex: number | undefined,
 ) {
   const adjustedIndex = HEADER_OFFSET + index;
-  const isElement = type === TNodeType.Element;
   ngDevMode && assertIndexInRange(lView, adjustedIndex);
 
+  const tView = lView[TVIEW];
   const tNode = tView.firstCreatePass
     ? elementLikeStartFirstCreatePass(
         adjustedIndex,
@@ -606,6 +605,7 @@ export function elementLikeStartShared(
   setCurrentTNode(tNode, true);
 
   // It's important that this runs before we've instantiated the directives.
+  const isElement = type === TNodeType.Element;
   if (isElement) {
     setupStaticAttributes(lView[RENDERER], native as RElement, tNode);