Msw: Error for Protocol: "http:" not supported even though giving full URL

[lammypham]

Environment

| Name | Version |
| ---- | ------- |
"msw": "^0.19.5"
| node | ^14.0.20 |
| OS | macOS |

Request handlers

// Example of declaration. Provide your code here.
import { setupServer } from 'msw/node'
import { rest } from 'msw'

const server = setupServer(
  rest.post('https://dev.com/api', () =>     (req, res, ctx) => {
      req.body({ rpccPmcId: 2, indatusPmcId: 1 })
      return res(
        ctx.json({
          address: '2641 86TH ST',
          city: 'URBANDALE',
          didNumber: '',
          id: 6188,
          name: 'CLASSIC PROPERTY MANAGMENT',
          phoneNumber: '8006036000',
          state: 'Iowa',
          zipcode: '50322',
        })
      )
    }
  )

server.listen()

Actual request

// Example of making a request. Provide your code here.
  useEffect(() => {
    const { rpcc, indatus } = propertyPairs
    console.log(propertyPairs)
    const getMatchedProperties = async () => {
      try {
        const result = await axios.get(
          `https://dev.com/api?rpccPmcId=${rpcc}&indatusPmcId=${indatus}`
        )
        console.log(result)
        if (result?.statusText === 'OK') {
           console.log(result)
        }
      } catch (error) {
        console.log(error)
      }
    }
    if (rpcc && indatus) {
      getMatchedProperties()
    } else {
      setPmcResults({
        matched: undefined,
        unique: undefined,
      })
    }
  }, [propertyPairs])

Current behavior

When i run npm run test I am getting the node override protocol error that seems to think that its passing http: and not https:

Expected behavior

This error should not occur when i give the explicit URL

Screenshots

[kettanaito]

Hey, @lammypham. Thanks for reaching out here after our quick chat in Discord.

Let's start from the beginning: cleaning up the usage example. I see quite a few mistakes there, which are, most likely, unintentional:

-rest.post('https://dev.com/api', () =>     (req, res, ctx) => {
+rest.post('https://dev.com/api', (req, res, ctx) => {

There is no need to wrap a response resolver in another function. That won't work.

-req.body({ rpccPmcId: 2, indatusPmcId: 1 })
+const rpccPmcId = req.url.searchParams.get('rpccPmcId')
+const indatusPmcId = req.url.searchParams.get('indatusPmcId')

There is no such API on request's body. Based on your actual URL, those properties are query parameters, so I've suggested to get their values via req.url.searchParams (see Accessing request query parameters).

Also, I've noticed you are mocking a rest.post() request, while performing a GET request via axios.get():

// Expected to mock a POST:
rest.post('https://dev.com/api', ...)

// Actual request is GET
axios.get(`https://dev.com/api?rpccPmcId=${rpcc}&indatusPmcId=${indatus}`)`

Please, align those two: either mock a rest.get(), or perform an axios.post() (or similar, according to Axios API).

---

The issue you are experiencing happens internally in the library called node-request-interceptor that MSW uses for request interception and mocking in NodeJS. It means that the library expects an HTTPS request, but received an HTTP request instead. NodeJS is quite picky in this matter, meaning you cannot do https.get('http://dev.com').

Please, I'd kindly ask you to put this into a minimal reproduction repository. We've tackled this issue before, and yours seems to be something new. Could you do that?

[lammypham]

ah... ok i was trying to do a post instead of a get. you can close this now.