How to retrieve the Request data from Post request that is triggered by Javascript

Question

I am new to test Javascript. and the test is like this,

Load a page, then the Javascript is triggered, it fills the request payload data and then trigger the POST request with the generated payload data. My test need to validate the payload data are right. My problem is in the Chrome developer tool, I can see the POST request with Request Payload data. But I don't know how to get the Request payload data with any automation test tool or any other way.

Answer 1

It's pretty simple with something like Cypress.

You can view the docs how to setup Cypress: https://docs.cypress.io/guides/getting-started/installing-cypress

The test itself can be something like:

it('Should log the request body', () => {

  // start by intercepting the request
  cy.intercept('POST', '**/endpoint').as('interceptedRequest')

  // visit your url, and do some actions to trigger the request
  cy.visit('http://yoururl.com')

  // wait for your request to trigger
  cy.wait('@interceptedRequest')
    .its('request.body')
    .then((body) => {
      console.log(body)
    })
})