How to use onDestroy method in ng-mocks

Best JavaScript code snippet using ng-mocks

item-test.js

Source:item-test.js

1import hbs from 'htmlbars-inline-precompile';2import sinon from 'sinon';3import wait from 'ember-test-helpers/wait';4import { moduleForComponent, test } from 'ember-qunit';5moduleForComponent('tab-container/item', 'Integration | Component | tab container/item', {6  integration: true,7});8test('inputs', function(assert) {9  this.setProperties({ fn: sinon.spy() });10  assert.throws(() => this.render(hbs`{{tab-container/item}}`));11  assert.throws(() =>12    this.render(hbs`{{tab-container/item doRegister="hi" onDestroy="hi" title=fn}}`)13  );14  this.render(hbs`{{tab-container/item doRegister=fn onDestroy=fn title="hi"}}`);15  assert.ok(this.$('.tab-container__item').length, 'did render');16});17test('rendering block', function(assert) {18  const done = assert.async(),19    doRegister = sinon.spy(),20    blockVal = Math.random() + '';21  this.setProperties({ doRegister, fn: sinon.spy(), blockVal });22  this.render(hbs`23    {{#tab-container/item doRegister=doRegister onDestroy=fn}}24      {{blockVal}}25    {{/tab-container/item}}26  `);27  assert.ok(this.$('.tab-container__item').length, 'did render');28  assert.notOk(29    this.$()30      .text()31      .includes(blockVal),32    'do not render initially'33  );34  assert.ok(doRegister.calledOnce);35  doRegister.firstCall.args[0].actions.show().then(() => {36    wait().then(() => {37      assert.ok(38        this.$()39          .text()40          .includes(blockVal),41        'after initializing or calling show, item is rendered'42      );43      done();44    });45  });46});47test('register and destroy', function(assert) {48  const doRegister = sinon.spy(),49    onDestroy = sinon.spy();50  this.setProperties({ doRegister, onDestroy });51  this.render(hbs`{{tab-container/item doRegister=doRegister onDestroy=onDestroy}}`);52  assert.ok(this.$('.tab-container__item').length, 'did render');53  assert.ok(doRegister.calledOnce);54  this.render(hbs``);55  assert.ok(onDestroy.calledOnce);56});57test('public api actions', function(assert) {58  const doRegister = sinon.spy(),59    onDestroy = sinon.spy(),60    done = assert.async();61  this.setProperties({ doRegister, onDestroy });62  this.render(hbs`{{tab-container/item doRegister=doRegister onDestroy=onDestroy}}`);63  assert.ok(this.$('.tab-container__item').length, 'did render');64  assert.ok(this.$('.tab-container__item.tab-container__item--pending').length, 'is pending');65  assert.ok(doRegister.calledOnce);66  const publicAPI = doRegister.firstCall.args[0];67  publicAPI.actions.initialize(false); // init and hide68  setTimeout(() => {69    assert.notOk(this.$('.tab-container__item.tab-container__item--pending').length, 'not pending');70    assert.notOk(this.$('.tab-container__item:visible').length, 'not visible');71    assert.ok(this.$('.tab-container__item:hidden').length, 'IS hidden');72    publicAPI.actions.initialize(true); // init and show73    setTimeout(() => {74      assert.notOk(75        this.$('.tab-container__item.tab-container__item--pending').length,76        'not pending'77      );78      assert.ok(this.$('.tab-container__item:visible').length, 'IS visible');79      assert.notOk(this.$('.tab-container__item:hidden').length, 'not hidden');80      done();81    }, 500);82  }, 500);83});84test('title will dynamically update', function(assert) {85  const doRegister = sinon.spy(),86    onDestroy = sinon.spy(),87    title1 = Math.random() + '',88    title2 = Math.random() + '',89    done = assert.async();90  this.setProperties({ doRegister, onDestroy, title: title1 });91  this.render(hbs`{{tab-container/item doRegister=doRegister onDestroy=onDestroy title=title}}`);92  assert.ok(this.$('.tab-container__item').length, 'did render');93  assert.ok(doRegister.calledOnce);94  const publicAPI = doRegister.firstCall.args[0];95  assert.equal(publicAPI.title, title1);96  this.set('title', title2);97  wait().then(() => {98    assert.equal(publicAPI.title, title2);99    done();100  });...

destroy.test.ts

Source:destroy.test.ts

...16  let ent!: Entity;17  createRoot(() => {18    ent = useChild(() => {19      const { onDestroy } = useDestroy();20      onDestroy(() => log("onDestroy in component"));21    });22  });23  ent.destroy();24  expect(messages).toEqual(["onDestroy in component"]);25});26test("onDestroy in component, destroy from component", () => {27  createRoot(() => {28    useChild(() => {29      const { onDestroy, destroy } = useDestroy();30      onDestroy(() => log("onDestroy in component"));31      destroy();32    });33  });34  expect(messages).toEqual(["onDestroy in component"]);35});36test("children are destroyed depth-first", () => {37  let ent!: Entity;38  createRoot(() => {39    ent = useChild(() => {40      const { onDestroy } = useDestroy();41      onDestroy(() => log("onDestroy in component"));42      useChild(() => {43        const { onDestroy } = useDestroy();44        onDestroy(() => log("onDestroy in child"));45        useChild(() => {46          const { onDestroy } = useDestroy();47          onDestroy(() => log("onDestroy in grandchild"));48        });49      });50    });51  });52  ent.destroy();53  expect(messages).toEqual([54    "onDestroy in grandchild",55    "onDestroy in child",56    "onDestroy in component",57  ]);58});59test("child destroy doesn't destroy parent", () => {60  let ent!: Entity;61  createRoot(() => {62    useChild(() => {63      const { onDestroy } = useDestroy();64      onDestroy(() => log("onDestroy in component"));65      ent = useChild(() => {66        const { onDestroy } = useDestroy();67        onDestroy(() => log("onDestroy in child"));68        useChild(() => {69          const { onDestroy } = useDestroy();70          onDestroy(() => log("onDestroy in grandchild"));71        });72      });73    });74  });75  ent.destroy();76  expect(messages).toEqual(["onDestroy in grandchild", "onDestroy in child"]);77});78test("destroy disables", () => {79  let ent!: Entity;80  createRoot(() => {81    ent = useChild(() => {82      const { onDestroy } = useDestroy();83      onDestroy(() => log("onDestroy in component"));84      const { onDisabled } = useEnableDisable();85      onDisabled(() => log("component disabled"));86      useChild(() => {87        const { onDestroy } = useDestroy();88        onDestroy(() => log("onDestroy in child"));89        const { onDisabled } = useEnableDisable();90        onDisabled(() => log("child disabled"));91        useChild(() => {92          const { onDestroy } = useDestroy();93          onDestroy(() => log("onDestroy in grandchild"));94          const { onDisabled } = useEnableDisable();95          onDisabled(() => log("grandchild disabled"));96        });97      });98    });99  });100  ent.destroy();101  expect(messages).toEqual([102    "grandchild disabled",103    "onDestroy in grandchild",104    "child disabled",105    "onDestroy in child",106    "component disabled",107    "onDestroy in component",108  ]);109});110test("destroy from component A runs onDestroy in sibling component", () => {111  let ent!: Entity;112  createRoot(() => {113    ent = useChild(() => {114      const { onDestroy, destroy } = useDestroy();115      onDestroy(() => log("onDestroy in component"));116      useNewComponent(() => {117        const { onDestroy } = useDestroy();118        onDestroy(() => log("onDestroy in other component"));119      });120      return {121        boom: useCallbackAsCurrent(destroy),122      };123    });124  });125  // @ts-ignore126  ent.rootComponent.boom();127  expect(messages).toEqual([128    "onDestroy in component",129    "onDestroy in other component",130  ]);...

Controls.ts

Source:Controls.ts

1/**2 * Copyright (c) Tiny Technologies, Inc. All rights reserved.3 * Licensed under the LGPL or a commercial license.4 * For LGPL see License.txt in the project root for license information.5 * For commercial licenses see https://www.tiny.cloud/6 */7import { AlloyComponent, AlloyEvents } from '@ephox/alloy';8import { Cell } from '@ephox/katamari';9export interface GetApiType<T> {10  getApi: (comp: AlloyComponent) => T;11}12export type OnDestroy<T> = (controlApi: T) => void;13export interface OnControlAttachedType<T> extends GetApiType<T> {14  onSetup: (controlApi: T) => OnDestroy<T>; // TODO: check: no change here?15}16const runWithApi = <T>(info: GetApiType<T>, comp: AlloyComponent) => {17  const api = info.getApi(comp);18  return (f: OnDestroy<T>) => {19    f(api);20  };21};22const onControlAttached = <T>(info: OnControlAttachedType<T>, editorOffCell: Cell<OnDestroy<T>>) => {23  return AlloyEvents.runOnAttached((comp) => {24    const run = runWithApi(info, comp);25    run((api) => {26      const onDestroy = info.onSetup(api);27      if (onDestroy !== null && onDestroy !== undefined) {28        editorOffCell.set(onDestroy);29      }30    });31  });32};33const onControlDetached = <T>(getApi: GetApiType<T>, editorOffCell: Cell<OnDestroy<T>>) => {34  return AlloyEvents.runOnDetached((comp) => runWithApi(getApi, comp)(editorOffCell.get()));35};...

Using AI Code Generation

1describe('TestComponent', () => {2  let component: TestComponent;3  let fixture: ComponentFixture<TestComponent>;4  beforeEach(async(() => {5    TestBed.configureTestingModule({6    })7      .compileComponents();8  }));9  beforeEach(() => {10    fixture = TestBed.createComponent(TestComponent);11    component = fixture.componentInstance;12    fixture.detectChanges();13  });14  it('should create', () => {15    expect(component).toBeTruthy();16  });17  afterEach(() => {18    ngMocks.destroy(component);19  });20});21import { Component, OnInit, OnDestroy } from '@angular/core';22@Component({23})24export class TestComponent implements OnInit, OnDestroy {25  constructor() { }26  ngOnInit() {27  }28  ngOnDestroy() {29  }30}31div {32  h1 {33    color: blue;34  }35}36import { async, ComponentFixture, TestBed } from '@angular/core/testing';37import { TestComponent } from './test.component';38import { ngMocks } from 'ng-mocks';39describe('TestComponent', () => {40  let component: TestComponent;41  let fixture: ComponentFixture<TestComponent>;42  beforeEach(async(() => {43    TestBed.configureTestingModule({44    })45      .compileComponents();46  }));47  beforeEach(() => {48    fixture = TestBed.createComponent(TestComponent);49    component = fixture.componentInstance;50    fixture.detectChanges();51  });52  it('should create', () => {53    expect(component).toBeTruthy();54  });55  afterEach(() => {56    ngMocks.destroy(component);57  });58});59import { Component, OnInit, OnDestroy } from '@angular/core';60@Component({61})62export class TestComponent implements OnInit, OnDestroy {63  constructor() { }64  ngOnInit() {65  }66  ngOnDestroy() {67  }68}

Using AI Code Generation

1import { MockBuilder, MockRender, ngMocks } from 'ng-mocks';2import { AppModule } from './app.module';3import { AppComponent } from './app.component';4describe('AppComponent', () => {5  beforeEach(() => MockBuilder(AppComponent, AppModule));6  it('should create the app', () => {7    const fixture = MockRender(AppComponent);8    const app = fixture.point.componentInstance;9    expect(app).toBeTruthy();10  });11  it('should call ngOnDestroy', () => {12    const fixture = MockRender(AppComponent);13    const app = fixture.point.componentInstance;14    const spy = spyOn(app, 'ngOnDestroy');15    ngMocks.destroy(fixture.point);16    expect(spy).toHaveBeenCalled();17  });18});19import { Component, OnDestroy } from '@angular/core';20@Component({21})22export class AppComponent implements OnDestroy {23  title = 'ng-mocks-demo';24  ngOnDestroy(): void {25    console.log('ngOnDestroy called');26  }27}28import { Component, OnDestroy } from '@angular/core';29@Component({30})31export class ChildComponent implements OnDestroy {32  ngOnDestroy(): void {33    console.log('ngOnDestroy called in child component');34  }35}36import { NgModule } from '@angular/core';37import { BrowserModule } from '@angular/platform-browser';38import { AppComponent } from './app.component';39import { ChildComponent } from './child.component';40@NgModule({41  imports: [42})43export class AppModule { }

Using AI Code Generation

1import { MockBuilder, MockRender } from 'ng-mocks';2import { MyComponent } from './my.component';3import { MyModule } from './my.module';4describe('MyComponent', () => {5  beforeEach(() => MockBuilder(MyComponent, MyModule));6  it('should create', () => {7    const fixture = MockRender(MyComponent);8    const component = fixture.point.componentInstance;9    expect(component).toBeTruthy();10  });11  it('should destroy', () => {12    const fixture = MockRender(MyComponent);13    const component = fixture.point.componentInstance;14    component.ngOnDestroy();15    expect(component).toBeTruthy();16  });17});18import { Component, OnDestroy } from '@angular/core';19@Component({20})21export class MyComponent implements OnDestroy {22  ngOnDestroy(): void {23    console.log('ngOnDestroy');24  }25}26import { NgModule } from '@angular/core';27import { CommonModule } from '@angular/common';28import { MyComponent } from './my.component';29@NgModule({30  imports: [CommonModule],31})32export class MyModule {}

Using AI Code Generation

1import { destroy } from 'ng-mocks';2describe('AppComponent', () => {3  let component: AppComponent;4  let fixture: ComponentFixture<AppComponent>;5  beforeEach(async(() => {6    TestBed.configureTestingModule({7    })8    .compileComponents();9  }));10  beforeEach(() => {11    fixture = TestBed.createComponent(AppComponent);12    component = fixture.componentInstance;13    fixture.detectChanges();14  });15  afterEach(() => {16    destroy(component);17  });18  it('should create', () => {19    expect(component).toBeTruthy();20  });21});22import { Component, OnInit, OnDestroy } from '@angular/core';23@Component({24})25export class AppComponent implements OnInit, OnDestroy {26  title = 'app';27  ngOnInit() {28    console.log('onInit');29  }30  ngOnDestroy() {31    console.log('onDestroy');32  }33}34import { ComponentFixture, TestBed, async } from '@angular/core/testing';35import { AppComponent } from './app.component';36import { ChildComponent } from './child/child.component';37describe('AppComponent', () => {38  let component: AppComponent;39  let fixture: ComponentFixture<AppComponent>;40  beforeEach(async(() => {41    TestBed.configureTestingModule({42    })43    .compileComponents();44  }));45  beforeEach(() => {46    fixture = TestBed.createComponent(AppComponent);47    component = fixture.componentInstance;48    fixture.detectChanges();49  });50  it('should create', () => {51    expect(component).toBeTruthy();52  });53});54import { Component, OnInit, OnDestroy } from '@angular/core';55@Component({56})57export class ChildComponent implements OnInit, OnDestroy {58  title = 'child';59  ngOnInit() {60    console.log('child onInit');61  }62  ngOnDestroy() {63    console.log('child onDestroy');64  }65});66import { ComponentFixture, TestBed, async } from '@angular/core/testing';67import { ChildComponent } from './child.component';68import { GrandChildComponent } from '../grand-child/grand

Using AI Code Generation

1import {ngMocks} from 'ng-mocks';2import {Component} from '@angular/core';3import {TestBed} from '@angular/core/testing';4@Component({5})6class TestComponent {7  public ngOnDestroy(): void {8    console.log('destroyed');9  }10}11describe('TestComponent', () => {12  it('should destroy component', () => {13    const fixture = ngMocks.guts(TestComponent);14    fixture.destroy();15    expect(ngMocks.formatText(fixture.nativeElement)).toEqual('');16  });17});18import {ngMocks} from 'ng-mocks';19import {TestBed} from '@angular/core/testing';20describe('TestComponent', () => {21  it('should destroy component', () => {22    const fixture = ngMocks.guts(TestComponent);23    fixture.destroy();24    expect(ngMocks.formatText(fixture.nativeElement)).toEqual('');25  });26});27import {ngMocks} from 'ng-mocks';28import {TestBed} from '@angular/core/testing';29describe('TestComponent', () => {30  it('should destroy component', () => {31    const fixture = ngMocks.guts(TestComponent);32    fixture.destroy();33    expect(ngMocks.formatText(fixture.nativeElement)).toEqual('');34  });35});36import {ngMocks} from 'ng-mocks';37import {TestBed} from '@angular/core/testing';38describe('TestComponent', () => {39  it('should destroy component', () => {40    const fixture = ngMocks.guts(TestComponent);41    fixture.destroy();42    expect(ngMocks.formatText(fixture.nativeElement)).toEqual('');43  });44});45import {ngMocks} from 'ng-mocks';46import {TestBed} from '@angular/core/testing';47describe('TestComponent', () => {48  it('should destroy component', () => {49    const fixture = ngMocks.guts(TestComponent);50    fixture.destroy();51    expect(ngMocks.formatText(fixture.nativeElement)).toEqual('');52  });53});54import {ngMocks} from 'ng-mocks';55import {TestBed} from '@angular/core/testing';

Using AI Code Generation

1import { MockBuilder, MockInstance, MockRender } from 'ng-mocks';2import { MyComponent } from './my.component';3import { MyService } from './my.service';4beforeEach(() => MockBuilder(MyComponent)5  .mock(MyService, {6    onDestroy: () => console.log('destroyed'),7  })8);9it('is destroyed', () => {10  const fixture = MockRender(MyComponent);11  fixture.destroy();12});13import 'zone.js/dist/zone-testing';14import { getTestBed } from '@angular/core/testing';15import {16} from '@angular/platform-browser-dynamic/testing';17getTestBed().initTestEnvironment(18  platformBrowserDynamicTesting(),19);20import { MockBuilder, MockRender } from 'ng-mocks';21import { MyComponent } from './my.component';22import { MyService } from './my.service';23beforeEach(() => MockBuilder(MyComponent)24  .mock(MyService, {25    onDestroy: () => console.log('destroyed'),26  })27);28it('is destroyed', () => {29  const fixture = MockRender(MyComponent);30  fixture.destroy();31});32import { MockBuilder, MockRender } from 'ng-mocks';33import { MyComponent } from './my.component';34import { MyService } from './my.service';35beforeEach(() => MockBuilder(MyComponent)36  .mock(MyService, {37    onDestroy: () => console.log('destroyed'),38  })39);40it('is destroyed', () => {41  const fixture = MockRender(MyComponent);42  fixture.destroy();43});44import { MockBuilder, MockRender } from 'ng-mocks';45import { MyComponent } from './my.component';46import { MyService } from './my.service';47beforeEach(() => MockBuilder(MyComponent)48  .mock(MyService, {49    onDestroy: () => console.log('destroyed'),50  })51);52it('is destroyed', () => {53  const fixture = MockRender(MyComponent);54  fixture.destroy();55});56import { MockBuilder, MockRender } from 'ng-mocks';57import { MyComponent } from './my.component';58import { MyService } from

Using AI Code Generation

1describe('Component: TestComponent', () => {2  let component: TestComponent;3  let fixture: ComponentFixture<TestComponent>;4  let mock: MockRenderResult<TestComponent>;5  beforeEach(() => {6    mock = MockRender(TestComponent);7    component = mock.point.componentInstance;8    fixture = mock.point.fixture;9  });10  it('should set value to true', () => {11    component.value = true;12    expect(component.value).toBeTruthy();13  });14  afterEach(() => {15    mock.point.destroy();16  });17});18@Component({19})20export class TestComponent implements OnInit, OnDestroy {21  value = false;22  ngOnInit() {23    console.log('Component initialized');24  }25  ngOnDestroy() {26    console.log('Component destroyed');27  }28}29import { MockRender, MockRenderResult } from 'ng-mocks';30import { TestComponent } from './test.component';31describe('Component: TestComponent', () => {32  let component: TestComponent;33  let fixture: ComponentFixture<TestComponent>;34  let mock: MockRenderResult<TestComponent>;35  beforeEach(() => {36    mock = MockRender(TestComponent);37    component = mock.point.componentInstance;38    fixture = mock.point.fixture;39  });40  it('should set value to true', () => {41    component.value = true;42    expect(component.value).toBeTruthy();43  });44  afterEach(() => {45    mock.point.destroy();46  });47});48@Component({49})50export class TestComponent implements OnInit, OnDestroy {51  value = false;52  ngOnInit() {53    console.log('Component initialized');54  }55  ngOnDestroy() {56    console.log('Component destroyed');57  }58}59import { MockRender, MockRenderResult } from 'ng-mocks';60import { TestComponent } from './test.component';61describe('Component: TestComponent', () => {62  let component: TestComponent;63  let fixture: ComponentFixture<TestComponent>;64  let mock: MockRenderResult<TestComponent>;65  beforeEach(() => {66    mock = MockRender(TestComponent);67    component = mock.point.componentInstance;68    fixture = mock.point.fixture;69  });70  it('should set value to true', () => {71    component.value = true;72    expect(component.value).toBeTruthy();

Using AI Code Generation

1import { destroy } from 'ng-mocks';2import { MyComponent } from './my.component';3import { mockBuilder } from 'ng-mocks';4import { MyModule } from './my.module';5import { MyComponent } from './my.component';6import { mockComponent } from 'ng-mocks';7import { MyComponent } from './my.component';8import { mockDirective } from 'ng-mocks';9import { MyDirective } from './my.directive';10import { mockInstance } from 'ng-mocks';11import { MyService } from './my.service';12import { mockNg } from 'ng-mocks';13import { MyComponent } from './my.component';14import { mockPipe } from 'ng-mocks';15import { MyPipe } from './my.pipe';16import { mockProvider } from 'ng-mocks';17import { MyService } from './my.service';18import { mockRender } from 'ng-mocks';19import { MyComponent } from './my.component';20import { mockReset } from 'ng-mocks';21import { MyComponent } from './my.component';22import { mockService } from 'ng-mocks';23import { MyService } from './my.service';24import { mockStatic } from 'ng-mocks';25import { MyComponent } from './my.component';26import { ngMocks } from 'ng-mocks';27import { MyComponent } from './my.component';28import { ngMocks } from 'ng-mocks';29import { MyComponent } from './my.component';30import { ngMocks } from 'ng-mocks';31import { MyComponent } from './my.component';

Automation Testing Tutorials

Learn to execute automation testing from scratch with LambdaTest Learning Hub. Right from setting up the prerequisites to run your first automation test, to following best practices and diving deeper into advanced test scenarios. LambdaTest Learning Hubs compile a list of step-by-step guides to help you be proficient with different test automation frameworks i.e. Selenium, Cypress, TestNG etc.