XPATH and CSS locators + bonus: using ChatGPT for locators

Explore locators, their types, and why they matter in test automation; learn to identify and verify elements, compare absolute and relative locators, and understand the head-on model.

Open your browser, press F12, and use Chrome DevTools to find element locators. Copy XPath or CSS selectors, verify them in the console, and learn to optimize for stability.

Practice locating and verifying XPath and CSS locators for highlighted screen elements using Chrome DevTools, by coordinating five experts to assess each locator and exploring ChatGPT for locators.

Explore the document object model, its elements and attributes, and the tree structure of a page. Learn the basics of XPath and CSS locators and how ChatGPT assists locator tasks.

Master building an absolute locator from the root node to pinpoint web elements, using dollar sign and slash, and understand its placement among absolute and a.T.M. locator types.

Master converting five absolute xpath locators into relative ones using Chrome DevTools, emphasizing readable, maintainable selectors and practical guidelines from the lesson on absolute vs relative paths.

Master XPath and CSS locators by attribute and text, using text functions and logical operators; build simple //-based patterns and find all elements sharing an attribute, plus a ChatGPT bonus.

Master xpath and css locators by searching by attribute, analyzing dev tools, and refining paths from root to a single element, with steps to shorten and validate locators.

Learn to locate elements by attribute with exact values and the contains function to handle dynamic ids. Practice updating locators to use stable value parts.

Learn to search by text with XPath and CSS locators, using text() and contains() to build stable, reusable locators for dynamically generated or long attributes.

Learn how to locate a single element among many by using text-based matching and index-based arrays in XPath and CSS selectors.

Learn to locate elements by attribute starts-with in XPath, combining static beginnings with dynamic endings for robust locators. Use a placeholder attribute to match user greetings in inputs.

Practice practical xpath and css locators for web elements, using starts-with and other basic checks, and explore workarounds and chatgpt-assisted strategies when some features aren’t supported.

Learn to locate web elements with XPath using text() and starts-with, handling static and dynamic text, and explore how ChatGPT can assist in crafting reliable locators for CSS and XPath.

Learn how to apply the and operator to combine attributes in a locator, such as name and autocomplete, and verify additional properties like placeholder for a single element.

Apply the or logical operator to provide alternative attributes for locating elements, enabling matches when the first suggestion varies by case or value, or when either condition is true.

Explore XPath axes to navigate the document structure, learning how to move to child, parent, and sibling elements, and uncover other features of the expert.

Use the following axis to select every element in a document after the current node, find all links, and identify elements like a login text to understand XPath navigation.

Explore the following axis to locate all elements after a span, including siblings and descendants, and use index-based selection to pick the first matching link in the original document.

Discover how to use the preceding axis in XPath to locate elements that come before a target, returning seven elements before the login button and highlighting links in the DOM.

Use the ancestor axis to locate the parent and grandparent elements of a target element, enabling interaction and text retrieval. Apply this to dropdown menus to count items.

Select all child elements with xpath and css locators, focusing on script elements that are children of the body, and apply child and child-of patterns using body with slash notation.

Learn how the following-sibling axis in XPath locates elements after the current node, using a head parent context, and explore the related preceding-sibling axis for elements before the current node.

Explore xpath axes by comparing the parent axis and the ancestor axis. The parent axis selects the direct parent, while the ancestor axis returns all ancestors.

Explore the self axis in xpath to select the current node, using self with an element to return the same node and enable precise element selection.

Apply the descendant axis in XPath to select all child and grandchild elements within a node; // and the descendant:: expressions yield results for script elements under head or body.

Practice using xpath axes such as following, child, preceding, following-sibling, and cell phone descendent, and create at least five experts locators for each type.

Explore helpful xpath and css locator functions, including dot and double dot for current and parent nodes, position, last, and attribute filters, with practice on combining locators using logical operators.

Master css locators by name, attribute, class, and id, including substring matches; learn to stage elements in the model and compare express notation with css tests for faster, readable locators.

Learn to locate web elements by attribute value using XPath and CSS locators, including matching element name and hidden attributes, with examples of true and false attribute states.

Locate elements by class and id using css selectors. Use dot notation after an element name or a dot for all elements with that class, and hash for ids.

Learn to select multiple elements with xpath and css locators by combining elements with commas, returning all matched elements such as body and head, and extending to any number.

Explore locating child elements inside a parent using space and the greater-than symbol in xpath and css locators, with examples focusing on links within body and direct children.

Master plus to select the next element immediately after a given element and tilde to capture all elements after it on the same level, not children.

Explore locating elements by part of an attribute value in XPath and css locators, using contains-style searches and partial word matches to handle dynamic attributes.

Learn to locate elements by attributes using starts-with and ends-with techniques in XPath and CSS locators, applying the caret before equals to search by starting or ending characters.

Learn to use first-child and last-child selectors to target elements that are the first or last child of their parent, with examples of multiple children and how these locators work.

Learn to target specific child elements with nth-child in CSS locators, selecting every second item and items from the end by index.

Explore first-of-type and first-child versus last-of-type in XPath and CSS locators, using practical examples to show how element position affects selection within a parent.

Explain the difference between first of type and first child in XPath and CSS locators using an h1 example, and practice locating elements.

Explore browser devtools features for web testing: set breakpoints to pause rendering, simulate slow networks and offline mode, clear caches, profile performance, inspect memory, storage, cookies, and generate Lighthouse reports.

Explore how ChatGPT can generate and optimize XPath and CSS locators, verify them against apps like Gmail, Facebook, and Instagram, and improve stability using the dom model.

Discover how ChatGPT can fix XPath locators, suggest the best options, and compare ID locators, short and readable locators, and sparse locators for dynamic web elements.

Explore ChatGPT autocomplete to generate and optimize email field locators, transforming absolute paths into stable relative locators using attributes and prompts for reliable test automation.