AngularJS - e2e testing - Why does this by.css selector work? -
So I'm starting to break in javascript (& amp; jQuery) background in AngularJS; I'm vying through the tutorial I love it, and the way in which it is established. I am currently watching and I do not understand what works of a piece of code that I have tried to googling and poking through the document ... The launcher docs also do not feel anything for KC I could not understand how to search very briefly: / ... sorry if I'm just making it clear with some seriousness.
The code in the E2A test scenario is:
('The main image should be swapped upon clicking on the thumbnail image', function () (element ( By (CSS. '(Phone: thumbs li: nth-child (3) img')). Click (); hope (element (by.css ('img.phone')) GetAttribute ('Src')). ToMatch (/img\/phones\/nexus-s.2.jpg/); Elements (By CSS ('Phone-Thumbs li: nth-child (1) img')) Click (); Expect (element (Via 'img.phone') getAttribute ('src')). ToMatch (/img\/phones\/nexus-s.0.jpg/);});
< P> which works on this page-html: & lt; Ul class = "phone-thumbs ng-scope" & gt; li ng- repeat = "img in phone.images" class = "ng-scope"> lt; img ng-src = "img / Phones / nexus-s.0.jpg "ng-click =" set image (img) "src =" img / phone / Nexus-S.Z.JPG "> This generated by NG-Markup
:
& lt; ul class = "phone-thumbs" & gt; & lt; Li ng- repeat = "img in phone.images" & gt; & Lt; Img ng-src = "{{img}}" ng-click = "set image (img)" & gt; & Lt; / Li & gt; & Lt; / Ul & gt;
I do not know why the element (by.css ('img.phone')) is functional. Based on the selector (and coming from jQuery) I expect to see a 'phone' class on the images ... but it's not there. Is the '.phone' reference something else?
I can see that .phone 'removal of part' ..... Alert: More than one element meet for locator. CSSSLactor ("IMG") - you may need to be more specific ', so how' specificity is provided '.phone "
thanks, Ben
You are just looking in the wrong place:
Checking to click on this thumbnail
// app / partials / phone-detail.html (line 9): & lt; Img ng-src = "{{img}}" ng-click = "set image (img)" & gt;
Creates this image:
// app / partials / phone-detail.html (line1): & lt; Img ng-src = "{{MainImageUrl}}" class = "phone" & gt;
Change the source of it img.phone
is what you want. Documents for
by.css
are here:
Comments
Post a Comment