refactor(compiler): add an internal API to check is an element is inside a defer block (#53591)

AndrewKushnir · atscott · commit 29b959ce3174 · 2024-01-10T15:28:59.000-08:00
This commit updates the logic to expose an internal API on the `R3BoundTarget` to check if an element belongs to any defer block. PR Close #53591
diff --git a/packages/compiler/src/render3/view/t2_api.ts b/packages/compiler/src/render3/view/t2_api.ts
@@ -227,4 +227,9 @@ export interface BoundTarget<DirectiveT extends DirectiveMeta> {
    * @param trigger Trigger whose target is being looked up.
    */
   getDeferredTriggerTarget(block: DeferredBlock, trigger: DeferredTrigger): Element|null;
+
+  /**
+   * Whether a given node is located in a `@defer` block.
+   */
+  isDeferred(node: Element): boolean;
 }
diff --git a/packages/compiler/src/render3/view/t2_binder.ts b/packages/compiler/src/render3/view/t2_binder.ts
@@ -51,7 +51,7 @@ export class R3TargetBinder<DirectiveT extends DirectiveMeta> implements TargetB
         TemplateBinder.applyWithScope(target.template, scope);
     return new R3BoundTarget(
         target, directives, eagerDirectives, bindings, references, expressions, symbols,
-        nestingLevel, scopedNodeEntities, usedPipes, eagerPipes, deferBlocks);
+        nestingLevel, scopedNodeEntities, usedPipes, eagerPipes, deferBlocks, scope);
   }
 }
 
@@ -68,6 +68,11 @@ class Scope implements Visitor {
    */
   readonly namedEntities = new Map<string, Reference|Variable>();
 
+  /**
+   * Set of elements that belong to this scope.
+   */
+  readonly elementsInScope = new Set<Element>();
+
   /**
    * Child `Scope`s for immediately nested `ScopedNode`s.
    */
@@ -132,6 +137,8 @@ class Scope implements Visitor {
 
     // Recurse into the `Element`'s children.
     element.children.forEach(node => node.visit(this));
+
+    this.elementsInScope.add(element);
   }
 
   visitTemplate(template: Template) {
@@ -731,7 +738,7 @@ export class R3BoundTarget<DirectiveT extends DirectiveMeta> implements BoundTar
       private nestingLevel: Map<ScopedNode, number>,
       private scopedNodeEntities: Map<ScopedNode|null, ReadonlySet<Reference|Variable>>,
       private usedPipes: Set<string>, private eagerPipes: Set<string>,
-      private deferredBlocks: Set<DeferredBlock>) {}
+      private deferredBlocks: Set<DeferredBlock>, private rootScope: Scope) {}
 
   getEntitiesInScope(node: ScopedNode|null): ReadonlySet<Reference|Variable> {
     return this.scopedNodeEntities.get(node) ?? new Set();
@@ -785,7 +792,6 @@ export class R3BoundTarget<DirectiveT extends DirectiveMeta> implements BoundTar
     return Array.from(this.deferredBlocks);
   }
 
-
   getDeferredTriggerTarget(block: DeferredBlock, trigger: DeferredTrigger): Element|null {
     // Only triggers that refer to DOM nodes can be resolved.
     if (!(trigger instanceof InteractionDeferredTrigger) &&
@@ -849,6 +855,16 @@ export class R3BoundTarget<DirectiveT extends DirectiveMeta> implements BoundTar
     return null;
   }
 
+  isDeferred(element: Element): boolean {
+    for (const deferBlock of this.deferredBlocks) {
+      const scope = this.rootScope.childScopes.get(deferBlock);
+      if (scope && scope.elementsInScope.has(element)) {
+        return true;
+      }
+    }
+    return false;
+  }
+
   /**
    * Finds an entity with a specific name in a scope.
    * @param rootNode Root node of the scope.
