Mastering Web Element Location with CSS and XPath
Fragile selectors make web tests difficult to maintain. Use CSS and XPath to identify page elements more precisely. Develop a location method that supports script reliability and adaptation to interface changes.
- Duration
- 1 day 7 hours
- Code
- DEV005-FR Code
Presentation
UI test automation has become essential to web application quality. However, successful automation projects depend largely on your ability to locate elements precisely on a web page.
This intensive course explores element location techniques using CSS and XPath, two essential languages in this field. In one day, you will gain the foundations to:
- Understand the underlying mechanisms: decode a web page’s structure and identify different element types.
- Master targeting languages: use CSS and XPath syntax to select the required elements precisely.
- Optimise automation scripts: write robust, efficient scripts by targeting elements reliably.
The program is intended for all testers and web developers wishing to start automation or improve existing skills. Mastering these concepts saves valuable time and significantly reduces false alarms.
Objectives
By the end of this course, you will be able to:
- understand the principles of locating web elements;
- identify and select all types of HTML elements;
- use CSS and XPath selectors to interact with web page elements;
- use locators in automated tests.
Program
1. Introduction to element location fundamentals
- What is web element location?
- Why is it crucial in development and automated testing?
- Selectors:
- definition, role and different selector types.
- Basic HTML elements:
- the structure of an HTML page;
- different element types and their attributes.
2. Understanding the XPath query language
- Introduction to XPath:
- basic syntax;
- different node types;
- axes and predicates.
Practical work
- Locate elements with XPath to practise building effective XPath expressions.
- Solve common XPath problems.
- Use a Chrome/Firefox extension to test XPath expressions on a web page in real time.
3. Understanding the CSS style language
- Introduction to CSS:
- CSS selectors;
- CSS properties;
- the cascade.
Practical work
- Locate elements with CSS.
- Compare CSS with XPath.
- Write efficient, maintainable CSS selectors and avoid common pitfalls.
- Use a Chrome/Firefox extension to test CSS selectors on a web page in real time.
Module 4: test automation
Practical work
- Use XPath and CSS to automate tests.
- Select a testing tool, such as Selenium or Cypress, and write practical tests.
Audience
This course is intended for:
- project managers;
- functional testers;
- people moving into QA careers;
- business analysts and QA analysts.
Prerequisites
This course has no prerequisites.
Teaching and assessment methods
- Initial skills assessment
- Training materials provided to participants
- Continuous assessment throughout the course
- End-of-course feedback questionnaire
- Combination of theory and practical application
- Attendance records
- Post-course follow-up evaluation
- Practical exercises
Course highlights
• An introduction to user interface automation fundamentals.
• Essential foundational knowledge for continuing your test automation learning journey.
• Foundation training for further courses on development tools and technologies, including Robot Framework and Cypress.
Dates and sessions
Choose the date and delivery format that suit you.
No upcoming sessions are currently available.
fr
en