Example
import { BrowserModule } from '@angular/platform-browser';
import { CommonModule } from '@angular/common';
import { FormsModule } from '@angular/forms';
import { HttpModule } from '@angular/http';
import { Component, DebugElement } from '@angular/core';
import { dispatchEvent } from "@angular/platform-browser/testing/browser_util";
import { TestBed, ComponentFixture} from '@angular/core/testing';
import {By} from "@angular/platform-browser";
import { MyComponentModule } from 'ng2-my-component';
import { MyComponent } from './my-component';
describe('MyComponent:',()=> {
const template = `
<div>
<my-component type="text" [(ngModel)]="value" name="TestName" size="9" min="3" max="8" placeholder="testPlaceholder" disabled=false required=false></my-component>
</div>
`;
let fixture:any;
let element:any;
let context:any;
beforeEach(() => {
TestBed.configureTestingModule({
declarations: [InlineEditorComponent],
imports: [
FormsModule,
InlineEditorModule]
});
fixture = TestBed.overrideComponent(InlineEditorComponent, {
set: {
selector:"inline-editor-test",
template: template
}})
.createComponent(InlineEditorComponent);
context = fixture.componentInstance;
fixture.detectChanges();
});
it('should change value of the component', () => {
let input = fixture.nativeElement.querySelector("input");
input.value = "Username";
dispatchEvent(input, 'input');
fixture.detectChanges();
fixture.whenStable().then(() => {
//this button dispatch event for save the text in component.value
fixture.nativeElement.querySelectorAll('button')[0].click();
expect(context.value).toBe("Username");
});
});
});
