2016-11-22 1 views
0

In einer weiteren spannenden Folge von "Was machst du, tbm?", Habe ich einen Test, der (zugegebenermaßen ging es vor [Änderungen] aber jetzt) ​​scheitert eine scheinbare Klasse ist anwesend, trotz aller Bemühungen, das Gegenteil zu beweisen.Angular hasClass gibt true zurück, obwohl die Klasse nicht vorhanden ist

Kontext:

Eine Liste der Teilnehmer gezeigt, von denen jede bewertet werden kann oder gekerbt. Innerhalb eines Teilnehmers werden die zugehörigen (nach Kategorie) Teilnehmer in einer Zusammenfassung angezeigt. Eine Zusammenfassung des Teilnehmers wird nicht angezeigt, bis der Teilnehmer selbst über seine eigene div bewertet wurde. Dieser Test überprüft dieses Verhalten.

Test:

it('related items are hidden until scored', function() { 

    expect(judgeService.entrants[2].rating.score).toBe(0); 

    var other = angular.element(element.find('.competition')[0]); 
    var score_container = other.find('div > div'); 
    expect(score_container.hasClass('ng-hide')).toBe(true); 

    judgeService.entrants[2].rating.score = 3; 
    scope.$digest(); 

    // We'll refer to this later 
    console.log('HTML: ' + other.html()); 
    console.log('CLASS: ' + score_container.attr('class')); 

    // failure here 
    expect(score_container.hasClass('ng-hide')).toBe(false); 
}); 

HTML:

 <div class="competition" 
      ng-repeat="other in item.related"> 
      <div> 
       {{ other.name }}<br/> 
       <!-- this becomes the div > div in the test --> 
       <score-block item="other" ng-show="other.rating.score"></score-block> 
      </div> 
     </div> 

Ausgang:

LOG: 'HTML: 
      <div class="ng-binding"> 
       Andres<br> 
       <div class="ng-isolate-scope" ng-class="{error: vm.error}" item="other" ng-show="other.rating.score"> 
[ skippy bits ]' 

LOG: 'CLASS: ng-isolate-scope' 

Also, ja, ist die Klasse auf das Element nicht vorhanden ist .. also warum tut hasClass () denke es ist?

[Änderungen]

Per git bisect, die Änderung, die den Test verursacht zu starten waren in einer nicht verwandten Richtlinie scheitern. Aber selbst wenn die Änderung direkt damit zusammenhängt, kann ich nicht erkennen, wie jeder außer hasClass() die Klasse als abwesend meldet.

Update:

Graben durch die Jquery-Code (hasClass() verwendet jquery falls installiert) scheint es, dass element.hasClass ("foo") true zurück, wenn eine der untergeordneten Elemente des Elements die Klasse hat " foo ", auch wenn das Element selbst nicht funktioniert. WTF, Jquery?

Antwort

0

Offenbar wird dies durch den Selektor 'div> div' verursacht, der vom übergeordneten Element in ein untergeordnetes Objekt mit der Klasse ng-hide zurückspringt.

Das Update:

var score_container = other.find('div > div').eq(0); 
Verwandte Themen