feat(ivy): compiler support to generate QUERY_READ_FROM_NODE calls (#26171)

PR Close #26171

packages/compiler-cli/test/compliance/r3_compiler_compliance_spec.ts

@@ -1139,7 +1139,7 @@ describe('compiler compliance', () => {
         `
       };
 
-      it('should support view queries', () => {
+      it('should support view queries with directives', () => {
         const files = {
           app: {
             ...directive,
@@ -1159,7 +1159,7 @@ describe('compiler compliance', () => {
 
             @NgModule({declarations: [SomeDirective, ViewQueryComponent]})
             export class MyModule {}
-          `
+            `
           }
         };
 
@@ -1196,11 +1196,111 @@ describe('compiler compliance', () => {
         expectEmit(source, ViewQueryComponentDefinition, 'Invalid ViewQuery declaration');
       });
 
-      it('should support content queries', () => {
+      it('should support view queries with local refs', () => {
+        const files = {
+          app: {
+            'view_query.component.ts': `
+            import {Component, NgModule, ViewChild, ViewChildren, QueryList} from '@angular/core';
+
+            @Component({
+              selector: 'view-query-component',
+              template: \`
+              <div #myRef></div>
+              <div #myRef1></div>
+              \`
+            })
+            export class ViewQueryComponent {
+              @ViewChild('myRef') myRef: any;
+              @ViewChildren('myRef1, myRef2, myRef3') myRefs: QueryList<any>;
+            }
+
+            @NgModule({declarations: [ViewQueryComponent]})
+            export class MyModule {}
+            `
+          }
+        };
+
+        const ViewQueryComponentDefinition = `
+          const $e0_attrs$ = ["myRef", ""];
+          const $e1_attrs$ = ["myRef1", ""];
+          …
+          ViewQueryComponent.ngComponentDef = $r3$.ɵdefineComponent({
+            …
+            viewQuery: function ViewQueryComponent_Query(rf, ctx) {
+              if (rf & 1) {
+                $r3$.ɵquery(0, ["myRef"], true);
+                $r3$.ɵquery(1, ["myRef1", "myRef2", "myRef3"], true);
+              }
+              if (rf & 2) {
+                var $tmp$;
+                ($r3$.ɵqueryRefresh(($tmp$ = $r3$.ɵload(0))) && (ctx.myRef = $tmp$.first));
+                ($r3$.ɵqueryRefresh(($tmp$ = $r3$.ɵload(1))) && (ctx.myRefs = $tmp$));
+              }
+            },
+            …
+          });`;
+
+        const result = compile(files, angularFiles);
+        const source = result.source;
+
+        expectEmit(source, ViewQueryComponentDefinition, 'Invalid ViewQuery declaration');
+      });
+
+      it('should support view queries with read tokens specified', () => {
+        const files = {
+          app: {
+            'view_query.component.ts': `
+            import {Component, NgModule, ViewChild, ViewChildren, QueryList, ElementRef} from '@angular/core';
+
+            @Component({
+              selector: 'view-query-component',
+              template: \`
+              <div #myRef></div>
+              <div #myRef1></div>
+              \`
+            })
+            export class ViewQueryComponent {
+              @ViewChild('myRef', {read: ElementRef}) myRef: any;
+              @ViewChildren('myRef1, myRef2, myRef3', {read: ElementRef}) myRefs: QueryList<any>;
+            }
+
+            @NgModule({declarations: [ViewQueryComponent]})
+            export class MyModule {}
+            `
+          }
+        };
+
+        const ViewQueryComponentDefinition = `
+          const $e0_attrs$ = ["myRef", ""];
+          const $e1_attrs$ = ["myRef1", ""];
+          …
+          ViewQueryComponent.ngComponentDef = $r3$.ɵdefineComponent({
+            …
+            viewQuery: function ViewQueryComponent_Query(rf, ctx) {
+              if (rf & 1) {
+                $r3$.ɵquery(0, ["myRef"], true, ElementRef);
+                $r3$.ɵquery(1, ["myRef1", "myRef2", "myRef3"], true, ElementRef);
+              }
+              if (rf & 2) {
+                var $tmp$;
+                ($r3$.ɵqueryRefresh(($tmp$ = $r3$.ɵload(0))) && (ctx.myRef = $tmp$.first));
+                ($r3$.ɵqueryRefresh(($tmp$ = $r3$.ɵload(1))) && (ctx.myRefs = $tmp$));
+              }
+            },
+            …
+          });`;
+
+        const result = compile(files, angularFiles);
+        const source = result.source;
+
+        expectEmit(source, ViewQueryComponentDefinition, 'Invalid ViewQuery declaration');
+      });
+
+      it('should support content queries with directives', () => {
         const files = {
           app: {
             ...directive,
-            'spec.ts': `
+            'content_query.ts': `
             import {Component, ContentChild, ContentChildren, NgModule, QueryList} from '@angular/core';
             import {SomeDirective} from './some.directive';
 
@@ -1262,12 +1362,110 @@ describe('compiler compliance', () => {
           });`;
 
         const result = compile(files, angularFiles);
-
         const source = result.source;
+
         expectEmit(source, ContentQueryComponentDefinition, 'Invalid ContentQuery declaration');
       });
     });
 
+    it('should support content queries with local refs', () => {
+      const files = {
+        app: {
+          'content_query.component.ts': `
+          import {Component, ContentChild, ContentChildren, NgModule, QueryList} from '@angular/core';
+
+          @Component({
+            selector: 'content-query-component',
+            template: \`
+            <div #myRef></div>
+            <div #myRef1></div>
+            \`
+          })
+          export class ContentQueryComponent {
+            @ContentChild('myRef') myRef: any;
+            @ContentChildren('myRef1, myRef2, myRef3') myRefs: QueryList<any>;
+          }
+
+          @NgModule({declarations: [ContentQueryComponent]})
+          export class MyModule {}
+        `
+        }
+      };
+
+      const ContentQueryComponentDefinition = `
+        const $e0_attrs$ = ["myRef", ""];
+        const $e1_attrs$ = ["myRef1", ""];
+        …
+        ContentQueryComponent.ngComponentDef = $r3$.ɵdefineComponent({
+          …
+          contentQueries: function ContentQueryComponent_ContentQueries() {
+            $r3$.ɵregisterContentQuery($r3$.ɵquery(null, ["myRef"], true));
+            $r3$.ɵregisterContentQuery($r3$.ɵquery(null, ["myRef1", "myRef2", "myRef3"], false));
+          },
+          contentQueriesRefresh: function ContentQueryComponent_ContentQueriesRefresh(dirIndex, queryStartIndex) {
+            const instance = $r3$.ɵloadDirective(dirIndex);
+            var $tmp$;
+            ($r3$.ɵqueryRefresh(($tmp$ = $r3$.ɵloadQueryList(queryStartIndex))) && (instance.myRef = $tmp$.first));
+            ($r3$.ɵqueryRefresh(($tmp$ = $r3$.ɵloadQueryList((queryStartIndex + 1)))) && (instance.myRefs = $tmp$));
+          },
+          …
+        });`;
+
+      const result = compile(files, angularFiles);
+      const source = result.source;
+
+      expectEmit(source, ContentQueryComponentDefinition, 'Invalid ContentQuery declaration');
+    });
+
+    it('should support content queries with read tokens specified', () => {
+      const files = {
+        app: {
+          'content_query.component.ts': `
+          import {Component, ContentChild, ContentChildren, NgModule, QueryList, ElementRef} from '@angular/core';
+
+          @Component({
+            selector: 'content-query-component',
+            template: \`
+            <div #myRef></div>
+            <div #myRef1></div>
+            \`
+          })
+          export class ContentQueryComponent {
+            @ContentChild('myRef', {read: ElementRef}) myRef: any;
+            @ContentChildren('myRef1, myRef2, myRef3', {read: ElementRef}) myRefs: QueryList<any>;
+          }
+
+          @NgModule({declarations: [ContentQueryComponent]})
+          export class MyModule {}
+        `
+        }
+      };
+
+      const ContentQueryComponentDefinition = `
+        const $e0_attrs$ = ["myRef", ""];
+        const $e1_attrs$ = ["myRef1", ""];
+        …
+        ContentQueryComponent.ngComponentDef = $r3$.ɵdefineComponent({
+          …
+          contentQueries: function ContentQueryComponent_ContentQueries() {
+            $r3$.ɵregisterContentQuery($r3$.ɵquery(null, ["myRef"], true, ElementRef));
+            $r3$.ɵregisterContentQuery($r3$.ɵquery(null, ["myRef1", "myRef2", "myRef3"], false, ElementRef));
+          },
+          contentQueriesRefresh: function ContentQueryComponent_ContentQueriesRefresh(dirIndex, queryStartIndex) {
+            const instance = $r3$.ɵloadDirective(dirIndex);
+            var $tmp$;
+            ($r3$.ɵqueryRefresh(($tmp$ = $r3$.ɵloadQueryList(queryStartIndex))) && (instance.myRef = $tmp$.first));
+            ($r3$.ɵqueryRefresh(($tmp$ = $r3$.ɵloadQueryList((queryStartIndex + 1)))) && (instance.myRefs = $tmp$));
+          },
+          …
+        });`;
+
+      const result = compile(files, angularFiles);
+      const source = result.source;
+
+      expectEmit(source, ContentQueryComponentDefinition, 'Invalid ContentQuery declaration');
+    });
+
     describe('pipes', () => {
 
       const files = {

packages/compiler/src/render3/view/util.ts

@@ -104,8 +104,15 @@ export function trimTrailingNulls(parameters: o.Expression[]): o.Expression[] {
 export function getQueryPredicate(
     query: R3QueryMetadata, constantPool: ConstantPool): o.Expression {
   if (Array.isArray(query.predicate)) {
-    return constantPool.getConstLiteral(
+    let predicate: o.Expression[] = [];
-        o.literalArr(query.predicate.map(selector => o.literal(selector) as o.Expression)));
+    query.predicate.forEach((selector: string): void => {
+      // Each item in predicates array may contain strings with comma-separated refs
+      // (for ex. 'ref, ref1, ..., refN'), thus we extract individual refs and store them
+      // as separate array entities
+      const selectors = selector.split(',').map(token => o.literal(token.trim()));
+      predicate.push(...selectors);
+    });
+    return constantPool.getConstLiteral(o.literalArr(predicate));
   } else {
     return query.predicate;
   }

packages/core/src/core_render3_private_export.ts

@@ -118,7 +118,7 @@ export {
   i18nMapping as ɵi18nMapping,
   I18nInstruction as ɵI18nInstruction,
   I18nExpInstruction as ɵI18nExpInstruction,
-  WRAP_RENDERER_FACTORY2 as ɵWRAP_RENDERER_FACTORY2,
+  WRAP_RENDERER_FACTORY2 as ɵWRAP_RENDERER_FACTORY2
 } from './render3/index';
 
 export {  Render3DebugRendererFactory2 as ɵRender3DebugRendererFactory2 } from './render3/debug';

packages/core/src/render3/index.ts

@@ -141,7 +141,7 @@ export {
   pureFunctionV,
 } from './pure_function';
 
-export {templateRefExtractor, QUERY_READ_ELEMENT_REF, QUERY_READ_CONTAINER_REF, QUERY_READ_FROM_NODE, QUERY_READ_TEMPLATE_REF} from './view_engine_compatibility_prebound';
+export {templateRefExtractor} from './view_engine_compatibility_prebound';
 
 
 // clang-format on

packages/core/src/render3/query.ts

@@ -19,15 +19,15 @@ import {Type} from '../type';
 import {getSymbolIterator} from '../util';
 
 import {assertDefined, assertEqual} from './assert';
+import {NG_ELEMENT_ID} from './fields';
 import {_getViewData, assertPreviousIsParent, getOrCreateCurrentQueries, store, storeCleanupWithContext} from './instructions';
 import {DirectiveDefInternal, unusedValueExportToPlacateAjd as unused1} from './interfaces/definition';
-import {LInjector, unusedValueExportToPlacateAjd as unused2} from './interfaces/injector';
+import {unusedValueExportToPlacateAjd as unused2} from './interfaces/injector';
-import {LContainerNode, LElementNode, TContainerNode, TElementContainerNode, TElementNode, TNode, TNodeFlags, TNodeType, unusedValueExportToPlacateAjd as unused3} from './interfaces/node';
+import {TContainerNode, TElementContainerNode, TElementNode, TNode, TNodeFlags, TNodeType, unusedValueExportToPlacateAjd as unused3} from './interfaces/node';
 import {LQueries, QueryReadType, unusedValueExportToPlacateAjd as unused4} from './interfaces/query';
 import {DIRECTIVES, LViewData, TVIEW} from './interfaces/view';
-import {assertNodeOfPossibleTypes} from './node_assert';
+import {flatten, isContentQueryHost} from './util';
-import {flatten, getLNode, isContentQueryHost} from './util';
+import {createElementRef, createTemplateRef} from './view_engine_compatibility';
-import {createContainerRef, createElementRef, createTemplateRef} from './view_engine_compatibility';
 
 const unusedValueToPlacateAjd = unused1 + unused2 + unused3 + unused4;
 
@@ -268,11 +268,11 @@ function getIdxOfMatchingDirective(tNode: TNode, currentView: LViewData, type: T
   return null;
 }
 
-function readFromNodeInjector(
+// TODO: "read" should be an AbstractType (FW-486)
-    tNode: TNode, currentView: LViewData, read: QueryReadType<any>| Type<any>,
+function queryRead(tNode: TNode, currentView: LViewData, read: any): any {
-    directiveIdx: number): any {
+  const factoryFn = (read as any)[NG_ELEMENT_ID];
-  if (read instanceof ReadFromInjectorFn) {
+  if (typeof factoryFn === 'function') {
-    return read.read(tNode, currentView, directiveIdx);
+    return factoryFn();
   } else {
     const matchingIdx = getIdxOfMatchingDirective(tNode, currentView, read as Type<any>);
     if (matchingIdx !== null) {
@@ -282,6 +282,16 @@ function readFromNodeInjector(
   return null;
 }
 
+function queryReadByTNodeType(tNode: TNode, currentView: LViewData): any {
+  if (tNode.type === TNodeType.Element || tNode.type === TNodeType.ElementContainer) {
+    return createElementRef(ViewEngine_ElementRef, tNode, currentView);
+  }
+  if (tNode.type === TNodeType.Container) {
+    return createTemplateRef(ViewEngine_TemplateRef, ViewEngine_ElementRef, tNode, currentView);
+  }
+  return null;
+}
+
 function add(
     query: LQuery<any>| null, tNode: TElementNode | TContainerNode | TElementContainerNode) {
   const currentView = _getViewData();
@@ -290,25 +300,29 @@ function add(
     const predicate = query.predicate;
     const type = predicate.type;
     if (type) {
-      const directiveIdx = getIdxOfMatchingDirective(tNode, currentView, type);
+      // if read token and / or strategy is not specified, use type as read token
-      if (directiveIdx !== null) {
+      const result = queryRead(tNode, currentView, predicate.read || type);
-        // a node is matching a predicate - determine what to read
+      if (result !== null) {
-        // if read token and / or strategy is not specified, use type as read token
+        addMatch(query, result);
-        const result =
-            readFromNodeInjector(tNode, currentView, predicate.read || type, directiveIdx);
-        if (result !== null) {
-          addMatch(query, result);
-        }
       }
     } else {
       const selector = predicate.selector !;
       for (let i = 0; i < selector.length; i++) {
         const directiveIdx = getIdxOfMatchingSelector(tNode, selector[i]);
         if (directiveIdx !== null) {
-          // a node is matching a predicate - determine what to read
+          let result: any = null;
-          // note that queries using name selector must specify read strategy
+          if (predicate.read) {
-          ngDevMode && assertDefined(predicate.read, 'the node should have a predicate');
+            result = queryRead(tNode, currentView, predicate.read);
-          const result = readFromNodeInjector(tNode, currentView, predicate.read !, directiveIdx);
+          } else {
+            if (directiveIdx > -1) {
+              result = currentView[DIRECTIVES] ![directiveIdx];
+            } else {
+              // if read token and / or strategy is not specified,
+              // detect it using appropriate tNode type
+              result = queryReadByTNodeType(tNode, currentView);
+            }
+          }
+
           if (result !== null) {
             addMatch(query, result);
           }
@@ -445,7 +459,8 @@ export const QueryList: typeof viewEngine_QueryList = QueryList_ as any;
  */
 export function query<T>(
     memoryIndex: number | null, predicate: Type<any>| string[], descend?: boolean,
-    read?: QueryReadType<T>| Type<T>): QueryList<T> {
+    // TODO: "read" should be an AbstractType (FW-486)
+    read?: any): QueryList<T> {
   ngDevMode && assertPreviousIsParent();
   const queryList = new QueryList<T>();
   const queries = getOrCreateCurrentQueries(LQueries_);
@@ -471,7 +486,3 @@ export function queryRefresh(queryList: QueryList<any>): boolean {
   }
   return false;
 }
-
-export class ReadFromInjectorFn<T> {
-  constructor(readonly read: (tNode: TNode, view: LViewData, directiveIndex?: number) => T) {}
-}

packages/core/src/render3/view_engine_compatibility_prebound.ts

@@ -9,14 +9,10 @@
 
 import {ElementRef as ViewEngine_ElementRef} from '../linker/element_ref';
 import {TemplateRef as ViewEngine_TemplateRef} from '../linker/template_ref';
-import {ViewContainerRef as ViewEngine_ViewContainerRef} from '../linker/view_container_ref';
 
-import {TContainerNode, TElementContainerNode, TElementNode, TNode, TNodeType} from './interfaces/node';
+import {TNode} from './interfaces/node';
-import {QueryReadType} from './interfaces/query';
+import {LViewData} from './interfaces/view';
-import {DIRECTIVES, LViewData} from './interfaces/view';
+import {createTemplateRef} from './view_engine_compatibility';
-import {assertNodeOfPossibleTypes} from './node_assert';
-import {ReadFromInjectorFn} from './query';
-import {createContainerRef, createElementRef, createTemplateRef} from './view_engine_compatibility';
 
 
 
@@ -27,38 +23,3 @@ import {createContainerRef, createElementRef, createTemplateRef} from './view_en
 export function templateRefExtractor(tNode: TNode, currentView: LViewData) {
   return createTemplateRef(ViewEngine_TemplateRef, ViewEngine_ElementRef, tNode, currentView);
 }
-
-export const QUERY_READ_ELEMENT_REF = <QueryReadType<ViewEngine_ElementRef>>(
-    new ReadFromInjectorFn<ViewEngine_ElementRef>((tNode: TNode, view: LViewData) => {
-      return createElementRef(ViewEngine_ElementRef, tNode, view);
-    }) as any);
-
-export const QUERY_READ_TEMPLATE_REF =
-    new ReadFromInjectorFn<ViewEngine_TemplateRef<any>>((tNode: TNode, view: LViewData) => {
-      return createTemplateRef(ViewEngine_TemplateRef, ViewEngine_ElementRef, tNode, view);
-    }) as any;
-
-export const QUERY_READ_CONTAINER_REF = <QueryReadType<ViewEngine_ViewContainerRef>>(
-    new ReadFromInjectorFn<ViewEngine_ViewContainerRef>(
-        (tNode: TNode, view: LViewData) => createContainerRef(
-            ViewEngine_ViewContainerRef, ViewEngine_ElementRef,
-            tNode as TElementNode | TContainerNode | TElementContainerNode, view)) as any);
-
-export const QUERY_READ_FROM_NODE =
-    new ReadFromInjectorFn<any>((tNode: TNode, view: LViewData, directiveIdx: number) => {
-      ngDevMode && assertNodeOfPossibleTypes(
-                       tNode, TNodeType.Container, TNodeType.Element, TNodeType.ElementContainer);
-      if (directiveIdx > -1) {
-        return view[DIRECTIVES] ![directiveIdx];
-      }
-      if (tNode.type === TNodeType.Element || tNode.type === TNodeType.ElementContainer) {
-        return createElementRef(ViewEngine_ElementRef, tNode, view);
-      }
-      if (tNode.type === TNodeType.Container) {
-        return createTemplateRef(ViewEngine_TemplateRef, ViewEngine_ElementRef, tNode, view);
-      }
-      if (ngDevMode) {
-        // should never happen
-        throw new Error(`Unexpected node type: ${tNode.type}`);
-      }
-    }) as any as QueryReadType<any>;

packages/core/test/render3/query_spec.ts

@@ -17,7 +17,7 @@ import {AttributeMarker, QueryList, defineComponent, defineDirective, detectChan
 import {bind, container, containerRefreshEnd, containerRefreshStart, element, elementContainerEnd, elementContainerStart, elementEnd, elementProperty, elementStart, embeddedViewEnd, embeddedViewStart, load, loadDirective, loadElement, loadQueryList, reference, registerContentQuery, template} from '../../src/render3/instructions';
 import {RenderFlags} from '../../src/render3/interfaces/definition';
 import {query, queryRefresh} from '../../src/render3/query';
-import {templateRefExtractor, QUERY_READ_ELEMENT_REF, QUERY_READ_CONTAINER_REF, QUERY_READ_FROM_NODE, QUERY_READ_TEMPLATE_REF} from '../../src/render3/view_engine_compatibility_prebound';
+import {templateRefExtractor} from '../../src/render3/view_engine_compatibility_prebound';
 
 import {NgForOf, NgIf, NgTemplateOutlet} from './common_with_def';
 import {ComponentFixture, TemplateFixture, createComponent, createDirective, renderComponent} from './render_util';
@@ -121,7 +121,7 @@ describe('query', () => {
             2, 0, [Child], [],
             function(rf: RenderFlags, ctx: any) {
               if (rf & RenderFlags.Create) {
-                query(0, Child, false, QUERY_READ_ELEMENT_REF);
+                query(0, Child, false, ElementRef);
               }
               if (rf & RenderFlags.Update) {
                 let tmp: any;
@@ -229,7 +229,7 @@ describe('query', () => {
             4, 0, [], [],
             function(rf: RenderFlags, ctx: any) {
               if (rf & RenderFlags.Create) {
-                query(0, ['foo'], false, QUERY_READ_FROM_NODE);
+                query(0, ['foo'], false);
               }
               if (rf & RenderFlags.Update) {
                 let tmp: any;
@@ -266,8 +266,8 @@ describe('query', () => {
             6, 0, [], [],
             function(rf: RenderFlags, ctx: any) {
               if (rf & RenderFlags.Create) {
-                query(0, ['foo'], false, QUERY_READ_FROM_NODE);
+                query(0, ['foo'], false);
-                query(1, ['bar'], false, QUERY_READ_FROM_NODE);
+                query(1, ['bar'], false);
               }
               if (rf & RenderFlags.Update) {
                 let tmp: any;
@@ -315,7 +315,7 @@ describe('query', () => {
             6, 0, [], [],
             function(rf: RenderFlags, ctx: any) {
               if (rf & RenderFlags.Create) {
-                query(0, ['foo', 'bar'], undefined, QUERY_READ_FROM_NODE);
+                query(0, ['foo', 'bar'], undefined);
               }
               if (rf & RenderFlags.Update) {
                 let tmp: any;
@@ -352,7 +352,7 @@ describe('query', () => {
             4, 0, [], [],
             function(rf: RenderFlags, ctx: any) {
               if (rf & RenderFlags.Create) {
-                query(0, ['foo'], false, QUERY_READ_ELEMENT_REF);
+                query(0, ['foo'], false);
               }
               if (rf & RenderFlags.Update) {
                 let tmp: any;
@@ -388,7 +388,7 @@ describe('query', () => {
                3, 0, [], [],
                function(rf: RenderFlags, ctx: any) {
                  if (rf & RenderFlags.Create) {
-                   query(0, ['foo'], false, QUERY_READ_ELEMENT_REF);
+                   query(0, ['foo'], false, ElementRef);
                  }
                  if (rf & RenderFlags.Update) {
                    let tmp: any;
@@ -424,7 +424,7 @@ describe('query', () => {
             3, 0, [], [],
             function(rf: RenderFlags, ctx: any) {
               if (rf & RenderFlags.Create) {
-                query(0, ['foo'], true, QUERY_READ_FROM_NODE);
+                query(0, ['foo'], true);
               }
               if (rf & RenderFlags.Update) {
                 let tmp: any;
@@ -488,8 +488,8 @@ describe('query', () => {
             5, 0, [], [],
             function(rf: RenderFlags, ctx: any) {
               if (rf & RenderFlags.Create) {
-                query(0, ['foo'], true, QUERY_READ_ELEMENT_REF);
+                query(0, ['foo'], true, ElementRef);
-                query(1, ['foo'], false, QUERY_READ_ELEMENT_REF);
+                query(1, ['foo'], false, ElementRef);
               }
               if (rf & RenderFlags.Update) {
                 let tmp: any;
@@ -523,7 +523,7 @@ describe('query', () => {
             3, 0, [], [],
             function(rf: RenderFlags, ctx: any) {
               if (rf & RenderFlags.Create) {
-                query(0, ['foo'], false, QUERY_READ_CONTAINER_REF);
+                query(0, ['foo'], false, ViewContainerRef);
               }
               if (rf & RenderFlags.Update) {
                 let tmp: any;
@@ -554,7 +554,7 @@ describe('query', () => {
             3, 0, [], [],
             function(rf: RenderFlags, ctx: any) {
               if (rf & RenderFlags.Create) {
-                query(0, ['foo'], false, QUERY_READ_CONTAINER_REF);
+                query(0, ['foo'], false, ViewContainerRef);
               }
               if (rf & RenderFlags.Update) {
                 let tmp: any;
@@ -587,7 +587,7 @@ describe('query', () => {
                function(rf: RenderFlags, ctx: any) {
 
                  if (rf & RenderFlags.Create) {
-                   query(0, ['foo'], false, QUERY_READ_ELEMENT_REF);
+                   query(0, ['foo'], false, ElementRef);
                  }
                  if (rf & RenderFlags.Update) {
                    let tmp: any;
@@ -621,7 +621,7 @@ describe('query', () => {
             3, 0, [], [],
             function(rf: RenderFlags, ctx: any) {
               if (rf & RenderFlags.Create) {
-                query(0, ['foo'], undefined, QUERY_READ_FROM_NODE);
+                query(0, ['foo'], undefined);
               }
               if (rf & RenderFlags.Update) {
                 let tmp: any;
@@ -653,7 +653,7 @@ describe('query', () => {
             3, 0, [], [],
             function(rf: RenderFlags, ctx: any) {
               if (rf & RenderFlags.Create) {
-                query(0, ['foo'], false, QUERY_READ_TEMPLATE_REF);
+                query(0, ['foo'], false, TemplateRef);
               }
               if (rf & RenderFlags.Update) {
                 let tmp: any;
@@ -690,7 +690,7 @@ describe('query', () => {
             3, 0, [Child], [],
             function(rf: RenderFlags, ctx: any) {
               if (rf & RenderFlags.Create) {
-                query(0, ['foo'], true, QUERY_READ_FROM_NODE);
+                query(0, ['foo'], true);
               }
               if (rf & RenderFlags.Update) {
                 let tmp: any;
@@ -735,7 +735,7 @@ describe('query', () => {
             3, 0, [Child], [],
             function(rf: RenderFlags, ctx: any) {
               if (rf & RenderFlags.Create) {
-                query(0, ['foo'], true, QUERY_READ_FROM_NODE);
+                query(0, ['foo'], true);
               }
               if (rf & RenderFlags.Update) {
                 let tmp: any;
@@ -773,7 +773,7 @@ describe('query', () => {
                3, 0, [Child], [],
                function(rf: RenderFlags, ctx: any) {
                  if (rf & RenderFlags.Create) {
-                   query(0, ['foo'], true, QUERY_READ_FROM_NODE);
+                   query(0, ['foo'], true);
                  }
                  if (rf & RenderFlags.Update) {
                    let tmp: any;
@@ -813,7 +813,7 @@ describe('query', () => {
             4, 0, [Child1, Child2], [],
             function(rf: RenderFlags, ctx: any) {
               if (rf & RenderFlags.Create) {
-                query(0, ['foo', 'bar'], true, QUERY_READ_FROM_NODE);
+                query(0, ['foo', 'bar'], true);
               }
               if (rf & RenderFlags.Update) {
                 let tmp: any;
@@ -852,8 +852,8 @@ describe('query', () => {
             5, 0, [Child], [],
             function(rf: RenderFlags, ctx: any) {
               if (rf & RenderFlags.Create) {
-                query(0, ['foo'], true, QUERY_READ_FROM_NODE);
+                query(0, ['foo'], true);
-                query(1, ['bar'], true, QUERY_READ_FROM_NODE);
+                query(1, ['bar'], true);
               }
               if (rf & RenderFlags.Update) {
                 let tmp: any;
@@ -896,7 +896,7 @@ describe('query', () => {
             3, 0, [Child], [],
             function(rf: RenderFlags, ctx: any) {
               if (rf & RenderFlags.Create) {
-                query(0, ['foo'], undefined, QUERY_READ_ELEMENT_REF);
+                query(0, ['foo'], undefined, ElementRef);
               }
               if (rf & RenderFlags.Update) {
                 let tmp: any;
@@ -934,7 +934,7 @@ describe('query', () => {
             4, 0, [Child], [],
             function(rf: RenderFlags, ctx: any) {
               if (rf & RenderFlags.Create) {
-                query(0, ['foo', 'bar'], undefined, QUERY_READ_FROM_NODE);
+                query(0, ['foo', 'bar'], undefined);
               }
               if (rf & RenderFlags.Update) {
                 let tmp: any;
@@ -1042,7 +1042,7 @@ describe('query', () => {
             3, 1, [NgIf], [],
             function(rf: RenderFlags, ctx: any) {
               if (rf & RenderFlags.Create) {
-                query(0, ['foo'], true, QUERY_READ_FROM_NODE);
+                query(0, ['foo'], true);
               }
               if (rf & RenderFlags.Update) {
                 let tmp: any;
@@ -1103,7 +1103,7 @@ describe('query', () => {
             viewQuery: function(rf: RenderFlags, ctx: Cmpt) {
               let tmp: any;
               if (rf & RenderFlags.Create) {
-                query(0, ['foo'], true, QUERY_READ_FROM_NODE);
+                query(0, ['foo'], true);
               }
               if (rf & RenderFlags.Update) {
                 queryRefresh(tmp = load<QueryList<any>>(0)) && (ctx.query = tmp as QueryList<any>);
@@ -1189,7 +1189,7 @@ describe('query', () => {
                9, 0, [ViewContainerManipulatorDirective], [],
                function(rf: RenderFlags, ctx: any) {
                  if (rf & RenderFlags.Create) {
-                   query(0, ['foo'], true, QUERY_READ_FROM_NODE);
+                   query(0, ['foo'], true);
                  }
                  if (rf & RenderFlags.Update) {
                    let tmp: any;
@@ -1284,7 +1284,7 @@ describe('query', () => {
                viewQuery: (rf: RenderFlags, cmpt: Cmpt) => {
                  let tmp: any;
                  if (rf & RenderFlags.Create) {
-                   query(0, ['foo'], true, QUERY_READ_FROM_NODE);
+                   query(0, ['foo'], true);
                  }
                  if (rf & RenderFlags.Update) {
                    queryRefresh(tmp = load<QueryList<any>>(0)) &&
@@ -1356,7 +1356,7 @@ describe('query', () => {
             viewQuery: (rf: RenderFlags, myApp: MyApp) => {
               let tmp: any;
               if (rf & RenderFlags.Create) {
-                query(0, ['foo'], true, QUERY_READ_FROM_NODE);
+                query(0, ['foo'], true);
               }
               if (rf & RenderFlags.Update) {
                 queryRefresh(tmp = load<QueryList<any>>(0)) &&
@@ -1421,7 +1421,7 @@ describe('query', () => {
             2, 0, [], [],
             function(rf: RenderFlags, ctx: any) {
               if (rf & RenderFlags.Create) {
-                query(0, ['foo'], true, QUERY_READ_FROM_NODE);
+                query(0, ['foo'], true);
               }
               if (rf & RenderFlags.Update) {
                 let tmp: any;
@@ -1486,7 +1486,7 @@ describe('query', () => {
                6, 0, [], [],
                function(rf: RenderFlags, ctx: any) {
                  if (rf & RenderFlags.Create) {
-                   query(0, ['foo'], true, QUERY_READ_FROM_NODE);
+                   query(0, ['foo'], true);
                  }
                  if (rf & RenderFlags.Update) {
                    let tmp: any;
@@ -1563,7 +1563,7 @@ describe('query', () => {
             2, 0, [], [],
             function(rf: RenderFlags, ctx: any) {
               if (rf & RenderFlags.Create) {
-                query(0, ['foo'], true, QUERY_READ_FROM_NODE);
+                query(0, ['foo'], true);
               }
               if (rf & RenderFlags.Update) {
                 let tmp: any;
@@ -1643,7 +1643,7 @@ describe('query', () => {
             2, 0, [], [],
             function(rf: RenderFlags, ctx: any) {
               if (rf & RenderFlags.Create) {
-                query(0, ['foo'], true, QUERY_READ_FROM_NODE);
+                query(0, ['foo'], true);
               }
               if (rf & RenderFlags.Update) {
                 let tmp: any;
@@ -1712,8 +1712,8 @@ describe('query', () => {
             5, 0, [], [],
             function(rf: RenderFlags, ctx: any) {
               if (rf & RenderFlags.Create) {
-                query(0, ['foo'], true, QUERY_READ_FROM_NODE);
+                query(0, ['foo'], true);
-                query(1, ['foo'], false, QUERY_READ_FROM_NODE);
+                query(1, ['foo'], false);
               }
               if (rf & RenderFlags.Update) {
                 let tmp: any;
@@ -1793,7 +1793,7 @@ describe('query', () => {
           2, 0, [], [],
           function(rf: RenderFlags, ctx: any) {
             if (rf & RenderFlags.Create) {
-              query(0, ['foo'], false, QUERY_READ_FROM_NODE);
+              query(0, ['foo'], false);
             }
             if (rf & RenderFlags.Update) {
               let tmp: any;
@@ -1874,7 +1874,7 @@ describe('query', () => {
         4, 0, [SomeDir], [],
         function(rf: RenderFlags, ctx: any) {
           if (rf & RenderFlags.Create) {
-            query(0, ['foo'], true, QUERY_READ_FROM_NODE);
+            query(0, ['foo'], true);
           }
           if (rf & RenderFlags.Update) {
             let tmp: any;
@@ -1911,8 +1911,7 @@ describe('query', () => {
         type: WithContentDirective,
         selectors: [['', 'with-content', '']],
         factory: () => new WithContentDirective(),
-        contentQueries:
+        contentQueries: () => { registerContentQuery(query(null, ['foo'], true)); },
-            () => { registerContentQuery(query(null, ['foo'], true, QUERY_READ_FROM_NODE)); },
         contentQueriesRefresh: (dirIndex: number, queryStartIdx: number) => {
           let tmp: any;
           withContentInstance = loadDirective<WithContentDirective>(dirIndex);
@@ -1933,8 +1932,7 @@ describe('query', () => {
         template: function(rf: RenderFlags, ctx: any) {},
         consts: 0,
         vars: 0,
-        contentQueries:
+        contentQueries: () => { registerContentQuery(query(null, ['foo'], false)); },
-            () => { registerContentQuery(query(null, ['foo'], false, QUERY_READ_FROM_NODE)); },
         contentQueriesRefresh: (dirIndex: number, queryStartIdx: number) => {
           let tmp: any;
           shallowCompInstance = loadDirective<ShallowComp>(dirIndex);
@@ -2050,7 +2048,7 @@ describe('query', () => {
           6, 0, [WithContentDirective], [],
           function(rf: RenderFlags, ctx: any) {
             if (rf & RenderFlags.Create) {
-              query(0, ['foo', 'bar'], true, QUERY_READ_FROM_NODE);
+              query(0, ['foo', 'bar'], true);
             }
             if (rf & RenderFlags.Update) {
               let tmp: any;
@@ -2090,7 +2088,7 @@ describe('query', () => {
           6, 0, [WithContentDirective], [],
           function(rf: RenderFlags, ctx: any) {
             if (rf & RenderFlags.Create) {
-              query(0, ['bar'], true, QUERY_READ_FROM_NODE);
+              query(0, ['bar'], true);
             }
             if (rf & RenderFlags.Update) {
               let tmp: any;
@@ -2114,7 +2112,7 @@ describe('query', () => {
           contentQueries: () => {
             // @ContentChildren('foo, bar, baz', {descendants: true}) fooBars:
             // QueryList<ElementRef>;
-            registerContentQuery(query(null, ['foo', 'bar', 'baz'], true, QUERY_READ_FROM_NODE));
+            registerContentQuery(query(null, ['foo', 'bar', 'baz'], true));
           },
           contentQueriesRefresh: (dirIndex: number, queryStartIdx: number) => {
             let tmp: any;
@@ -2178,7 +2176,7 @@ describe('query', () => {
           contentQueries: () => {
             // @ContentChildren('foo, bar, baz', {descendants: true}) fooBars:
             // QueryList<ElementRef>;
-            registerContentQuery(query(null, ['foo'], false, QUERY_READ_FROM_NODE));
+            registerContentQuery(query(null, ['foo'], false));
           },
           contentQueriesRefresh: (dirIndex: number, queryStartIdx: number) => {
             let tmp: any;
@@ -2231,7 +2229,7 @@ describe('query', () => {
              factory: () => new ShallowQueryDirective(),
              contentQueries: () => {
                // @ContentChildren('foo', {descendants: false}) foos: QueryList<ElementRef>;
-               registerContentQuery(query(null, ['foo'], false, QUERY_READ_FROM_NODE));
+               registerContentQuery(query(null, ['foo'], false));
              },
              contentQueriesRefresh: (dirIndex: number, queryStartIdx: number) => {
                let tmp: any;
@@ -2251,7 +2249,7 @@ describe('query', () => {
              factory: () => new DeepQueryDirective(),
              contentQueries: () => {
                // @ContentChildren('foo', {descendants: false}) foos: QueryList<ElementRef>;
-               registerContentQuery(query(null, ['foo'], true, QUERY_READ_FROM_NODE));
+               registerContentQuery(query(null, ['foo'], true));
              },
              contentQueriesRefresh: (dirIndex: number, queryStartIdx: number) => {
                let tmp: any;

packages/core/test/render3/styling/players_spec.ts

@@ -7,7 +7,7 @@
  */
 import {RenderFlags} from '@angular/core/src/render3';
 
-import {QUERY_READ_FROM_NODE, defineComponent, getHostElement} from '../../../src/render3/index';
+import {defineComponent, getHostElement} from '../../../src/render3/index';
 import {element, elementEnd, elementStart, elementStyling, elementStylingApply, load, markDirty} from '../../../src/render3/instructions';
 import {PlayState, Player, PlayerContext, PlayerHandler} from '../../../src/render3/interfaces/player';
 import {RElement} from '../../../src/render3/interfaces/renderer';
@@ -289,7 +289,7 @@ class SuperComp {
     },
     viewQuery: function(rf: RenderFlags, ctx: SuperComp) {
       if (rf & RenderFlags.Create) {
-        query(0, ['child'], true, QUERY_READ_FROM_NODE);
+        query(0, ['child'], true);
       }
       if (rf & RenderFlags.Update) {
         let tmp: any;