Как загружать файлы с помощью Playwright

Сайты могут предоставлять пользователям возможность скачивать файлы для последующего доступа с локального компьютера. Например, люди часто загружают билеты, квитанции и схемы маршрутов. В этой статье мы разберем, как осуществляется загрузка файлов с помощью Playwright.

Рассмотрим пример загрузки чека за предыдущую покупку в нашем тестовом веб-магазине. Алгоритм действий следующий:

1. Вход на сайт.
2. Переход на страницу учетной записи.
3. Загрузка связанного файла.

Мы проверим, что загруженный файл соответствует ожиданиям, сравнив его с файлом фикстур в нашем финальном ассерте (англ. assertion).

Подпишитесь на наш ТЕЛЕГРАМ-КАНАЛ ПО АВТОМАТИЗАЦИИ ТЕСТИРОВАНИЯ!

Мы можем подойти к этому сценарию по-разному. Один из вариантов – выполнить первые два шага, затем извлечь значение href и использовать его для получения файла с помощью GET-запроса (например, с помощью axios).

const { chromium } = require('playwright')
const axios = require('axios')
const fs = require('fs')
const assert = require('chai').assert

;(async () => {
  const browser = await chromium.launch()
  const page = await browser.newPage()

  await page.goto('https://danube-web.shop/')

  await page.click('#login')
  await page.type('#n-email', process.env.USER_EMAIL)
  await page.type('#n-password2', process.env.USER_PASSWORD)

  await page.click('#goto-signin-btn')

  await page.click('#account')

  await page.waitForSelector('#orders > ul > li:nth-child(1) > a')

  const downloadUrl = await page.$eval(
    '#orders > ul > li:nth-child(1) > a',
    (el) => el.href
  )

  const response = await axios.get(downloadUrl)
  const newFile = Buffer.from(response.data)

  const testFile = await fs.readFileSync('fixtures/testfile.pdf')

  assert(newFile.equals(testFile))

  await browser.close()
})()

Мы также можем щелкнуть по ссылке напрямую и дождаться события загрузки, а затем приступить к сравнению. Обратите внимание, что в этом случае нам необходимо разрешить загрузку в контексте браузера, прежде чем приступать к работе.

const { chromium } = require('playwright')
const fs = require('fs')
const assert = require('chai').assert

;(async () => {
  const browser = await chromium.launch()
  const context = await browser.newContext({ acceptDownloads: true })
  const page = await context.newPage()

  await page.goto('https://danube-web.shop/')

  await page.click('#login')
  await page.type('#n-email', process.env.USER_EMAIL)
  await page.type('#n-password2', process.env.USER_PASSWORD)

  await page.click('#goto-signin-btn')

  await page.click('#account')

  await page.waitForSelector('#orders > ul > li:nth-child(1) > a')

  const [download] = await Promise.all([
    page.waitForEvent('download'),
    page.click('#orders > ul > li:nth-child(1) > a')
  ])

  const path = await download.path()

  const newFile = await fs.readFileSync(path)
  const testFile = await fs.readFileSync('fixtures/testfile.pdf')

  assert(newFile.equals(testFile))

  await browser.close()
})()

Оба примера можно выполнить следующим образом:

macOS:

USER_EMAIL=user@email.com USER_PASSWORD=supersecure1 node file-download.js

Windows:

SET USER_EMAIL=user@email.com
SET USER_PASSWORD=supersecure1
node file-download.js

Итоги

• Используйте переменные окружения для внедрения секретов.
• Сравнивайте ожидаемый файл с новозагруженным.
• Наш скрипт позволяет загрузить файл не одним способом.

Перевод статьи «How to Download Files with Playwright».