[Question] Is it possible to make an HttpRequest through Playwright?

[symon-skelly]

I currently use Cypress for my automation testing framework, however I am toying with the idea of moving over to Playwright. One feature of cypress that really shines in the ability to make HttpRequests using the cy.request() function, I use this many times throughout the current system however the most important request is used to setup my randomly generated user application state before I even visit the web-app itself (it makes the request to our webServer which responds with data that is then used for the user-specific localStorage items), this allows me to skip the login screen of my application entirely, saving a lot of time for each test.

I have read the docs about how Playwright can re-use application state but this is not really a viable solution for me because after each test I specifically use new application state.

TLDR: Is it possible to make an HttpRequest through Playwright and get its response?

[mxschmitt]

You can use the Fetch API inside the browser to make http requests. Example for Playwright:

// @ts-check
const playwright = require('playwright');

(async () => {
  const browser = await playwright.chromium.launch();
  const context = await browser.newContext();
  const page = await context.newPage();
  await page.goto('http://example.com');
  const response = await page.evaluate(async () => {
    return await fetch("http://worldtimeapi.org/api/timezone")
      .then(r => r.ok ? r.json() : Promise.reject(r))
  })
  console.log(response)
  await browser.close();
})();

Inside of evaluate you can access the LocalStorage etc. To pass arguments over to the browser process, you can pass it to page.evaluate() in the second argument. See here for the docs.

[symon-skelly]

That looks like a solution that could work for me, thank you for your fast reply!

[pavelfeldman]

It looks like what you really want is this: https://playwright.dev/docs/auth#reuse-authentication-state. You can even create this state using cli once: https://playwright.dev/python/docs/cli#preserve-authenticated-state

[pavelfeldman]

Now that I read you request to the end, I see that you use different state for each test. Is it something like incremental session id that the server keeps tracking of? Figuring out if we can get something out of the box for all the auth scenarios...

[shirshak55]

I really don't like this fetch system.

Issue with fetch

• Getting raw bytes etc,
• cors issue (sometime even have to disable security feature) etc.

For now what I do is grab all cookies and send it to Got or request promise. I wish there are really good way to send request.

[andrisi]

It would be useful in other cases too, making request on behalf of the running web app (using it's state and cookies and all), and a simple API that uses best practices and universal among browsers would be great. Thanks.