refactor(cdk/observers): convert to standalone

Converts `cdk/observers` to standalone.

Author: crisbeto

src/cdk/observers/observe-content.spec.ts

@@ -13,8 +13,7 @@ describe('Observe content directive', () => {
   describe('basic usage', () => {
     beforeEach(waitForAsync(() => {
       TestBed.configureTestingModule({
-        imports: [ObserversModule],
-        declarations: [ComponentWithTextContent, ComponentWithChildTextContent],
+        imports: [ObserversModule, ComponentWithTextContent, ComponentWithChildTextContent],
       });
 
       TestBed.compileComponents();
@@ -89,15 +88,13 @@ describe('Observe content directive', () => {
       callbacks = [];
 
       TestBed.configureTestingModule({
-        imports: [ObserversModule],
-        declarations: [ComponentWithDebouncedListener],
+        imports: [ObserversModule, ComponentWithDebouncedListener],
         providers: [
           {
             provide: MutationObserverFactory,
             useValue: {
               create: function (callback: Function) {
                 callbacks.push(callback);
-
                 return {
                   observe: () => {},
                   disconnect: () => {},
@@ -135,15 +132,13 @@ describe('ContentObserver injectable', () => {
       callbacks = [];
 
       TestBed.configureTestingModule({
-        imports: [ObserversModule],
-        declarations: [UnobservedComponentWithTextContent],
+        imports: [ObserversModule, UnobservedComponentWithTextContent],
         providers: [
           {
             provide: MutationObserverFactory,
             useValue: {
               create: function (callback: Function) {
                 callbacks.push(callback);
-
                 return {
                   observe: () => {},
                   disconnect: () => {},
@@ -212,21 +207,29 @@ describe('ContentObserver injectable', () => {
       (cdkObserveContent)="doSomething()"
       [cdkObserveContentDisabled]="disabled">{{text}}</div>
   `,
+  standalone: true,
+  imports: [ObserversModule],
 })
 class ComponentWithTextContent {
   text = '';
   disabled = false;
   doSomething() {}
 }
 
-@Component({template: `<div (cdkObserveContent)="doSomething()"><div>{{text}}</div></div>`})
+@Component({
+  template: `<div (cdkObserveContent)="doSomething()"><div>{{text}}</div></div>`,
+  standalone: true,
+  imports: [ObserversModule],
+})
 class ComponentWithChildTextContent {
   text = '';
   doSomething() {}
 }
 
 @Component({
   template: `<div (cdkObserveContent)="spy($event)" [debounce]="debounce">{{text}}</div>`,
+  standalone: true,
+  imports: [ObserversModule],
 })
 class ComponentWithDebouncedListener {
   debounce = 500;
@@ -235,6 +238,8 @@ class ComponentWithDebouncedListener {
 
 @Component({
   template: `<div #contentEl>{{text}}</div>`,
+  standalone: true,
+  imports: [ObserversModule],
 })
 class UnobservedComponentWithTextContent {
   @ViewChild('contentEl') contentEl: ElementRef;

src/cdk/observers/observe-content.ts

@@ -134,6 +134,7 @@ export class ContentObserver implements OnDestroy {
 @Directive({
   selector: '[cdkObserveContent]',
   exportAs: 'cdkObserveContent',
+  standalone: true,
 })
 export class CdkObserveContent implements AfterContentInit, OnDestroy {
   /** Event emitted for each change in the element's content. */
@@ -203,8 +204,8 @@ export class CdkObserveContent implements AfterContentInit, OnDestroy {
 }
 
 @NgModule({
+  imports: [CdkObserveContent],
   exports: [CdkObserveContent],
-  declarations: [CdkObserveContent],
   providers: [MutationObserverFactory],
 })
 export class ObserversModule {}

src/cdk/observers/private/shared-resize-observer.spec.ts

@@ -51,7 +51,7 @@ describe('SharedResizeObserver', () => {
     originalResizeObserver = ResizeObserver;
     window.ResizeObserver = MockResizeObserver;
     TestBed.configureTestingModule({
-      declarations: [TestComponent],
+      imports: [TestComponent],
     });
     fixture = TestBed.createComponent(TestComponent);
     fixture.detectChanges();
@@ -138,6 +138,7 @@ describe('SharedResizeObserver', () => {
     <div #el1></div>
     <div #el2></div>
   `,
+  standalone: true,
 })
 export class TestComponent {
   @ViewChild('el1') el1: ElementRef<Element>;

tools/public_api_guard/cdk/observers.md

@@ -28,7 +28,7 @@ export class CdkObserveContent implements AfterContentInit, OnDestroy {
     // (undocumented)
     ngOnDestroy(): void;
     // (undocumented)
-    static ɵdir: i0.ɵɵDirectiveDeclaration<CdkObserveContent, "[cdkObserveContent]", ["cdkObserveContent"], { "disabled": { "alias": "cdkObserveContentDisabled"; "required": false; }; "debounce": { "alias": "debounce"; "required": false; }; }, { "event": "cdkObserveContent"; }, never, never, false, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<CdkObserveContent, "[cdkObserveContent]", ["cdkObserveContent"], { "disabled": { "alias": "cdkObserveContentDisabled"; "required": false; }; "debounce": { "alias": "debounce"; "required": false; }; }, { "event": "cdkObserveContent"; }, never, never, true, never>;
     // (undocumented)
     static ɵfac: i0.ɵɵFactoryDeclaration<CdkObserveContent, never>;
 }
@@ -63,7 +63,7 @@ export class ObserversModule {
     // (undocumented)
     static ɵinj: i0.ɵɵInjectorDeclaration<ObserversModule>;
     // (undocumented)
-    static ɵmod: i0.ɵɵNgModuleDeclaration<ObserversModule, [typeof CdkObserveContent], never, [typeof CdkObserveContent]>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<ObserversModule, never, [typeof CdkObserveContent], [typeof CdkObserveContent]>;
 }
 
 // (No @packageDocumentation comment for this package)