Angular 2 testing nativesElement

Question

Ich habe das Test-Tutorial auf der eckigen Website durchgelaufen. Ich bin neugierig, ob es eine Liste aller Elemente gibt, die für den Test über das debugElement verfügbar sind. Zum Beispiel

let nav = fixture.debugElement.query(By.css('h1')).nativeElement; 

    expect(nav.innerText).toBe(fixture.componentInstance.homeHeader); 

Welche anderen Elemente gibt es wie der InnerText-Wert, den ich testen. Vielen Dank für Ihre Hilfe.

Answer 1

Die Liste ist zu lang. Dies sind native JS-DOM-Elemente. Es hängt davon ab, um welches Typelement es sich handelt, um eine vollständige Liste der Eigenschaften zu erhalten. Sie sollten lernen, auf der MDN-Site zu navigieren. Hier ist ein Link zu HTMLHeadingElement (das ist, was ein h1 ist). Wenn Sie auf der Seitenleiste sehen, sehen Sie

• Eigenschaften (von HTMLHeadingElement fehlt, siehe unten). Dies ist eine Liste aller direkten Eigenschaften dieses Elements (siehe übergeordnete Eigenschaft für geerbte Eigenschaften)

• Vererbung. Dies ist die Hierarchie Vererbung für HTMLHeadingElement

  EventTarget 
       | 
       Node 
       | 
      Element 
       | 
      HTMLElement 
       | 
  HTMLHeadingElement 
  

  Sie können auf eine dieser Verbindungen, und Sie werden die vererbten Eigenschaften sehen. Zum Beispiel, wenn Sie auf Node klicken, werden Sie sehen, dass das ist, wo die HTMLHeadingElement die innerText Eigenschaft von erhält. Wenn Sie zu HTMLHeadingElement zurückkehren, werden Sie sehen, dass es keine direkten Eigenschaften hat. Das bedeutet, dass alle seine Eigenschaften von seinen Eltern

• Methoden vererbt werden (fehlt für HTMLHeadingElement finden Eltern für geerbte Methoden)

• Events. Dies sind alle Ereignisse, die für das Element ausgelöst werden können

• Verwandte Seiten für HTML DOM. Dies ist eine Liste, die allen Seiten gemeinsam ist. Sie können eine Liste aller verschiedenen Arten von DOM-Elementen sehen. Sie können durch sie klicken. In den meisten Fällen werden die meisten Eigenschaften, die Sie aus einem der DOM-Elemente verwenden, geerbte Eigenschaften des übergeordneten Elements sein. Sie möchten wahrscheinlich nur die Liste der übergeordneten Eigenschaften anzeigen. Obwohl einige ihre eigenen Eigenschaften haben.