fix(ivy): jit compilation should support content queries with type predicates (#27068)

PR Close #27068

packages/compiler/src/jit_compiler_facade.ts

@@ -185,6 +185,7 @@ function convertDirectiveFacadeToMetadata(facade: R3DirectiveMetadataFacade): R3
     host: extractHostBindings(facade.host, facade.propMetadata),
     inputs: {...inputsFromMetadata, ...inputsFromType},
     outputs: {...outputsFromMetadata, ...outputsFromType},
+    queries: facade.queries.map(convertToR3QueryMetadata),
     providers: facade.providers != null ? new WrappedNodeExpr(facade.providers) : null,
   };
 }
@@ -291,4 +292,4 @@ function parseInputOutputs(values: string[]): StringMap {
 export function publishFacade(global: any) {
   const ng: ExportedCompilerFacade = global.ng || (global.ng = {});
   ng.ɵcompilerFacade = new CompilerFacadeImpl();
-}
+}

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

@@ -442,7 +442,7 @@ function createQueryDefinition(
     query: R3QueryMetadata, constantPool: ConstantPool, idx: number | null): o.Expression {
   const predicate = getQueryPredicate(query, constantPool);
 
-  // e.g. r3.Q(null, somePredicate, false) or r3.Q(0, ['div'], false)
+  // e.g. r3.query(null, somePredicate, false) or r3.query(0, ['div'], false)
   const parameters = [
     o.literal(idx, o.INFERRED_TYPE),
     predicate,

packages/core/test/render3/ivy/jit_spec.ts

@@ -306,7 +306,7 @@ ivyEnabled && describe('render3 jit', () => {
     expect((C as any).ngBaseDef.outputs).toEqual({prop1: 'alias1', prop2: 'alias2'});
   });
 
-  it('should compile ContentChildren query on a directive', () => {
+  it('should compile ContentChildren query with string predicate on a directive', () => {
     @Directive({selector: '[test]'})
     class TestDirective {
       @ContentChildren('foo') foos: QueryList<ElementRef>|undefined;
@@ -316,7 +316,7 @@ ivyEnabled && describe('render3 jit', () => {
     expect((TestDirective as any).ngDirectiveDef.contentQueriesRefresh).not.toBeNull();
   });
 
-  it('should compile ContentChild query on a directive', () => {
+  it('should compile ContentChild query with string predicate on a directive', () => {
     @Directive({selector: '[test]'})
     class TestDirective {
       @ContentChild('foo') foo: ElementRef|undefined;
@@ -326,6 +326,30 @@ ivyEnabled && describe('render3 jit', () => {
     expect((TestDirective as any).ngDirectiveDef.contentQueriesRefresh).not.toBeNull();
   });
 
+  it('should compile ContentChildren query with type predicate on a directive', () => {
+    class SomeDir {}
+
+    @Directive({selector: '[test]'})
+    class TestDirective {
+      @ContentChildren(SomeDir) dirs: QueryList<SomeDir>|undefined;
+    }
+
+    expect((TestDirective as any).ngDirectiveDef.contentQueries).not.toBeNull();
+    expect((TestDirective as any).ngDirectiveDef.contentQueriesRefresh).not.toBeNull();
+  });
+
+  it('should compile ContentChild query with type predicate on a directive', () => {
+    class SomeDir {}
+
+    @Directive({selector: '[test]'})
+    class TestDirective {
+      @ContentChild(SomeDir) dir: SomeDir|undefined;
+    }
+
+    expect((TestDirective as any).ngDirectiveDef.contentQueries).not.toBeNull();
+    expect((TestDirective as any).ngDirectiveDef.contentQueriesRefresh).not.toBeNull();
+  });
+
   it('should not pick up view queries from directives', () => {
     @Directive({selector: '[test]'})
     class TestDirective {