testing-library / playwright-testing-library

🔍 Find elements in Playwright with queries from Testing Library
MIT License
248 stars 9 forks source link

expect assertion fails when filtered by table name #520

Closed InduKrish closed 2 years ago

InduKrish commented 2 years ago

I would like to click the checkbox in the corresponding row after the text that i want to search is found in the table (question is addressed in #517)

when i tried meanwhile by table name to test this way , i see the following error, although i see in the output DOM, that the element is found. I tried using both getByText and FindByText(), and both failed.

    const header = await this.screen.findByTestId("editable-nested-table-GroupCode");
    const base =   await this.within(header).findByText(" LINEHOLDER")
    console.log("value " + base);
    await expect(base).toContainText(text);

output:

Screen Shot 2022-09-20 at 11 37 01 AM Screen Shot 2022-09-20 at 11 37 48 AM Screen Shot 2022-09-20 at 11 38 22 AM

Code that works: while filtering by row id, however i want to filter by table id.

Assertion for row test id erow-GroupCode-0 works. const header = await this.screen.findByTestId('erow-GroupCode-0'); console.log(" header" + header) const base = this.within(header).getByText("LINEHOLDER") console.log("base value" + base); const check = this.within(header).getByText("check") console.log(" value " + check) await expect(base).toContainText(text);

output console log: Mac-C02FT4MH:cbna-test-integration-cbna x273092$ npx playwright test

Running 1 test using 1 worker [chromium] › tests/web/vacation.bidaward.defaults.spec.po.new.js:14:9 › Bid and award Default page verification › Default page verification headerLocator@query-by-test-id=["erow-GroupCode-0"] base valueLocator@query-by-test-id=["erow-GroupCode-0"] >> get-by-text=["LINEHOLDER"] value Locator@query-by-test-id=["erow-GroupCode-0"] >> get-by-text=["check"]

Screen Shot 2022-09-20 at 10 48 25 AM

html structure:

Screen Shot 2022-09-20 at 11 43 01 AM

why assertion is working while filtering by row test id erow-GroupCode-0, but it fails while filtering by table name -editable-nested-table-GroupCode?

jrolfs commented 2 years ago

Your text match is probably too specific when matching against a parent element. See https://testing-library.com/docs/queries/about#textmatch. Please try to reference the Testing Library documentation when troubleshooting queries.

const header = await this.screen.findByTestId("editable-nested-table-GroupCode");
const base =   await this.within(header).findByText(/LINEHOLDER/); // <--- Use a `RegExp` here?

await expect(base).toContainText(text);