https://pact.io logo
Join Slack
Powered by
Hi! we are also new to Pactflow here, and we are t...
# pactflow
m
Hi! we are also new to Pactflow here, and we are trying to work in our first POCs using it, in this case, for the consumer side with cypress. However, following the existing sample project I am coming with the issue that if I 
intercept
the endpoint and then use 
cy.visit
in the test I get the following error:
Copy code
The `content-type` of the response we received from your web server was:

  > `application/json`

This was considered a failure because responses must have `content-type: 'text/html'`
I can set at the endpoint the header 
{ 'Content-Type': 'text/html' }
and the ignore it, in that case it doesn't fail and publish the contract, nevertheless it will fail when checking against the provider as the response is sent as string. Is there a way to workaround this or I am missing something here?
m
Can you please share your consumer test?
I’m guess, that if a 
201
created returns a JSON body (and that’s your expectation), the header should be of the correct content type
m
This is the test, it's a pretty simple one:
Copy code
const orderResponse = require('../fixtures/created_order.json')


describe('Orders creation', () => {
  beforeEach(  () => {
    cy.intercept(
      {
        method: 'POST',
        url: '/orders/'
      },
      {
        statusCode: 201,
        body: orderResponse,
        headers: { 'Content-Type': 'text/html' },
      },
    ).as('postOrder')
    cy.setupPact('pactflow-example-bi-directional-consumer-cypress', 'pactflow-order-api-postman-provider')
    cy.setupPactHeaderBlocklist(['Content-Type'])
  })

  it.only('Displays created order', () => {
    cy.visit({method: 'POST', url: '/orders/'})
  })

  after(() => {
    cy.usePactWait(['postOrder'])
  })
})
I’m guess, that if a 
201
created returns a JSON body (and that’s your expectation), the header should be of the correct content type
Yes indeed, and that's the issue I am actually having, cypress complains when I want to use 
cy.visit
and to the intercepted endpoint if it is returning 
application/json
(which is what by default it does when I don't set any 
content-type
on it 😞
m
thanks
I’m confused,
Copy code
headers: { 'Content-Type': 'text/html' },
You want the response type to be HTML?
Shouldn’t this be:
Copy code
headers: { 'Content-Type': 'application/json' },
m
You want the response type to be HTML?
no no, it's the only way I manage to cypress not to complain . If I remove that test won't pass
m
Is it only failing the provider test or the consumer test as well?
m
It is the consumer test
m
What error are you getting in the consumer test?
m
Everything I shared is the consumer tests errors:
Copy code
The `content-type` of the response we received from your web server was:

  > `application/json`

This was considered a failure because responses must have `content-type: 'text/html'`
m
right, sorry you did have that above
👍 1
I don’t understand why Cypress is complaining, sorry. @Shuying Lin any ideas?
Oh, wait:
Copy code
cy.visit({method: 'POST', url: '/orders/'})
Why are you “visiting” the API?
You should be visiting a web page and interacting with it, to get it to 
POST
to 
/orders
Or, using other APIs that Cypress have availaible for API testing (if you do this though, I’d argue you’re usinsg the wrong tool for the job and could probably just use Pact with whatever unit testing tool you use)
TLDR; 
cy.visit
is for visiting web pages, not making API calls
m
hmmm I see, regarding this:
Why are you “visiting” the API?
I was doing it because I saw it was being used in the example you shared: https://github.com/pactflow/example-bi-directional-consumer-cypress/
or maybe I got it wrongly from there
regarding other cypress defined methods indeed I checked 
cy.request
but apparently that one ignores 
intercept
endpoints, it would only work if I add other stubs perhaps with mountebank, but not straightforward like this
m
Yeah the example visits a web page, and the web page makes the API call, which is intercepted.
For a POST, you should write a test that checks the web page completes a form (or whatever it does) which then issues a POST call to an API that will be intercepted
If you don't need to test the UI, don't use Cypress (that's my advice)
m
Yeah the example visits a web page, and the web page makes the API call, which is intercepted.
oh I see, that is why! I wasn't able to stop the difference haha
👍 1
indeed it's not necessary for us to validate the UI in these contract tests, I might move to check the Mountebank example then
👍 1
thanks a lot!
👍 1
m
I'd just use Pact if the choice is free
👍 1
m
good, will give it a shot 👌
m
👍
Open in Slack
PreviousNext
Powered by