Увійдіть у фрейм, перш ніж обирати елемент керування.

На сторінці дві кнопки збереження. Одна належить налаштуванням сторінки, інша вбудованій формі. Назвати кнопку недостатньо: ще не визначено документ, який отримує дію. Довший селектор поза вбудованим документом не виправляє відсутню область пошуку.

Цей посібник використовує документацію фреймів Playwright і вигадану локальну форму. Вбудована настройка має змінитися, зовнішня сторінка залишитися незмінною. Це не платіжний компонент, інтеграція постачальника чи аудит безпеки. Питання одне: чи діє тест у потрібному фреймі?

Спочатку визначте документ, потім елемент

Локатори сторінки працюють у головному фреймі. iframe має окремий документ. Увійдіть локатором фрейму, а потім знайдіть елемент за доступною назвою. Дві області роблять тест зрозумілим без екранних координат.

const preferences = page.frameLocator('iframe[title="Demo preferences"]');
await preferences.getByLabel('Display name').fill('Demo reader');
await preferences.getByRole('button', { name: 'Save', exact: true }).click();
await expect(preferences.getByRole('status')).toHaveText('Saved: Demo reader');
await expect(page.getByRole('status')).toHaveText('Outer page unchanged');

Приклад передбачає зазначений iframe, доступне поле і статус у кожному документі. Імпортуйте expect з тестового раннера Playwright. Остання перевірка робить випадкову дію на зовнішній сторінці помітною замість прийняття будь-якого збереження за успіх.

Заголовок iframe тут є домовленістю тестового прикладу, а не загальною порадою. Оберіть ідентифікатор, значення якого продукт зберігає. Якщо кілька компонентів мають однаковий заголовок, єдиний власник досі не визначений. Зверніться до команди, а не обирайте перший фрейм.

Нехай неоднозначність дає ясну помилку

API FrameLocator описує помилку, коли селектор відповідає кільком фреймам. Це інформація: можливо, додали компонент або початковий селектор ніколи не був унікальним.

Не додавайте first() чи nth() автоматично. Позиція іноді є вимогою, але встановіть це спочатку. Постійний вибір першого фрейму може давати зелений результат після появи стороннього компонента перед потрібною формою.

Вкладені фрейми додають область, не дозвіл вгадувати. Дотримуйтеся очікуваного ланцюжка документів і тримайте посилання біля перевірок. Посібник також описує пошук Frame за назвою або URL. Оберіть спосіб, що виражає реальну належність, а не випадково працездатну суміш пошуків.

Перевіряйте результат у межах доказу

Заповнене поле доводить дію браузера. Повідомлення доводить відповідь інтерфейсу. Жодне окремо не доводить збереження віддаленим сервісом. Наш приклад не має сервера. Знімок показує механізм, не завершену інтеграцію.

Для реального продукту визначте дозволений тестовий запис і очікуваний збережений результат. Перевірте його підтримуваним способом і залиште міжсервісні наслідки в дозволеному середовищі. Доступ до вбудованого елемента сам собою не дозволяє платежів, згоди чи зміни облікового запису.

Перевірка фрейму також не сертифікує клавіатуру, передачу фокуса чи екранні читачі. Для них потрібні окремі очікування. Видима мітка може співіснувати з поганим переходом фокуса.

Залиште конкретну нотатку для огляду

Запишіть власника фрейму, елемент, змінений стан та незміненого сусіда. Це допомагає відрізнити відсутній компонент від неоднозначної цілі або зміненого договору. Використовуйте в знімках і трасах лише вигадані чи дозволені записи.

AnyTest описує агентів, що досліджують вебзастосунки й створюють наскрізні тести для перевірки людиною. Запитайте, який документ отримує дію і чим підтверджено результат. Особливий API фреймів AnyTest тут не заявляється. Спочатку визначте документ, потім елемент.