Mock json call to trigger 401

1

I have one situation where i m trying to hit status code 401 in json but unable to see in network tab. It is not getting 401 network call for mock json

2

Hi @soniya_kapoor when you say “in json” what does that mean exactly? You can’t really mock an HTTP request with just JSON, you can only mock the payload of a successful response.

If you want more advanced mocking features like that I’d highly recommend using ember-cli-mirage. It might well be the most popular ember addon, or if not it’s close, because it’s super powerful and lets you do all kinds of neat stuff mocking a server for development and testing. In this case you’d just need to make an endpoint in your mirage config that returns a 401 status code (either always or conditionally).

3

I am totally new to ember. from where to set the endpoint. in store?

4

Are you using ember data? it sounds like it if you have the store. By default ember data methods (from the store) use ember data adapters to make requests for a model resource to /<model name pluralized>. So if you had a model name user it would make requests like so:

findRecord('user', 1234)                   => GET /users/1234
findAll('user')                            => GET /users
query('user', { ... })                     => GET /user?param1=param1&param2=param2...
store.createRecord('user', { ... }).save() => POST /users
<existing user 1234>.save().               => PUT /users/1234
...

So then if you wanted to mock those endpoints ^ using mirage you would first install mirage:

ember install ember-cli-mirage

When you install mirage it adds a /mirage directory at the root of your project. It also enables itself in testing and development mode (this is configurable). Mirage auto-detects your ember data models. By default it uses the JSON API mirage serializer so if you use a different Ember Data serializer you’ll probably want to match it with your mirage serializer.

Mirage is extremely powerful and contains lots of handy features and shorthands. I’d highly recommend looking at the excellent mirage docs. A brief overview to get what you want though…

To mock endpoints in mirage you edit the /mirage/config.js file. You can use shorthand mocks which perform default actions, or you can customize your own. The most shorthand version of the above endpoints would look like:

// mirage/config.js
...
this.resource('users');
/* automatically defines these routes
this.get('/users');
this.get('/users/:id');
this.post('/users');
this.patch('/users/:id');
this.put('/users/:id')
this.del('/users/:id');
*/
...

“Explicit Shorthands” (not using the resource helper) for the above might look like:

// mirage/config.js
...
this.get('/users');
this.get('/users/:id');
this.post('/users');
this.put('/users/:id');
...

Let’s say you wanted the GET /users/:id endpoint to return a 401, you could do this:

  this.get('/users/:id', function(schema, request) {
    return new Response(401, { some: 'header' }, { errors: ['unauthorized'] });
  });
5

I am using ember-data all the calls are made properly accept 401, how to check it. Its working fine in other apps. I am trying to use deliveryChannel=“PUSH”

this my json { “comment”: “[10b] Trigger OTVC”, “request”: { “method”: “post”, “body”: { “addressPhoneInfos”: [{ “address”: { “street”: “Trigger OTVC” }, “ignoreResidentialStatus”: true }] } }, “response”: { “statusCode”: 401, “headers”: { “WWW-authenticate”: “OTVC”, “Content-type”: “application/vnd.api+json”, “X-auth-token”: “12345” }, “body”: { “transactionId”: “e42de403-7da7-4ffb-aec4-56f8ee80”, “deliveryChannels”: [ { “deliveryChannel”: “EMAIL”, “channelValue”: “GAURI.SAWANT@CIBC.COM”, “preferred”: true, “email”: “GAURI.SAWANT@CIBC.COM”, “phone”: null, “maskedValue”: “G**********T@CIBC.COM” }, { “deliveryChannel”: “VOICE”, “channelValue”: “4167848966”, “preferred”: false, “email”: null, “phone”: “4167848966”, “maskedValue”: “41X-XXX-X966” }, { “deliveryChannel”: “VOICE”, “channelValue”: “4167848965”, “preferred”: false, “email”: null, “phone”: “4167848965”, “maskedValue”: “41X-XXX-X965” }, { “deliveryChannel”: “SMS”, “channelValue”: “7788774094”, “preferred”: false, “email”: null, “phone”: “7788774094”, “maskedValue”: “77X-XXX-X094” }, { “deliveryChannel”: “VOICE”, “channelValue”: “7788774094”, “preferred”: false, “email”: null, “phone”: “7788774094”, “maskedValue”: “77X-XXX-X094” }, { “deliveryChannel”: “PUSH”, “channelValue”: “XYZ’s iPhone”, “preferred”: true, “email”: null, “phone”: null, “maskedValue”: null } ], “entitlements”: [ “VIEW_MARVEL_ASR”, “VIEW_PAYUSDVISA_ASR”, “VIEW_TRANSACTIONS”, “VIEW_CLI”, “VIEW_PVQS”, “UPDATE_PROFILE_INFORMATION”, “CANCEL_PMT”, “UPDATE_STATEMENT_PREFERENCE”, “VIEW_UPCOMING_TRANSFER”, “VIEW_ACCOUNTS”, “VIEW_MPP_ASR”, “ACCNT_DETAILS”, “EMT_REGISTER”, “VIEW_CCBT_ASR”, “VIEW_COPS_ASR”, “VIEW_ALERTS”, “VIEW_PAYEES_DETAILS”, “RETRIEVE_PROFILE_INFORMATION”, “RDC”, “EMT_RECEIVE”, “VIEW_ALP_ASR”, “VIEW_UPCOMING_BILL_PMT”, “VIEW_CMP_ASR”, “VIEW_ACH_ASR”, “VIEW_ESTATEMENT”, “CANCEL_TRANSFER”, “ROLE_USER”, “VIEW_COA_P_ASR”, “UPDATE_ALERTS”, “CHOOSE_OTVC_CHANNEL”, “MAKE_TRANSFERS”, “APPLY_FOR_PRODUCT”, “VIEW_STMT_PREF”, “PAY_BILLS”, “MANAGE_PAYEES”, “VIEW_TFSA_ASR”, “VIEW_CHEQUE_IMAGES”, “ADD_RECIPIENT”, “VIEW_USD_TRANSFER_ASR” ] } } },

6

I guess the part I’m not clear on is where this mock JSON is coming from. Is it just in a file that the ember app is requesting? Do you have a real server using mock data? Is there a mock server?

7

it is there in the code which ember app is using

8

If it’s just a json file it’s not possible to mock an HTTP response code. You’ll need a mocking tool like Pretender (what mirage is built on) or more robust mock/development server for actual network requests.

Unless of course the real server will send HTTP 200 for everything and send the actual return code in the payload which would be pretty unconventional.

9

Thanks your reply. but i think i am still sticking with the problem. not able to resolve it.

10

Without seeing some code or more detailed context it’s difficult to tell what you’re expecting and what isn’t working right. Like you said this:

it is there in the code which ember app is using

But i don’t really know what that means. Is it in a file? Is it being served by something? What does your adapter look like?

11

I am working with wrapper and engine app. So my code is failing to call 401. Trying to figure out. I will post the solution here as soon as i find one. thanks for ur help. As i m unable to give more details of the project and situation here so have to figure out myself.