Rayrun
← Back to videos

Sorting web table | Playwright Typescript tutorial - Part 94

In this video, we'll learn how to sort a table.

The video is a tutorial on how to validate and sort a table using automation. The speaker starts by explaining that although sorting a table might not typically be considered part of automation testing, they will show how to do it for learning purposes. They have a website with a sortable table and want to validate the sorting functionality.

The speaker begins by finding the table on the page using a CSS locator. They explain that they use a specific locator for the table body to avoid finding multiple tables on the page. They then find the header of the table by using another CSS locator.

Next, the speaker demonstrates how to determine the current sort type (ascending, descending, or none) by using the "get attribute" function with the appropriate attribute name. They store this information in a variable called "sort type".

After identifying the sort type, the speaker proceeds to find and print the data in the table. They iterate through each row and extract the text content of the first column using an XPath locator. They store this data in an array called "original data" and print it to the console.

The speaker then demonstrates how to click on the table header to sort the table in ascending order. They explain that the sorting can be done using the "sort" method of the "original data" array. They also retrieve the new sort type after the sorting action.

They print the sorted data and the new sort type to the console. They also repeat the process for descending order and for the default (none) sort type. They explain that for descending order, they need to use the "local compare" function with the sort method and adjust the sort function accordingly.

In conclusion, the speaker mentions that sorting a table might not typically be part of automation testing, especially when using third-party plugins or components. However, they explain that understanding how to automate sorting can be useful in some cases. The video ends with the speaker thanking the viewer and inviting them to ask any questions in the comments or join the Discord Squad Community.

Related Videos

#16 - ARIA and how Playwright is making use of it to identify UI controls?
#16 - ARIA and how Playwright is making use of it to identify UI controls?
Introduction to Playwright | What is Playwright test?
Introduction to Playwright | What is Playwright test?
See the moves - Slider | Playwright Tutorial Part 62
See the moves - Slider | Playwright Tutorial Part 62
Click and Hold | Playwright Tutorial - Part 60
Click and Hold | Playwright Tutorial - Part 60
TwitterGitHubLinkedIn
AboutQuestionsDiscord ForumBrowser ExtensionTagsQA Jobs

Rayrun is a community for QA engineers. I am constantly looking for new ways to add value to people learning Playwright and other browser automation frameworks. If you have feedback, email luc@ray.run.