कोणीय: एकीकरण परीक्षण (उथला परीक्षण)

• मोक्स विभिन्न उपयोग-मामलों में प्रतिक्रियाओं का अनुकरण करने के लिए ऑब्जेक्ट हैं।
• स्टब्स बिना तर्क के सबसे बेवकूफ स्टब्स हैं (आप मार्टिन को पढ़ सकते हैं)।
• कर्म एक परीक्षण धावक है जिसे कोणीय में बनाया जाता है (अक्सर इसके बजाय, लेकिन आज के बारे में नहीं बल्कि जेस्ट का उपयोग करने की सलाह दी जाती है)।
• चमेली चश्मे के रूप में परीक्षण का वर्णन करने के लिए एक रूपरेखा है (नीचे देखें)।
• युक्ति - परीक्षण फ़ाइल एक्सटेंशन (BDD शैली में विनिर्देश विवरण)।
• यह जैस्मीन में परीक्षणों के लिए विधियों का नाम है।
• xit उन विधियों का नाम है जो नहीं चलेंगी।
• फिट - अगर ऐनक में एक ही नाम के तरीके हैं, तो केवल उन्हें लॉन्च किया जाएगा।

export class PageObjectBase {

  constructor(private root: HTMLDivElement) { }
  //    input  
  _inputValue(cssSelector: string, value: string) { 
    if (value) {
      this.root.querySelector<HTMLInputElement>(cssSelector).value = value;
      this.root.querySelector<HTMLInputElement>(cssSelector).dispatchEvent(new Event('input'));
    }
    else {
      return this.root.querySelector<HTMLInputElement>(cssSelector).value
    }
  }
  //          
  _buttonClick(cssSelector: string) {
    this.root.querySelector<HTMLButtonElement>(cssSelector).dispatchEvent(new Event('click'));
  }

}

export class ConverterFromHexPageObject extends PageObjectBase {

  constructor(root: HTMLDivElement) {
    super(root)
  }

  hex(text?: string) {
    return this._inputValue('.input-hex', text);
  }

  rgb(text?: string) {
    return this._inputValue('.input-rgb', text);
  }

  clear() {
    this._buttonClick('.btn-clear')
  }

  calc() {
    this._buttonClick('.btn-calc')
  }

}

// ,        api   
const urlToSave = 'http://localhost:4200/save-hex';


//  -   
describe('ConverterFromHexComponent', () => {
  let component: ConverterFromHexComponent;
  let fixture: ComponentFixture<ConverterFromHexComponent>;
  let page: ConverterFromHexPageObject;
  let httpTestingController: HttpTestingController;


  //      ,   
  beforeEach(async(() => {
    TestBed.configureTestingModule({
      imports: [ConverterModule, HttpClientTestingModule]
    })
      .compileComponents();
    httpTestingController = TestBed.get(HttpTestingController);
  }));


  //  ,   
  beforeEach(() => {
    fixture = TestBed.createComponent(ConverterFromHexComponent);
    component = fixture.componentInstance;
    page = new ConverterFromHexPageObject(fixture.nativeElement);
    fixture.detectChanges();
  });


  //    ,     http 
  afterEach(() => {
    httpTestingController.verify();
  });

  it('should create', () => {
    expect(component).toBeTruthy();
  });

  it('should clear', async () => {
    page.hex('112233'); //  input  
    expect(page.hex()).toBe('112233'); // ,    
    await page.clear(); //      
    fixture.detectChanges(); //    
    expect(page.hex()).toBe(''); // ,   clear 
  });

  it('should convert', async () => {
    page.hex('123123');
    expect(page.rgb()).toBe('');
    page.calc();
    const req = httpTestingController.expectOne(urlToSave);
    expect(req.request.method).toEqual('POST');
    expect(req.request.body.hex).toEqual('123123');
    req.flush({});
    await fixture.detectChanges();
    expect(page.rgb()).toBe('rgb(18, 49, 35)');
  });

  it('should convert three-digit hex', async () => {
    page.hex('567');
    expect(page.rgb()).toBe('');
    page.calc();
    const req = httpTestingController.expectOne(urlToSave);
    expect(req.request.method).toEqual('POST');
    req.flush({});
    await fixture.detectChanges();
    expect(page.rgb()).toBe('rgb(85, 102, 119)');
  });

  it('rgb should be empty when entered incorrectly hex', async () => {
    page.hex('qw123we');
    page.calc();
    const req = httpTestingController.expectNone(urlToSave);
    await fixture.detectChanges();
    expect(page.rgb()).toBe('');
  });

});

• हमेशा जांच लें कि कोई अनौपचारिक http अनुरोध नहीं हैं, इससे आपको यह समझने में मदद मिलेगी कि क्या हमारी कार्यक्षमता के लिए कोई अनावश्यक अनुरोध हैं।
• PageObject , .
• json , .
• , .
• .
• .
• , session, local, cookie ( ).
• fake.js.
• .