10. Page Object Model with TypeScript

TypeScript Page Object Pattern

export class SearchPage {
  readonly page: Page;
  readonly searchInput: Locator;
  readonly searchButton: Locator;
constructor(page: Page) {
    this.page = page;
    this.searchInput = page.getByPlaceholder("Search courses...");
    this.searchButton = page.getByRole("button", { name: "Search" });
  }
async searchFor(query: string) {
    await this.searchInput.fill(query);
    await this.searchButton.click();
  }
}