question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Returning images as mock

See original GitHub issue

For some use cases, we need to able to return image responses as mocks. Like GET.json or GET.xml, GET.jpeg should be returned for an image request. There are some tricky parts for this:

  • For response type, we have auto type that is checking request content-type header and falls-back to json. But for images we should check mock files for this path in any case for image mock files.
  • Respect to wildcard support(#25), checking all possible mock files will be a bit more complex.
  • We should able to extend this approach for other type of responses. (Video, yaml etc.)

So idea is:

  • If request is GET /path with accept type application/json we should only check path/GET.json
Request method Request path Accept type Mock file to be checked
GET /path application/json path/GET.json
GET /path application/xml path/GET.xml
GET /path image/* path/GET.(jpeg|gif|png…)
GET /path */* path/GET.(json|xml|jpeg|gif|png…)

* Custom middlewares should have priority in any case ** If there is no prefered accept type and if there is a json mock file, it should be prioritised

Issue Analytics

  • State:open
  • Created 5 years ago
  • Reactions:1
  • Comments:6 (2 by maintainers)

github_iconTop GitHub Comments

2reactions
WoyKambascommented, Apr 25, 2020

Yes. I have find a solution (nearly your response). I have using GET.js rather than GET.jpg and sends a image through GET.js

Here is screenshot of my files (a little)

fgfrt

And its my GET.js file module.exports = function(req, res){ res.sendFile('img.jpg', {root: __dirname}); };

When i starts a dev-server and then implement the endpoint. Its going works… Thanks 👍 👍 👍

1reaction
muratcorlucommented, Apr 25, 2020

I just added 2 new helper functions(type and file) and published with v1.8.0. So Your custom response can be that much simple for this use case:

const { type, file } = require('connect-api-mocker/helpers');
 
// Assuming a file named GET.png exists next to this file
const filePath = path.join(__dirname, './img.jpg');
 
module.exports = [type('image/jpeg'), file(filePath)];

But still, I want to implement the idea that I mentioned in first comment. I think it would be more elegant solution.

Read more comments on GitHub >

github_iconTop Results From Across the Web

How to mock the image response in cypress - Stack Overflow
I'm trying to simulate a response from the server containing an image with cy.intercept however, the browser won't display my mocked image. The ......
Read more >
How to Add Your Images to a Mockup - YouTube
How to add your own images to stock photo mockups. If you're wondering how people get custom images inside laptops, iPhones, iPads, ...
Read more >
How To Add Images To Mock Up Photos - YouTube
girlboss #passiveincomeSign Up For "Make money online with me" email for SO much more!http://eepurl.com/dPtnMbSubscribe to me on ...
Read more >
How to Insert Your Images on a MockUp (Easy Tutorial)
FREE COURSE FOR YOU: 6 Ways to Monetize Your Social Media https://bit.ly/FreeCourseSMDOWNLOAD THE CUSTOMIZE MOCKUPS AND STOCK PHOTOS ...
Read more >
How to Add Images to a Mockup - Wicky Design
Step 8: Open your screenshot in Photoshop. Step 9: Select all, then copy your screenshot. Step 10: Go back to your stock image,...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found