Skip to main content

Pages

Страницы​

Каждый BrowserContext может содержать несколько страниц. Page относится к одной вкладке или всплывающему окну в контексте браузера. Он должен использоваться для навигации по URL-адресам и взаимодействия с содержимым страницы.

// Создайте страницу.
const page = await context.newPage();

// Явная навигация, аналогичная вводу URL в браузере.
await page.goto('http://example.com');
// Заполнение поля ввода.
await page.locator('#search').fill('query');

// Неявная навигация путем нажатия на ссылку.
await page.locator('#submit').click();
// Ожидаем новый URL.
console.log(page.url());

Несколько страниц​

Каждый контекст браузера может содержать несколько страниц (вкладок).

  • Каждая страница ведет себя как активная, сфокусированная страница. Выводить страницу на передний план не требуется.
  • Страницы в контексте учитывают эмуляцию на уровне контекста, такую как размеры окна просмотра, пользовательские сетевые маршруты или локаль браузера.
// Создайте две страницы
const pageOne = await context.newPage();
const pageTwo = await context.newPage();

// Получите страницы контекста браузера
const allPages = context.pages();

Обработка новых страниц​

Событие page в контекстах браузера может использоваться для получения новых страниц, созданных в контексте. Это может быть использовано для обработки новых страниц, открытых ссылками с target="_blank".

// Начните ожидание новой страницы перед нажатием. Обратите внимание, что await нет.
const pagePromise = context.waitForEvent('page');
await page.getByText('open new tab').click();
const newPage = await pagePromise;
// Взаимодействуйте с новой страницей как обычно.
await newPage.getByRole('button').click();
console.log(await newPage.title());

Если действие, которое вызывает новую страницу, неизвестно, можно использовать следующий шаблон.

// Получите все новые страницы (включая всплывающие окна) в контексте
context.on('page', async page => {
  await page.waitForLoadState();
  console.log(await page.title());
});

Обработка всплывающих окон​

Если страница открывает всплывающее окно (например, страницы, открытые ссылками с target="_blank"), вы можете получить ссылку на него, прослушивая событие popup на странице.

Это событие генерируется в дополнение к событию browserContext.on('page'), но только для всплывающих окон, относящихся к этой странице.

// Начните ожидание всплывающего окна перед нажатием. Обратите внимание, что await нет.
const popupPromise = page.waitForEvent('popup');
await page.getByText('open the popup').click();
const popup = await popupPromise;
// Взаимодействуйте с новым всплывающим окном как обычно.
await popup.getByRole('button').click();
console.log(await popup.title());

Если действие, которое вызывает всплывающее окно, неизвестно, можно использовать следующий шаблон.

// Получите все всплывающие окна, когда они открываются
page.on('popup', async popup => {
  await popup.waitForLoadState();
  console.log(await popup.title());
});