refactor(core): Migrate all packages with the `explicit-standalone-fl…

…ag` schematic. (#58160) All components, directives and pipes will now use standalone as default. Non-standalone decorators have now `standalone: false`. PR Close #58160
angular · Oct 14, 2024 · 09df589 · 09df589
1 parent 9373c98
commit 09df589
Show file tree

Hide file tree

Showing 676 changed files with 12,693 additions and 3,091 deletions.
diff --git a/packages/animations/test/browser_animation_builder_spec.ts b/packages/animations/test/browser_animation_builder_spec.ts
@@ -41,6 +41,7 @@ describe('BrowserAnimationBuilder', () => {
     @Component({
       selector: 'ani-cmp',
       template: '...',
+      standalone: false,
     })
     class Cmp {
       constructor(public builder: AnimationBuilder) {}
@@ -59,6 +60,7 @@ describe('BrowserAnimationBuilder', () => {
     @Component({
       selector: 'ani-cmp',
       template: '...',
+      standalone: false,
     })
     class Cmp {
       @ViewChild('target') public target: any;
@@ -129,6 +131,7 @@ describe('BrowserAnimationBuilder', () => {
     @Component({
       selector: 'ani-cmp',
       template: '...',
+      standalone: false,
     })
     class Cmp {
       @ViewChild('target') public target: any;
@@ -191,6 +194,7 @@ describe('BrowserAnimationBuilder', () => {
     @Component({
       selector: 'ani-another-cmp',
       template: '...',
+      standalone: false,
     })
     class CmpAnother {
       @ViewChild('target') public target: any;
@@ -277,6 +281,7 @@ describe('BrowserAnimationBuilder', () => {
       @Component({
         selector: 'ani-cmp',
         template: '...',
+        standalone: false,
       })
       class Cmp {
         @ViewChild('target') public target: any;

diff --git a/packages/bazel/test/ngc-wrapped/ivy_enabled/test_module_default_compilation.ts b/packages/bazel/test/ngc-wrapped/ivy_enabled/test_module_default_compilation.ts
@@ -10,5 +10,6 @@ import {Component} from '@angular/core';
 
 @Component({
   template: 'Hello',
+  standalone: false,
 })
 export class TestComponent {}
diff --git a/packages/bazel/test/ngc-wrapped/ivy_enabled/test_module_warnings.ts b/packages/bazel/test/ngc-wrapped/ivy_enabled/test_module_warnings.ts
@@ -11,6 +11,7 @@ import {Component} from '@angular/core';
 /** Test component which contains an invalid banana in box warning. Should build successfully. */
 @Component({
   template: ` <div ([foo])="(bar)"></div> `,
+  standalone: false,
 })
 export class TestCmp {
   bar: string = 'test';

diff --git a/packages/common/http/test/transfer_cache_spec.ts b/packages/common/http/test/transfer_cache_spec.ts
@@ -46,7 +46,11 @@ type RequestBody =
   | null;
 
 describe('TransferCache', () => {
-  @Component({selector: 'test-app-http', template: 'hello'})
+  @Component({
+    selector: 'test-app-http',
+    template: 'hello',
+    standalone: false,
+  })
   class SomeComponent {}
 
   describe('withHttpTransferCache', () => {

diff --git a/packages/common/test/directives/ng_class_spec.ts b/packages/common/test/directives/ng_class_spec.ts
@@ -446,6 +446,7 @@ describe('binding to CSS class list', () => {
           <div leading-space [ngClass]="{' foo': applyClasses}"></div>
           <div trailing-space [ngClass]="{'foo ': applyClasses}"></div>
         `,
+        standalone: false,
       })
       class Cmp {
         applyClasses = true;
@@ -501,7 +502,11 @@ describe('binding to CSS class list', () => {
   });
 });
 
-@Component({selector: 'test-cmp', template: ''})
+@Component({
+  selector: 'test-cmp',
+  template: '',
+  standalone: false,
+})
 class TestComponent {
   condition: boolean = true;
   items: any[] | undefined;

diff --git a/packages/common/test/directives/ng_component_outlet_spec.ts b/packages/common/test/directives/ng_component_outlet_spec.ts
@@ -379,12 +379,20 @@ describe('inputs', () => {
 });
 
 const TEST_TOKEN = new InjectionToken('TestToken');
-@Component({selector: 'injected-component', template: 'foo'})
+@Component({
+  selector: 'injected-component',
+  template: 'foo',
+  standalone: false,
+})
 class InjectedComponent {
   constructor(@Optional() @Inject(TEST_TOKEN) public testToken: any) {}
 }
 
-@Component({selector: 'injected-component-again', template: 'bar'})
+@Component({
+  selector: 'injected-component-again',
+  template: 'bar',
+  standalone: false,
+})
 class InjectedComponentAgain {}
 
 const TEST_CMP_TEMPLATE = `<ng-template *ngComponentOutlet="
@@ -395,7 +403,11 @@ const TEST_CMP_TEMPLATE = `<ng-template *ngComponentOutlet="
       ngModule: ngModule;
       ngModuleFactory: ngModuleFactory;
     "></ng-template>`;
-@Component({selector: 'test-cmp', template: TEST_CMP_TEMPLATE})
+@Component({
+  selector: 'test-cmp',
+  template: TEST_CMP_TEMPLATE,
+  standalone: false,
+})
 class TestComponent {
   currentComponent: Type<unknown> | null = null;
   injector?: Injector;
@@ -426,10 +438,18 @@ class TestComponent {
 })
 export class TestModule {}
 
-@Component({selector: 'module-2-injected-component', template: 'baz'})
+@Component({
+  selector: 'module-2-injected-component',
+  template: 'baz',
+  standalone: false,
+})
 class Module2InjectedComponent {}
 
-@Component({selector: 'module-2-injected-component-2', template: 'baz2'})
+@Component({
+  selector: 'module-2-injected-component-2',
+  template: 'baz2',
+  standalone: false,
+})
 class Module2InjectedComponent2 {}
 
 @NgModule({
@@ -439,7 +459,11 @@ class Module2InjectedComponent2 {}
 })
 export class TestModule2 {}
 
-@Component({selector: 'module-3-injected-component', template: 'bat'})
+@Component({
+  selector: 'module-3-injected-component',
+  template: 'bat',
+  standalone: false,
+})
 class Module3InjectedComponent {}
 
 @NgModule({

diff --git a/packages/common/test/directives/ng_for_spec.ts b/packages/common/test/directives/ng_for_spec.ts
@@ -430,7 +430,11 @@ class Foo {
   }
 }
 
-@Component({selector: 'test-cmp', template: ''})
+@Component({
+  selector: 'test-cmp',
+  template: '',
+  standalone: false,
+})
 class TestComponent {
   value: any;
   items: any[] = [1, 2];

diff --git a/packages/common/test/directives/ng_if_spec.ts b/packages/common/test/directives/ng_if_spec.ts
@@ -300,7 +300,11 @@ describe('ngIf directive', () => {
   });
 });
 
-@Component({selector: 'test-cmp', template: ''})
+@Component({
+  selector: 'test-cmp',
+  template: '',
+  standalone: false,
+})
 class TestComponent {
   booleanCondition: boolean = true;
   nestedBooleanCondition: boolean = true;

diff --git a/packages/common/test/directives/ng_optimized_image_spec.ts b/packages/common/test/directives/ng_optimized_image_spec.ts
@@ -682,6 +682,7 @@ describe('Image directive', () => {
             [disableOptimizedSrcset]="disableOptimizedSrcset"
             [loaderParams]="loaderParams"
           />`,
+          standalone: false,
         })
         class TestComponent {
           width = 100;
@@ -722,6 +723,7 @@ describe('Image directive', () => {
           [loading]="loading"
           [sizes]="sizes"
         />`,
+        standalone: false,
       })
       class TestComponent {
         width = 100;
@@ -745,6 +747,7 @@ describe('Image directive', () => {
       @Component({
         selector: 'test-cmp',
         template: `<img [ngSrc]="bypassImage" width="400" height="600" />`,
+        standalone: false,
       })
       class TestComponent {
         rawImage = `javascript:alert("Hi there")`;
@@ -1737,6 +1740,7 @@ describe('Image directive', () => {
       @Component({
         selector: 'test-cmp',
         template: `<img [ngSrc]="ngSrc" width="300" height="300" />`,
+        standalone: false,
       })
       class TestComponent {
         ngSrc = `img.png`;
@@ -1759,6 +1763,7 @@ describe('Image directive', () => {
       @Component({
         selector: 'test-cmp',
         template: `<img [ngSrc]="ngSrc" width="300" height="300" sizes="100vw" />`,
+        standalone: false,
       })
       class TestComponent {
         ngSrc = `img.png`;
@@ -1823,6 +1828,7 @@ describe('Image directive', () => {
           [height]="height"
           [loaderParams]="params"
         />`,
+        standalone: false,
       })
       class TestComponent {
         ngSrc = `${IMG_BASE_URL}/img.png`;
@@ -1894,6 +1900,7 @@ describe('Image directive', () => {
           selector: 'test-cmp',
           template: '<img ngSrc="a.png" width="100" height="50" priority>',
           providers: [loaderWithPath('https://component.io')],
+          standalone: false,
         })
         class TestComponent {}
 
@@ -2333,7 +2340,11 @@ const IMG_BASE_URL = {
 const ANGULAR_LOGO_BASE64 =
   'data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNTAgMjUwIj4KICAgIDxwYXRoIGZpbGw9IiNERDAwMzEiIGQ9Ik0xMjUgMzBMMzEuOSA2My4ybDE0LjIgMTIzLjFMMTI1IDIzMGw3OC45LTQzLjcgMTQuMi0xMjMuMXoiIC8+CiAgICA8cGF0aCBmaWxsPSIjQzMwMDJGIiBkPSJNMTI1IDMwdjIyLjItLjFWMjMwbDc4LjktNDMuNyAxNC4yLTEyMy4xTDEyNSAzMHoiIC8+CiAgICA8cGF0aCAgZmlsbD0iI0ZGRkZGRiIgZD0iTTEyNSA1Mi4xTDY2LjggMTgyLjZoMjEuN2wxMS43LTI5LjJoNDkuNGwxMS43IDI5LjJIMTgzTDEyNSA1Mi4xem0xNyA4My4zaC0zNGwxNy00MC45IDE3IDQwLjl6IiAvPgogIDwvc3ZnPg==';
 
-@Component({selector: 'test-cmp', template: ''})
+@Component({
+  selector: 'test-cmp',
+  template: '',
+  standalone: false,
+})
 class TestComponent {
   width = 100;
   height = 50;

diff --git a/packages/common/test/directives/ng_plural_spec.ts b/packages/common/test/directives/ng_plural_spec.ts
@@ -180,7 +180,11 @@ class TestLocalization extends NgLocalization {
   }
 }
 
-@Component({selector: 'test-cmp', template: ''})
+@Component({
+  selector: 'test-cmp',
+  template: '',
+  standalone: false,
+})
 class TestComponent {
   switchValue: number | null = null;
 }

diff --git a/packages/common/test/directives/ng_style_spec.ts b/packages/common/test/directives/ng_style_spec.ts
@@ -255,7 +255,11 @@ describe('NgStyle', () => {
   });
 });
 
-@Component({selector: 'test-cmp', template: ''})
+@Component({
+  selector: 'test-cmp',
+  template: '',
+  standalone: false,
+})
 class TestComponent {
   expr: any;
 }

diff --git a/packages/common/test/directives/ng_switch_spec.ts b/packages/common/test/directives/ng_switch_spec.ts
@@ -173,7 +173,10 @@ describe('NgSwitch', () => {
     it('should not create the default case if another case matches', () => {
       const log: string[] = [];
 
-      @Directive({selector: '[test]'})
+      @Directive({
+        selector: '[test]',
+        standalone: false,
+      })
       class TestDirective {
         constructor(@Attribute('test') test: string) {
           log.push(test);
@@ -259,7 +262,11 @@ describe('NgSwitch', () => {
   });
 });
 
-@Component({selector: 'test-cmp', template: ''})
+@Component({
+  selector: 'test-cmp',
+  template: '',
+  standalone: false,
+})
 class TestComponent {
   switchValue: any = null;
   when1: any = null;
@@ -291,6 +298,7 @@ class TestComponent {
       <span>Bar</span>
     </ng-template>
   `,
+  standalone: false,
 })
 class ComplexComponent {
   @ViewChild('foo', {static: true}) foo!: TemplateRef<any>;

diff --git a/packages/common/test/directives/ng_template_outlet_spec.ts b/packages/common/test/directives/ng_template_outlet_spec.ts
@@ -379,7 +379,11 @@ class DestroyedSpyService {
   destroyed = false;
 }
 
-@Component({selector: 'destroyable-cmpt', template: 'Content to destroy'})
+@Component({
+  selector: 'destroyable-cmpt',
+  template: 'Content to destroy',
+  standalone: false,
+})
 class DestroyableCmpt implements OnDestroy {
   constructor(private _spyService: DestroyedSpyService) {}
 
@@ -388,12 +392,20 @@ class DestroyableCmpt implements OnDestroy {
   }
 }
 
-@Directive({selector: 'tpl-refs', exportAs: 'tplRefs'})
+@Directive({
+  selector: 'tpl-refs',
+  exportAs: 'tplRefs',
+  standalone: false,
+})
 class CaptureTplRefs {
   @ContentChildren(TemplateRef) tplRefs?: QueryList<TemplateRef<any>>;
 }
 
-@Component({selector: 'test-cmp', template: ''})
+@Component({
+  selector: 'test-cmp',
+  template: '',
+  standalone: false,
+})
 class TestComponent {
   currentTplRef?: TemplateRef<any>;
   context: any = {foo: 'bar'};
@@ -404,6 +416,7 @@ class TestComponent {
 @Component({
   selector: 'inject-value',
   template: 'Hello {{tokenValue}}',
+  standalone: false,
 })
 class InjectValueComponent {
   constructor(@Inject(templateToken) public tokenValue: string) {}
@@ -416,6 +429,7 @@ class InjectValueComponent {
     |
     <ng-template [ngTemplateOutlet]="template" [ngTemplateOutletContext]="context2"></ng-template>
   `,
+  standalone: false,
 })
 class MultiContextComponent {
   context1: {name: string} | undefined;

diff --git a/packages/common/test/directives/non_bindable_spec.ts b/packages/common/test/directives/non_bindable_spec.ts
@@ -47,14 +47,21 @@ describe('non-bindable', () => {
   }));
 });
 
-@Directive({selector: '[test-dec]'})
+@Directive({
+  selector: '[test-dec]',
+  standalone: false,
+})
 class TestDirective {
   constructor(el: ElementRef) {
     el.nativeElement.classList.add('compiled');
   }
 }
 
-@Component({selector: 'test-cmp', template: ''})
+@Component({
+  selector: 'test-cmp',
+  template: '',
+  standalone: false,
+})
 class TestComponent {
   text: string;
   constructor() {