puppeteer - проверка POST-запроса, где полезной нагрузкой является FormData - PullRequest
0 голосов
/ 10 мая 2019

У меня есть процесс в React, который выглядит примерно так:

handleButtonClick() {
  const payload = new FormData();
  payload.append('foo', someFileBlobContent);
  axios.post('/my-api/', payload);
}

Когда нажата кнопка, некоторые данные компилируются как FormData, а затем отправляются как полезные данные в запросе POST к API.

В моих тестах Jest / Puppeteer я пытаюсь подтвердить, что запрос содержит данные, которые он должен:

page.click('.my-button');

await page.waitForRequest(request => {
  if (request.url().match(/my-api/) && request.method() === 'POST') {
    expect(request.postData()).toBeDefined();
    return true;
  }
});

В этом сценарии request.postData() равен undefined.Есть ли какой-нибудь способ в Puppeteer для проверки содержимого запроса POST, где полезная нагрузка представляет собой структуру FormData?

При запуске процесса в Chrome, я вижу, как FormData отображается в сетевых запросах через Chrome devtoolsЯ знаю, что данные отправляются, но я бы хотел их подтвердить.

1 Ответ

1 голос
/ 11 мая 2019

Я провел несколько тестов, request.postData() работал только для меня на application/x-www-form-urlencoded формах (или «нормальных данных формы»).Как только вы загрузите файл, content-type будет multipart/form-data, и кукловод не сможет вернуть данные публикации.

Альтернатива: Проверьте заголовок Content-Type

Поскольку вы не можете проверитьесли отправленные данные отправляются, вы все равно можете проверить, действительно ли запрос multipart/form-data.В этом случае заголовок content-type выглядит следующим образом multipart/form-data; boundary=..., поэтому вы можете проверить его следующим образом:

await page.waitForRequest(request => {
  if (request.url().match(/my-api/) && request.method() === 'POST') {
    const headers = request.headers();
    expect(headers['content-type'].startsWith('multipart/form-data')).toBe(true);
    return true;
  }
});
...