Empfohlen
Weitere ähnliche Inhalte
Was ist angesagt?
Was ist angesagt? (18)
Andere mochten auch
Ähnlich wie Css selector - BNT 11
Ähnlich wie Css selector - BNT 11 (20)
Kürzlich hochgeladen
Kürzlich hochgeladen (20)
Css selector - BNT 11
- 1. By Dwarika Dhish Mishra Mob- 9999978609 Blog- http://abodeqa.wordpress.com
- 2. CSS CSS stands for Cascading style sheet This language is used to show the look and formatting of documents written in markup language such in HTML or XML CSS pattern matching principles are being used to located element on webpage for further operations. CSS pattern are known as Selector that determines which style is assigned to which element in DOM
- 3. Why CSS Selector in WebDriver CSS selector are faster than Xpath. In CSS selector we can move in forward direction while in Xpath is bidirectional. Due to this CSS selector is faster than Xpath Selenium’s By class also provide cssSelector() method to locate element using CSS Selector
- 4. Some basic CSS Selector By using Absolute path By using relative path By using Class Selector By using ID selector By using attributes selectors By using attributes name selectors By using Pattern matching Nth-child
- 5. CSS selector by using absolute path <html> <body> <form name="loginForm"> <label for="username">UserName: </label> <input type="text" name="username" for="wow" /><br/> <label for="password">Password: </label> <input type="password" name="password" /><br/> <input name="login" type="submit" value="Login" /> </form> </body> </html>
- 6. Continue… Absolute path of username text field would be $$(“html>body>form>input:nth-of-type(1)”) Then in selenium we could find the username text field by using this line of code WebElement username = driver.findElement(By.cssSelector(“html>body>form>input:nth-oftype(1)”));
- 7. Relative path $$(“input[name=username]”) Line of code in WebDriver to locate this element is WebElement username = driver.findElement(By.cssSelector(“input[name=usern ame]”));
- 8. Finding CSS selector using class selector In general we have class as one attribute to HTML tags through which we normally reach to web-element on webpage So CSS selector syntax would be [HTML][dot][value of class attribute] Or [dot][value of class attribute]
- 9. Continue If HTML source code is <input type="text" class="username" for="wow" /><br/> Then CSS Selector should be Input.username Line of WebDriver code used to do action on this element would be WebElement username = driver.findElement(By.cssSelector(“input.username”));
- 10. Finding CSS Selector using ID selector Like Class, Id attribute is also used to find any element uniquely In this case CSS selector syntax would be [HTML tag][hash][value of attribute] Or [hash][value of attribute]
- 11. Continue.. If HTML source code would be <input type="text" id="username" for="wow" /><br/> Then line of WebDriver code would be WebElement username = driver.findElement(By.cssSelector(“input#username”)) ; Or WebElement username = driver.findElement(By.cssSelector(“#username”));
- 12. Finding CSS selector using various attributes If HTML source code would be <input type="text" id="username" for="wow" /><br/> Then CSS selector would be Input[id=username] Line of Webdriver code would be WebElement username = driver.findElement(By.cssSelector(“input#username”)) ;
- 13. Pattern Matching Syntax for Starts with in CSS selector is ^= , CSS Selector would be written like this Input[id^=‘user’] Then it will return input tag with attribute id starting with user.
- 14. Continue.. Syntax for Ends with in CSS selector is $= , CSS Selector would be written like this Input[id$=‘name’] Then it will return input tag with attribute id ending with name word.
- 15. Continue.. Syntax for Ends with in CSS selector is *= , CSS Selector would be written like this Input[id*=‘name’] Then it will return input tag with attribute id containing name word in its value.
- 16. Nth-child[index] Syntax *:nth-child[index] By using this we can find any child of a parent using index of that element. There is another method used in CSS selector is :nth-oftype[index] But this not supported in selenium webdriver.
- 17. Topic of next session Opening various browser and receiving URL in navigation bar of browsers. TestNg java framework in WebDriver and use of its annotations.
- 18. Thank you !!!