typescript - Πώς να γράψετε τη μέθοδο waitForElementText στο Playwright

Θα ήθελα να έχω τη waitForElementText() στο playwright.

Π.χ. Έχω επικεφαλίδες σε κάθε σελίδα cssSelector='.header-name'.

και πλοηγούμαι από την Αρχική σελίδα στους Χρήστες

Δίνω δύο επιχειρήματα στη μέθοδο: waitForElementText( locator: string, expectedText: string)

και θέλω να περιμένω να αλλάξει το όνομα της κεφαλίδας από Αρχική → Χρήστες

Προσπάθησα να χρησιμοποιήσω τη μέθοδο page.waitForFunction() αλλά λαμβάνω σφάλμα:

page.waitForFunction: TypeError: Cannot read properties of undefined (reading 'locator')

Απάντηση #1

Εφόσον το API του locator του Playwright περιμένει αυτόματα τα στοιχεία και διαθέτει ένα selector βασισμένο σε κείμενο, το waitForText υπάρχει ήδη στο API ως getByText:

await page.getByText("Users"); // for a substring match

// or an "exact" match (after whitespace normalization):
await page.getByText("Users", {exact: true});

// or as an assertion:
await expect(page.getByText("Users", {exact: true})).toBeVisible();

Μπορείτε να αλυσιδώσετε τους εντοπιστές αν αυτό δεν είναι αρκετό για να εξακριβώσετε το στοιχείο:

const playwright = require("playwright"); // ^1.39.0

const html = `<!DOCTYPE html><html><body>
<h1 class="header-name">  Users  </h1></body></html>`;

let browser;
(async () => {
  browser = await playwright.firefox.launch();
  const page = await browser.newPage();
  await page.setContent(html);
  await page
   .locator(".header-name")
   .getByText("Users", {exact: true})
   .waitFor();
})()
  .catch(err => console.error(err))
  .finally(() => browser?.close());

Απάντηση #2

Χρησιμοποιήστε τον αυτόματο επαναλαμβανόμενο έλεγχο toHaveText

Αυτό περιμένει έως ότου ο Εντοπιστής δείξει σε ένα στοιχείο με το δοθέν κείμενο. Μπορείτε επίσης να χρησιμοποιήσετε κανονικές εκφράσεις για την τιμή.

const locator = page.locator('.title');
await expect(locator).toHaveText(/Welcome, Test User/);
await expect(locator).toHaveText(/Welcome, .*/);