fix(ivy): don't throw when attempting to destroy a destroyed ComponentRef (#31022)

Currently in Ivy we throw when attempting to destroy a `ComponentRef` that has been destroyed, however in ViewEngine we didn't which can cause some tests to break. These changes remove the error to match ViewEngine.

These changes resolve FW-1379.

PR Close #31022

packages/core/src/render3/component_ref.ts

@@ -18,7 +18,6 @@ import {ElementRef as viewEngine_ElementRef} from '../linker/element_ref';
 import {NgModuleRef as viewEngine_NgModuleRef} from '../linker/ng_module_factory';
 import {RendererFactory2} from '../render/api';
 import {Sanitizer} from '../sanitization/security';
-import {assertDefined} from '../util/assert';
 import {VERSION} from '../version';
 import {NOT_FOUND_CHECK_ONLY_ELEMENT_INJECTOR} from '../view/provider';
 
@@ -258,13 +257,16 @@ export class ComponentRef<T> extends viewEngine_ComponentRef<T> {
   get injector(): Injector { return new NodeInjector(this._tNode, this._rootLView); }
 
   destroy(): void {
-    ngDevMode && assertDefined(this.destroyCbs, 'NgModule already destroyed');
+    if (this.destroyCbs) {
-    this.destroyCbs !.forEach(fn => fn());
+      this.destroyCbs.forEach(fn => fn());
-    this.destroyCbs = null;
+      this.destroyCbs = null;
-    !this.hostView.destroyed && this.hostView.destroy();
+      !this.hostView.destroyed && this.hostView.destroy();
+    }
   }
+
   onDestroy(callback: () => void): void {
-    ngDevMode && assertDefined(this.destroyCbs, 'NgModule already destroyed');
+    if (this.destroyCbs) {
-    this.destroyCbs !.push(callback);
+      this.destroyCbs.push(callback);
+    }
   }
 }

packages/core/test/acceptance/view_container_ref_spec.ts

@@ -1035,6 +1035,20 @@ describe('ViewContainerRef', () => {
           .toEqual(
               '<p vcref=""></p><embedded-cmp-with-ngcontent>12<hr>34</embedded-cmp-with-ngcontent>');
     });
+
+    it('should not throw when calling destroy() multiple times for a ComponentRef', () => {
+      @Component({template: ''})
+      class App {
+      }
+
+      TestBed.configureTestingModule({declarations: [App]});
+      const fixture = TestBed.createComponent(App);
+      fixture.detectChanges();
+
+      fixture.componentRef.destroy();
+      expect(() => fixture.componentRef.destroy()).not.toThrow();
+    });
+
   });
 
   describe('insertion points and declaration points', () => {
@@ -1061,7 +1075,7 @@ describe('ViewContainerRef', () => {
           <ng-template #foo>
             <div>{{name}}</div>
           </ng-template>
-          
+
           <child [tpl]="foo"></child>
         `
       })
@@ -1105,10 +1119,10 @@ describe('ViewContainerRef', () => {
             <ng-template #cellTemplate let-cell>
               <div>{{cell}} - {{row.value}} - {{name}}</div>
             </ng-template>
-            
+
             <loop-comp [tpl]="cellTemplate" [rows]="row.data"></loop-comp>
           </ng-template>
-          
+
           <loop-comp [tpl]="rowTemplate" [rows]="rows"></loop-comp>
         `,
       })
@@ -1401,7 +1415,7 @@ describe('ViewContainerRef', () => {
           <ng-template #foo>
             <span>{{name}}</span>
           </ng-template>
-          
+
           <child>
             <header vcref [tplRef]="foo" [name]="name">blah</header>
           </child>`
@@ -1780,7 +1794,7 @@ class ConstructorDir {
 
 @Component({
   selector: 'constructor-app',
-  template: `    
+  template: `
     <div *constructorDir>
       <span *constructorDir #foo></span>
     </div>