import { type Page, expect } from '@playwright/test'; export default class Search { readonly page: Page; constructor(page: Page) { this.page = page; } // Search field/trigger selectors getSearchTrigger() { return this.page.locator('[data-testid="search-trigger"]'); } // Search dialog selectors getSearchDialog() { return this.page.locator('[data-testid="search-dialog"]'); } getSearchDialogInput() { return this.page.locator('[data-component-name="Search/SearchInput"] > input'); } getSearchResults() { return this.page.locator('[data-component-name="Search/SearchItem"]'); } getSearchMessage() { return this.page.locator('[data-testid="search-message"]'); } getSearchDialogCancelButton() { return this.page.getByRole('button', { name: 'Cancel' }); } // Actions async clickSearchTrigger(): Promise { await this.getSearchTrigger().click(); } async openSearchDialog(): Promise { await this.clickSearchTrigger(); await expect(this.getSearchDialog()).toBeVisible(); } async openSearchDialogWithKeyboard(isMac: boolean = false): Promise { const key = isMac ? 'Meta+K' : 'Control+K'; await this.page.keyboard.press(key); await expect(this.getSearchDialog()).toBeVisible(); } async searchFor(query: string): Promise { await this.getSearchDialogInput().fill(query); // Wait a bit for search results to load await this.page.waitForTimeout(500); } async closeSearchDialog(): Promise { await this.page.keyboard.press('Escape'); await expect(this.getSearchDialog()).not.toBeVisible(); } async closeSearchDialogWithCancel(): Promise { await this.getSearchDialogCancelButton().click(); await expect(this.getSearchDialog()).not.toBeVisible(); } // Assertions async verifySearchTriggerVisible(): Promise { await expect(this.getSearchTrigger()).toBeVisible(); } async verifySearchDialogVisible(): Promise { await expect(this.getSearchDialog()).toBeVisible(); await expect(this.getSearchDialogInput()).toBeVisible(); } async verifySearchDialogNotVisible(): Promise { await expect(this.getSearchDialog()).not.toBeVisible(); } async verifySearchResultsVisible(expectedCount?: number): Promise { await expect(this.getSearchResults().first()).toBeVisible(); if (expectedCount !== undefined) { await expect(this.getSearchResults()).toHaveCount(expectedCount); } } async verifyNoResults(): Promise { await expect(this.getSearchMessage()).toContainText('No results'); await expect(this.getSearchResults()).toHaveCount(0); } async verifyPlaceholderMessage(): Promise { await expect(this.getSearchMessage()).toContainText('Search endpoints, schemas, and more...'); } async verifySearchInputFocused(): Promise { await expect(this.getSearchDialogInput()).toBeFocused(); } }