refactor(ivy): make all directives public by default (#25291)

To match the View Engine behavior.

We should make this configurable so that the node injector is tree shaken when
directives do not need to be published.

PR Close #25291

packages/compiler-cli/src/ngcc/test/rendering/renderer_spec.ts

@@ -123,7 +123,7 @@ describe('Renderer', () => {
              .toBe(analyzedFile.analyzedClasses[0]);
          expect(renderer.addDefinitions.calls.first().args[2])
              .toEqual(
-                 `A.ngDirectiveDef = ɵngcc0.ɵdefineDirective({ type: A, selectors: [["", "a", ""]], factory: function A_Factory() { return new A(); } });`);
+                 `A.ngDirectiveDef = ɵngcc0.ɵdefineDirective({ type: A, selectors: [["", "a", ""]], factory: function A_Factory() { return new A(); }, features: [ɵngcc0.ɵPublicFeature] });`);
        });
 
     it('should call removeDecorators with the source code, a map of class decorators that have been analyzed',

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

@@ -7,7 +7,7 @@
  */
 
 import {InitialStylingFlags} from '@angular/compiler/src/core';
-import {MockDirectory, setup} from '@angular/compiler/test/aot/test_util';
+import {setup} from '@angular/compiler/test/aot/test_util';
 import {compile, expectEmit} from './mock_compile';
 
 
@@ -333,9 +333,11 @@ describe('compiler compliance', () => {
         const _c1 = ["background-color"];
         …
         MyComponent.ngComponentDef = i0.ɵdefineComponent({type:MyComponent,selectors:[["my-component"]],
-            factory:function MyComponent_Factory(){
+            factory: function MyComponent_Factory(){
               return new MyComponent();
-            },template:function MyComponent_Template(rf,ctx){
+            },
+            features: [$r3$.ɵPublicFeature],
+            template:function MyComponent_Template(rf,ctx){
               if (rf & 1) {
                 $r3$.ɵE(0, "div");
                 $r3$.ɵs(_c0, _c1);
@@ -387,6 +389,7 @@ describe('compiler compliance', () => {
           type: ChildComponent,
           selectors: [["child"]],
           factory: function ChildComponent_Factory() { return new ChildComponent(); },
+          features: [$r3$.ɵPublicFeature],
           template: function ChildComponent_Template(rf, ctx) {
             if (rf & 1) {
               $r3$.ɵT(0, "child-view");
@@ -399,7 +402,8 @@ describe('compiler compliance', () => {
         SomeDirective.ngDirectiveDef = $r3$.ɵdefineDirective({
           type: SomeDirective,
           selectors: [["", "some-directive", ""]],
-          factory: function SomeDirective_Factory() {return new SomeDirective(); }
+          factory: function SomeDirective_Factory() {return new SomeDirective(); },
+          features: [$r3$.ɵPublicFeature]
         });
       `;
 
@@ -411,6 +415,7 @@ describe('compiler compliance', () => {
           type: MyComponent,
           selectors: [["my-component"]],
           factory: function MyComponent_Factory() { return new MyComponent(); },
+          features: [$r3$.ɵPublicFeature],
           template: function MyComponent_Template(rf, ctx) {
             if (rf & 1) {
               $r3$.ɵEe(0, "child", $c1$);
@@ -453,7 +458,8 @@ describe('compiler compliance', () => {
         SomeDirective.ngDirectiveDef = $r3$.ɵdefineDirective({
           type: SomeDirective,
           selectors: [["div", "some-directive", "", 8, "foo", 3, "title", "", 9, "baz"]],
-          factory: function SomeDirective_Factory() {return new SomeDirective(); }
+          factory: function SomeDirective_Factory() {return new SomeDirective(); },
+          features: [$r3$.ɵPublicFeature]
         });
       `;
 
@@ -462,7 +468,8 @@ describe('compiler compliance', () => {
         OtherDirective.ngDirectiveDef = $r3$.ɵdefineDirective({
           type: OtherDirective,
           selectors: [["", 5, "span", "title", "", 9, "baz"]],
-          factory: function OtherDirective_Factory() {return new OtherDirective(); }
+          factory: function OtherDirective_Factory() {return new OtherDirective(); },
+          features: [$r3$.ɵPublicFeature]
         });
       `;
 
@@ -497,7 +504,8 @@ describe('compiler compliance', () => {
           factory: function HostBindingDir_Factory() { return new HostBindingDir(); },
           hostBindings: function HostBindingDir_HostBindings(dirIndex, elIndex) {
             $r3$.ɵp(elIndex, "id", $r3$.ɵb($r3$.ɵd(dirIndex).dirId));
-          }
+          },
+          features: [$r3$.ɵPublicFeature]
         });
       `;
 
@@ -536,7 +544,8 @@ describe('compiler compliance', () => {
         IfDirective.ngDirectiveDef = $r3$.ɵdefineDirective({
           type: IfDirective,
           selectors: [["", "if", ""]],
-          factory: function IfDirective_Factory() { return new IfDirective($r3$.ɵinjectTemplateRef()); }
+          factory: function IfDirective_Factory() { return new IfDirective($r3$.ɵinjectTemplateRef()); },
+          features: [$r3$.ɵPublicFeature]
         });`;
       const MyComponentDefinition = `
         const $c1$ = ["foo", ""];
@@ -558,6 +567,7 @@ describe('compiler compliance', () => {
           type: MyComponent,
           selectors: [["my-component"]],
           factory: function MyComponent_Factory() { return new MyComponent(); },
+          features: [$r3$.ɵPublicFeature],
           template: function MyComponent_Template(rf, ctx) {
             if (rf & 1) {
               $r3$.ɵE(0, "ul", null, $c1$);
@@ -617,6 +627,7 @@ describe('compiler compliance', () => {
             type: MyApp,
             selectors: [["my-app"]],
             factory: function MyApp_Factory() { return new MyApp(); },
+            features: [$r3$.ɵPublicFeature],
             template: function MyApp_Template(rf, ctx) {
               if (rf & 1) {
                 $r3$.ɵEe(0, "my-comp");
@@ -696,6 +707,7 @@ describe('compiler compliance', () => {
             type: MyApp,
             selectors: [["my-app"]],
             factory: function MyApp_Factory() { return new MyApp(); },
+            features: [$r3$.ɵPublicFeature],
             template: function MyApp_Template(rf, ctx) {
               if (rf & 1) {
                 $r3$.ɵEe(0, "my-comp");
@@ -757,6 +769,7 @@ describe('compiler compliance', () => {
             type: MyApp,
             selectors: [["my-app"]],
             factory: function MyApp_Factory() { return new MyApp(); },
+            features: [$r3$.ɵPublicFeature],
             template: function MyApp_Template(rf, ctx) {
               if (rf & 1) {
                 $r3$.ɵEe(0, "object-comp");
@@ -822,6 +835,7 @@ describe('compiler compliance', () => {
             type: MyApp,
             selectors: [["my-app"]],
             factory: function MyApp_Factory() { return new MyApp(); },
+            features: [$r3$.ɵPublicFeature],
             template: function MyApp_Template(rf, ctx) {
               if (rf & 1) {
                 $r3$.ɵEe(0, "nested-comp");
@@ -879,6 +893,7 @@ describe('compiler compliance', () => {
           type: SimpleComponent,
           selectors: [["simple"]],
           factory: function SimpleComponent_Factory() { return new SimpleComponent(); },
+          features: [$r3$.ɵPublicFeature],
           template: function SimpleComponent_Template(rf, ctx) {
             if (rf & 1) {
               $r3$.ɵpD();
@@ -899,6 +914,7 @@ describe('compiler compliance', () => {
           type: ComplexComponent,
           selectors: [["complex"]],
           factory: function ComplexComponent_Factory() { return new ComplexComponent(); },
+          features: [$r3$.ɵPublicFeature],
           template: function ComplexComponent_Template(rf, ctx) {
             if (rf & 1) {
               $r3$.ɵpD($c1$, $c2$);
@@ -964,6 +980,7 @@ describe('compiler compliance', () => {
             type: ViewQueryComponent,
             selectors: [["view-query-component"]],
             factory: function ViewQueryComponent_Factory() { return new ViewQueryComponent(); },
+            features: [$r3$.ɵPublicFeature],
             viewQuery: function ViewQueryComponent_Query(rf, ctx) {
               if (rf & 1) {
                 $r3$.ɵQ(0, SomeDirective, true);
@@ -1039,6 +1056,7 @@ describe('compiler compliance', () => {
               ($r3$.ɵqR(($tmp$ = $r3$.ɵql(queryStartIndex))) && ($instance$.someDir = $tmp$.first));
               ($r3$.ɵqR(($tmp$ = $r3$.ɵql((queryStartIndex + 1)))) && ($instance$.someDirList = $tmp$));
             },
+            features: [$r3$.ɵPublicFeature],
             template: function ContentQueryComponent_Template(rf, ctx) {
               if (rf & 1) {
                 $r3$.ɵpD();
@@ -1098,8 +1116,12 @@ describe('compiler compliance', () => {
 
       it('should render pipes', () => {
         const MyPipeDefinition = `
-            MyPipe.ngPipeDef = $r3$.ɵdefinePipe(
+            MyPipe.ngPipeDef = $r3$.ɵdefinePipe({
-                {name: "myPipe", type: MyPipe, factory: function MyPipe_Factory() { return new MyPipe(); }, pure: false});
+              name: "myPipe",
+              type: MyPipe,
+              factory: function MyPipe_Factory() { return new MyPipe(); },
+              pure: false
+            });
         `;
 
         const MyPurePipeDefinition = `
@@ -1119,6 +1141,7 @@ describe('compiler compliance', () => {
               type: MyApp,
               selectors: [["my-app"]],
               factory: function MyApp_Factory() { return new MyApp(); },
+              features: [$r3$.ɵPublicFeature],
               template: function MyApp_Template(rf, ctx) {
                 if (rf & 1) {
                   $r3$.ɵT(0);
@@ -1169,6 +1192,7 @@ describe('compiler compliance', () => {
           type: MyComponent,
           selectors: [["my-component"]],
           factory: function MyComponent_Factory() { return new MyComponent(); },
+          features: [$r3$.ɵPublicFeature],
           template: function MyComponent_Template(rf, ctx) {
             if (rf & 1) {
               $r3$.ɵEe(0, "input", null, $c1$);
@@ -1260,6 +1284,7 @@ describe('compiler compliance', () => {
           type: MyComponent,
           selectors: [["my-component"]],
           factory: function MyComponent_Factory() { return new MyComponent(); },
+          features: [$r3$.ɵPublicFeature],
           template: function MyComponent_Template(rf, ctx) {
             if (rf & 1) {
               $r3$.ɵEe(0, "div", null, $c1$);
@@ -1403,7 +1428,7 @@ describe('compiler compliance', () => {
             selectors: [["lifecycle-comp"]],
             factory: function LifecycleComp_Factory() { return new LifecycleComp(); },
             inputs: {nameMin: "name"},
-            features: [$r3$.ɵNgOnChangesFeature],
+            features: [$r3$.ɵPublicFeature, $r3$.ɵNgOnChangesFeature],
             template: function LifecycleComp_Template(rf, ctx) {}
           });`;
 
@@ -1412,6 +1437,7 @@ describe('compiler compliance', () => {
             type: SimpleLayout,
             selectors: [["simple-layout"]],
             factory: function SimpleLayout_Factory() { return new SimpleLayout(); },
+            features: [$r3$.ɵPublicFeature],
             template: function SimpleLayout_Template(rf, ctx) {
               if (rf & 1) {
                 $r3$.ɵEe(0, "lifecycle-comp");
@@ -1519,7 +1545,7 @@ describe('compiler compliance', () => {
                 factory: function ForOfDirective_Factory() {
                   return new ForOfDirective($r3$.ɵinjectViewContainerRef(), $r3$.ɵinjectTemplateRef());
                 },
-                features: [$r3$.ɵNgOnChangesFeature],
+                features: [$r3$.ɵPublicFeature, $r3$.ɵNgOnChangesFeature],
                 inputs: {forOf: "forOf"}
               });
             `;
@@ -1539,6 +1565,7 @@ describe('compiler compliance', () => {
                 type: MyComponent,
                 selectors: [["my-component"]],
                 factory: function MyComponent_Factory() { return new MyComponent(); },
+                features: [$r3$.ɵPublicFeature],
                 template: function MyComponent_Template(rf, ctx){
                   if (rf & 1) {
                     $r3$.ɵNS();
@@ -1592,7 +1619,7 @@ describe('compiler compliance', () => {
             factory: function ForOfDirective_Factory() {
               return new ForOfDirective($r3$.ɵinjectViewContainerRef(), $r3$.ɵinjectTemplateRef());
             },
-            features: [$r3$.ɵNgOnChangesFeature],
+            features: [$r3$.ɵPublicFeature, $r3$.ɵNgOnChangesFeature],
             inputs: {forOf: "forOf"}
           });
         `;
@@ -1615,6 +1642,7 @@ describe('compiler compliance', () => {
             type: MyComponent,
             selectors: [["my-component"]],
             factory: function MyComponent_Factory() { return new MyComponent(); },
+            features: [$r3$.ɵPublicFeature],
             template: function MyComponent_Template(rf, ctx) {
               if (rf & 1) {
                 $r3$.ɵE(0, "ul");
@@ -1712,6 +1740,7 @@ describe('compiler compliance', () => {
             type: MyComponent,
             selectors: [["my-component"]],
             factory: function MyComponent_Factory() { return new MyComponent(); },
+            features: [$r3$.ɵPublicFeature],
             template: function MyComponent_Template(rf, ctx) {
               if (rf & 1) {
                 $r3$.ɵE(0, "ul");

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

@@ -153,6 +153,7 @@ describe('compiler compliance: listen()', () => {
           type: MyComponent,
           selectors: [["my-component"]],
           factory: function MyComponent_Factory() { return new MyComponent(); },
+          features: [$r3$.ɵPublicFeature],
           template: function MyComponent_Template(rf, ctx) {
             if (rf & 1) {
               $r3$.ɵE(0, "button");

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

@@ -87,12 +87,13 @@ describe('compiler compliance: styling', () => {
          const template = `
           const _c0 = ["opacity","width","height",${InitialStylingFlags.VALUES_MODE},"opacity","1"];
           …
-          MyComponent.ngComponentDef = i0.ɵdefineComponent({
+          MyComponent.ngComponentDef = $r3$.ɵdefineComponent({
               type: MyComponent,
               selectors:[["my-component"]],
               factory:function MyComponent_Factory(){
                 return new MyComponent();
               },
+              features: [$r3$.ɵPublicFeature],
               template: function MyComponent_Template(rf, $ctx$) {
                 if (rf & 1) {
                   $r3$.ɵE(0, "div");
@@ -143,21 +144,22 @@ describe('compiler compliance: styling', () => {
               }
           }
 
-          MyComponent.ngComponentDef = i0.ɵdefineComponent({
+          MyComponent.ngComponentDef = $r3$.ɵdefineComponent({
             type: MyComponent,
             selectors: [["my-component"]],
             factory: function MyComponent_Factory() {
               return new MyComponent();
             },
+            features: [$r3$.ɵPublicFeature],
             template: function MyComponent_Template(rf, ctx) {
               if (rf & 1) {
-                i0.ɵE(0, "div");
+                $r3$.ɵE(0, "div");
-                i0.ɵs(null, _c0, i0.ɵzss);
+                $r3$.ɵs(null, _c0, $r3$.ɵzss);
-                i0.ɵe();
+                $r3$.ɵe();
               }
               if (rf & 2) {
-                i0.ɵsp(0, 0, ctx.myImage);
+                $r3$.ɵsp(0, 0, ctx.myImage);
-                i0.ɵsa(0);
+                $r3$.ɵsa(0);
               }
             }
           });
@@ -237,12 +239,13 @@ describe('compiler compliance: styling', () => {
          const template = `
           const _c0 = ["grape","apple","orange",${InitialStylingFlags.VALUES_MODE},"grape",true];
           …
-          MyComponent.ngComponentDef = i0.ɵdefineComponent({
+          MyComponent.ngComponentDef = $r3$.ɵdefineComponent({
               type: MyComponent,
               selectors:[["my-component"]],
               factory:function MyComponent_Factory(){
                 return new MyComponent();
               },
+              features: [$r3$.ɵPublicFeature],
               template: function MyComponent_Template(rf, $ctx$) {
                 if (rf & 1) {
                   $r3$.ɵE(0, "div");
@@ -290,12 +293,13 @@ describe('compiler compliance: styling', () => {
           const _c0 = ["foo",${InitialStylingFlags.VALUES_MODE},"foo",true];
           const _c1 = ["width",${InitialStylingFlags.VALUES_MODE},"width","100px"];
           …
-          MyComponent.ngComponentDef = i0.ɵdefineComponent({
+          MyComponent.ngComponentDef = $r3$.ɵdefineComponent({
               type: MyComponent,
               selectors:[["my-component"]],
               factory:function MyComponent_Factory(){
                 return new MyComponent();
               },
+              features: [$r3$.ɵPublicFeature],
               template: function MyComponent_Template(rf, $ctx$) {
                 if (rf & 1) {
                   $r3$.ɵE(0, "div");

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

@@ -319,7 +319,6 @@ describe('compiler compliance: template', () => {
       app: {
         'spec.ts': `
               import {Component, NgModule} from '@angular/core';
-              import {CommonModule} from '@angular/common';
 
               @Component({
                 selector: 'my-component',

packages/compiler/src/render3/r3_identifiers.ts

@@ -158,6 +158,8 @@ export class Identifiers {
   static InheritDefinitionFeature:
       o.ExternalReference = {name: 'ɵInheritDefinitionFeature', moduleName: CORE};
 
+  static PublicFeature: o.ExternalReference = {name: 'ɵPublicFeature', moduleName: CORE};
+
   static listener: o.ExternalReference = {name: 'ɵL', moduleName: CORE};
 
   // Reserve slots for pure functions

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

@@ -67,6 +67,9 @@ function baseDirectiveFields(
   // e.g. `features: [NgOnChangesFeature]`
   const features: o.Expression[] = [];
 
+  // TODO: add `PublicFeature` so that directives get registered to the DI - make this configurable
+  features.push(o.importExpr(R3.PublicFeature));
+
   if (meta.usesInheritance) {
     features.push(o.importExpr(R3.InheritDefinitionFeature));
   }

packages/core/src/render3/jit/environment.ts

@@ -32,6 +32,7 @@ export const angularCoreEnv: {[name: string]: Function} = {
   'ɵinjectTemplateRef': r3.injectTemplateRef,
   'ɵinjectViewContainerRef': r3.injectViewContainerRef,
   'ɵNgOnChangesFeature': r3.NgOnChangesFeature,
+  'ɵPublicFeature': r3.PublicFeature,
   'ɵInheritDefinitionFeature': r3.InheritDefinitionFeature,
   'ɵa': r3.a,
   'ɵb': r3.b,

packages/core/test/bundling/hello_world/bundle.golden_symbols.json

@@ -5,6 +5,9 @@
   {
     "name": "BINDING_INDEX"
   },
+  {
+    "name": "BLOOM_MASK"
+  },
   {
     "name": "CLEAN_PROMISE"
   },
@@ -44,6 +47,9 @@
   {
     "name": "NEXT"
   },
+  {
+    "name": "NG_ELEMENT_ID"
+  },
   {
     "name": "NG_HOST_SYMBOL"
   },
@@ -53,6 +59,9 @@
   {
     "name": "PARENT"
   },
+  {
+    "name": "PublicFeature"
+  },
   {
     "name": "QUERIES"
   },
@@ -95,6 +104,9 @@
   {
     "name": "baseDirectiveCreate"
   },
+  {
+    "name": "bloomAdd"
+  },
   {
     "name": "callHooks"
   },
@@ -137,6 +149,12 @@
   {
     "name": "detectChangesInternal"
   },
+  {
+    "name": "diPublic"
+  },
+  {
+    "name": "diPublicInInjector"
+  },
   {
     "name": "domRendererFactory3"
   },
@@ -167,12 +185,21 @@
   {
     "name": "getLViewChild"
   },
+  {
+    "name": "getOrCreateNodeInjector"
+  },
+  {
+    "name": "getOrCreateNodeInjectorForNode"
+  },
   {
     "name": "getOrCreateTView"
   },
   {
     "name": "getParentLNode"
   },
+  {
+    "name": "getPreviousOrParentNode"
+  },
   {
     "name": "getRenderFlags"
   },
@@ -206,6 +233,9 @@
   {
     "name": "nativeInsertBefore"
   },
+  {
+    "name": "nextNgElementId"
+  },
   {
     "name": "readElementValue"
   },

packages/core/test/bundling/todo/bundle.golden_symbols.json

@@ -119,6 +119,9 @@
   {
     "name": "PARENT"
   },
+  {
+    "name": "PublicFeature"
+  },
   {
     "name": "QUERIES"
   },
@@ -332,6 +335,9 @@
   {
     "name": "bindingUpdated"
   },
+  {
+    "name": "bloomAdd"
+  },
   {
     "name": "bloomFindPossibleInjector"
   },
@@ -434,6 +440,12 @@
   {
     "name": "detectChangesInternal"
   },
+  {
+    "name": "diPublic"
+  },
+  {
+    "name": "diPublicInInjector"
+  },
   {
     "name": "directiveCreate"
   },
@@ -740,6 +752,9 @@
   {
     "name": "nextContext"
   },
+  {
+    "name": "nextNgElementId"
+  },
   {
     "name": "pointers"
   },