cy.wait yields string instead of object as intercepted request body

[tlpbu]

cy.wait() yields object containing string instead of object as intercepted request/response body if cy.intercept() is used preventing deep equal assertions.

Current behavior

If request is stubbed with cy.route(), then cy.wait() yields object in request and response body as expected (if json is used).

Desired behavior

Yield object to simplify assertions

Test code to reproduce

I cannot provide full test due to info security but generic code involved is as:

      cy.route('POST', '/api/data, {}).as('storeDataRequest'); // passes with cy.route stubbing
      cy.intercept('POST', '/api/data', {}).as('storeDataRequest'); // fails with cy.intercept stubbing

      cy.contains('button', 'PUBLISH').click()
        .wait('@storeDataRequest')
        .should(interception => {
          expect(interception.request.body).to.deep.eq(
            { name: 'XYZ',
              date: `${dayjs().format('YYYY-MM-DD')}`,
              collectNew: false,
              productName: 'example.com',
              content: [{ locale: 'en', text: '<p>Text html</p>' }] }
          );
        });

Versions

Cypress 6.20

[jarretmoses]

Im having a similar-ish issue myself. It seems the actual api response is just missing and the body field is an empty string. The setup above is essentially identical to mine without adding adding the 3rd arg as an empty object. It does not actually happen 100% of the time. I've noticed when the response code is 304 Not Modified the body will not show my data but when it is 200 the data appears as expected.

[jarretmoses]

This may actually be a different issue...I've opened a new one

[tlpbu]

@jarretmoses you issue is something else. from description sounds like the one described here https://glebbahmutov.com/blog/cypress-intercept-problems/#cached-response with solution.

I have response and request body content it is just that it is string if stubbing done with cy.intercept() but was always an object with cy.route() previously and IMO it was more convenient for assertions.

[jennifer-shehane]

@tlpbu This is actually only an issue with the request.body, not the response.body.

Reproducible example

it('test cy.route()', () => {
  cy.server()
  cy.route('POST', '/users', { foo: 'bar' }).as('postUrl')
  cy.visit('https://example.com')
  cy.window().then((win) => {
    const xhr = new win.XMLHttpRequest()
    xhr.open('POST', '/users')
    xhr.send({ name: 'XYZ' })
  })
  cy.wait('@postUrl')
    .should(xhr => {
      expect(xhr.request.body).to.deep.eq({ name: 'XYZ' })
      expect(xhr.response.body).to.deep.eq({ foo: 'bar'  })
    })
})

it('test cy.intercept()', () => {
  cy.intercept('POST', '/users', { foo: 'bar' }).as('postUrl')
  cy.visit('https://example.com')
  cy.window().then((win) => {
    const xhr = new win.XMLHttpRequest()
    xhr.open('POST', '/users')
    xhr.send({ name: 'XYZ' })
  })
  cy.wait('@postUrl')
  .should(interception => {
    expect(interception.response.body).to.deep.eq({ foo: 'bar' })
    // ❗️ fails because request.body is a string
    expect(interception.request.body).to.deep.eq({ name: 'XYZ' }
    )
  })
})

[flotwig]

@jennifer-shehane this still fails in 6.3.0, but I think the repro is wrong, the body of the XHR is not being stringified as you expect:

If I update the repro to properly send a JSON request body, it passes in 6.3.0:

    it('test cy.intercept()', () => {
      cy.intercept('POST', '/users', { foo: 'bar' }).as('postUrl')
      cy.visit('https://example.com')
      cy.then((win) => {
        Cypress.$.ajax({
          url: '/users',
          method: 'POST',
          contentType: 'application/json',
          data: JSON.stringify({ name: 'XYZ' }),
        })
      })

      cy.wait('@postUrl')
      .should((interception) => {
        expect(interception.response.body).to.deep.eq({ foo: 'bar' })
        // ❗️ fails because request.body is a string
        expect(interception.request.body).to.deep.eq({ name: 'XYZ' })
      })
    })

@tlpbu are you POSTing application/json type data or some other type of body? Only JSON bodies are automatically parsed in req.body and res.body, currently, but more could be added.

[tlpbu]

@flotwig Yes, it is JSON in request body.

[aethr]

We're seeing a similar issue when we use cy.intercept and want to make changes to the intercepted response and then deliver it using res.send:

  cy.intercept('POST', '/users', (req) => {
    // ... a bunch of logic here
    req.reply((res) => {
      // send an object
      res.send({ name: 'XYZ' });
    });
  }).as('postUrl')

  cy.wait('@postUrl')
    .should((interception) => {
      // ❗️ fails because response.body is a string
      expect(interception.response.body).to.deep.eq({ name: 'XYZ' })
    })

[sybrendotinga]

I have the same issue with the response.body.

This works with .route:

cy.route('GET', '**/projects/*/calculation').as('projectCalculation')
cy.wait('@projectCalculation').its('response.body').should('contain.keys', ['projectId', 'name'])

But this fails with .intercept:

cy.intercept('GET', '**/projects/*/calculation').as('projectCalculation')
cy.wait('@projectCalculation').its('response.body').should('contain.keys', ['projectId', 'name']) // etc.

I also tried this:

cy.wait('@projectCalculation').then(request => {
  console.log(typeof request.response.body) // Yields String, the whole body is not JSON, but a String
})

[flotwig]

@flotwig Yes, it is JSON in request body.

Are you sending content-type application/json? That is what matters.

If you are using another content-type, see #14763

[flotwig]

@sybrendotinga The response type from your server is incorrect. It is text/html, but should be application/json.

[sybrendotinga]

@sybrendotinga The response type from your server is incorrect. It is text/html, but should be application/json.

Life safer! This was my problem.

[flotwig]

Closing since there should not be any issues with this with the current release of Cypress as long as Content-Type is correct - see: #14273 (comment)

If you're still experiencing this issue with a JSON content-type in the latest version of Cypress, please open a new issue.