Skip to content

This issue was moved to a discussion.

You can continue the conversation there. Go to discussion →

Unable to traverse through td elements with in the same <tr> #526

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Closed
InduKrish opened this issue Sep 22, 2022 · 0 comments
Closed

Unable to traverse through td elements with in the same <tr> #526

InduKrish opened this issue Sep 22, 2022 · 0 comments

Comments

@InduKrish
Copy link

InduKrish commented Sep 22, 2022

This is related to #517
First of all, thank you for your explanation in the tickets and it helps us to understand better.
and I totally understand that the playwright testing library is not supposed to be using anything like css selector and the intention of library is closely to mimic how user interacts.

All I am trying now is to achieve the below scenario using playwright testing library
would like to filter by table name test id like below, then search text - LINEHOLDER, and once text is found, click the corresponding checkbox in the same row, Can you please advise how to achieve that? will be much helpful.

I have gone thru the documentation, am unable to find anything closer. I would really to like to use testing library in my framework, Can you please help me with the example code to achieve this scenario that helps me to better understand and follow the documentation better?

Screen Shot 2022-09-22 at 8 56 40 AM

test('should access checkbox in the same row', async ({screen}) => {


const table = await screen.findByTestId('editable-nested-table-GroupCode')

const lineholderText = within(table).getByText(/LINEHOLDER*/). ---> this is going to return only LINEHOLDER - td, but how to traverse through the - td element (checkbox) in the same row - tr where LINEHOLDER text is found?

after lineholder test if found, how to access the checkbox please?
const checkbox = ???.getByRole(checkbox)
checkbox.click();
})

Can you please provide me the example to achieve this? would be really helpful and would love to use testing library across all our projects, as it the first time trying to use this for this specific scenario, your example will be much more helpful.

Again to be clear, I am not asking anything like CSS selector, I am only interested to achieve this scenario using testing library. i have to search text and perform click the same row, in other 6 tables. Your example will be so much beneficial. Thank you for all the help and guidance!

@testing-library testing-library locked and limited conversation to collaborators Sep 23, 2022
@jrolfs jrolfs converted this issue into discussion #531 Sep 23, 2022

This issue was moved to a discussion.

You can continue the conversation there. Go to discussion →

Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant