Getting Text from Web Elements | Bondar Academy
Course: Playwright UI Testing with TypeScript
Module: Locators and Assertions
Instructor: Artem Bondar
Lesson Summary
In this lesson, you will learn how to extract HTML text from a web page and save it into a constant or variable. This value can be used for assertions or other operations in your code. Here are the key points covered: Extracting Button Text To extract the text from a button: Use the locator for the button. Create a constant, e.g., buttonText . Assign the button text using await basicForm.locator('button').textContent . Make an assertion: expect(buttonText).toEqual('submit') . Extracting All Text Values To get values from multiple elements, such as radio buttons: Use the locator for the radio buttons. Create a constant for all labels, e.g., allRadioButtonLabels . Use await page.locator('radio buttons').allTextContents() to get all values. Make an assertion to check if the array contains a specific value. Getting Input Field Values To retrieve the value from an input field: Create a locator for the input field. Fill the input field with a value. Use await emailField.inputValue() to get the input value. Assert the value: expect(emailValue).toEqual('[email protected]') . Extracting Attribute Values To get the value of an attribute: Use the locator for the element. Call await emailField.getAttribute('placeholder') to retrieve the attribute value. Make an assertion: expect(placeholderValue).toEqual('email') . In summary, use the following methods based on your needs: Single text: textContent All text: allTextContents Input value: inputValue Attribute value: getAttribute Don't forget to commit and push your code to the remote repository at the end of the lesson!