{"id":7963,"date":"2023-11-30T18:25:24","date_gmt":"2023-11-30T12:55:24","guid":{"rendered":"https:\/\/innovationm.co\/?p=7963"},"modified":"2023-11-30T18:32:28","modified_gmt":"2023-11-30T13:02:28","slug":"javascript-api-mocking-techniques","status":"publish","type":"post","link":"https:\/\/www.innovationm.com\/blog\/javascript-api-mocking-techniques\/","title":{"rendered":"JavaScript API Mocking Techniques"},"content":{"rendered":"<p style=\"text-align: justify;\"><span style=\"font-weight: 400;\">API mocking has become an integral part of the software development process, especially in JavaScript development. It allows developers to simulate actual APIs and receive realistic responses generated with custom data. This practice proves invaluable in various scenarios, such as writing unit tests or dealing with situations where external dependencies are unavailable.\u00a0<\/span><\/p>\n<p style=\"text-align: justify;\"><b>What is API Mocking?\u00a0<\/b><\/p>\n<p style=\"text-align: justify;\"><span style=\"font-weight: 400;\">API mocking involves creating a simulation or imitation of an API&#8217;s behavior without actually invoking the real API. Developers use this technique to emulate the responses that their applications would receive from a live API, enabling efficient testing and development.\u00a0<\/span><\/p>\n<p style=\"text-align: justify;\"><b>Why Do We Need API Mocking?\u00a0<\/b><\/p>\n<p style=\"text-align: justify;\"><span style=\"font-weight: 400;\">Testing Scenarios: When writing unit tests, developers need to isolate the code they are testing from external dependencies. Mocking APIs helps in creating controlled environments for testing specific scenarios.\u00a0<\/span><\/p>\n<p style=\"text-align: justify;\"><span style=\"font-weight: 400;\">Dependency Unavailability: In situations where the actual API is not accessible\u2014perhaps it&#8217;s under development, or there are restrictions\u2014mocking allows developers to continue working on their code by simulating the expected API responses.\u00a0<\/span><\/p>\n<p style=\"text-align: justify;\"><span style=\"font-weight: 400;\">Performance Testing: Developers can use API mocking to simulate different performance scenarios, ensuring their applications can handle various response times and loads.\u00a0<\/span><\/p>\n<p style=\"text-align: justify;\"><b>Step 1\u2014Installing JSON Server\u00a0<\/b><\/p>\n<p style=\"text-align: justify;\"><span style=\"font-weight: 400;\">The first step is to install the JSON Server globally. Then, you can use it for<\/span> <span style=\"font-weight: 400;\">any project when needed.<\/span><\/p>\n<p>&nbsp;<\/p>\n<pre><b>npm install -g json-server<\/b><\/pre>\n<p><b>Step 2\u2014Creating the mock data file<\/b><\/p>\n<p><span style=\"font-weight: 400;\">Then, create a JSON file with the necessary mock data.<\/span><span style=\"font-weight: 400;\">\u00a0<\/span><\/p>\n<pre><b>Example:-<\/b> \r\n\r\n{ \r\n\"users\": [ \r\n{\"id\":\"1\",\"name\": \"Nishani\", \"usertype\": \"Admin\"}, \r\n{\"id\":\"2\",\"name\": \"Nishani\", \"usertype\": \"Manager\"}, \r\n{\"id\":\"3\",\"name\": \"Nishara\", \"usertype\": \"Admin\"}, \r\n{\"id\":\"4\",\"name\": \"Nimal\", \"usertype\": \"Manager\"}, \r\n{\"id\":\"5\",\"name\": \"Nilantha\", \"usertype\": \"Manager\"} \r\n] \r\n}<\/pre>\n<p><b>Step 3\u2014Starting the Server\u00a0<\/b><\/p>\n<p><span style=\"font-weight: 400;\">After that, start the server with the following command.<\/span><\/p>\n<pre><b>json-server --watch users.json --port 8000 <\/b><\/pre>\n<p><b>Step 4\u2014Using in the application\u00a0<\/b><\/p>\n<p><span style=\"font-weight: 400;\">JSON Server supports all GET, POST, PUT, PATCH,and DELETE request methods. The following code shows how to use the JSON Server for CRUD operations in a React application.\u00a0<\/span><\/p>\n<pre>import http from \"..\/http-common\"; \r\nimport axios from \"axios\"; \r\nexport default axios.create({ \r\nbaseURL: \"http:\/\/localhost:8000\", \r\nheaders: { \r\n\"Content-type\": \"application\/json\" \r\n} \r\n}); \r\nexport const getAllUsers = () =&gt; { \r\nreturn http.get(\"\/users\"); \r\n};\r\nexport const getUser = (id) =&gt; { \r\nreturn http.get(\/users\/${id} ); \r\n}; \r\nexport const createUser = (data) =&gt; { \r\nreturn http.post(\"\/users\", data); \r\n}; \r\nexport const updateUsers = (id, data) =&gt; { \r\nreturn http.put(\/users\/${id} , data); \r\n}; \r\nexport const removeUser = (id) =&gt; { \r\nreturn http.delete(\/users\/${id} ); \r\n};<\/pre>\n<p><b>Different API Mocking Techniques in JavaScript:-\u00a0<\/b><\/p>\n<ol>\n<li><b> Manual Mocks:-\u00a0<\/b><\/li>\n<\/ol>\n<p><span style=\"font-weight: 400;\">This technique involves manually creating mock objects or functions that mimic the behavior of the real API. While it provides full control over the mock, it can be time-consuming and may not scale well for complex APIs.<\/span><\/p>\n<p><b>\/\/ Manual mock example<br \/>\n<\/b><\/p>\n<pre><span style=\"font-weight: 400;\"><b>const mockApiResponse = { \r\ndata: 'Mocked response', \r\n}; \r\nconst myApi = { \r\nfetchData: () =&gt; Promise.resolve(mockApiResponse), \r\n}; \r\n\/\/ Usage in code \r\nmyApi.fetchData().then(response =&gt; { \r\nconsole.log(response.data); \/\/ Outputs: 'Mocked response' \r\n}); <\/b><\/span><\/pre>\n<ol start=\"2\">\n<li><b> Nock:-\u00a0<\/b><\/li>\n<\/ol>\n<p><span style=\"font-weight: 400;\">Nock is a popular JavaScript library for HTTP mocking. It intercepts outgoing requests and allows developers to define custom responses. It is particularly useful for testing scenarios where specific HTTP requests need to be mocked.<\/span><\/p>\n<p><span style=\"font-weight: 400;\">const nock = require(&#8216;nock&#8217;);\u00a0<\/span><\/p>\n<p><b>\/\/ Nock example<br \/>\n<\/b><\/p>\n<pre><b>nock('https:\/\/api.example.com') \r\n.get('\/data') \r\n.reply(200, { data: 'Mocked response' }); \r\n\/\/ Usage in code \r\nfetch('https:\/\/api.example.com\/data') \r\n.then(response =&gt; response.json()) \r\n.then(data =&gt; console.log(data)); \/\/ Outputs: { data: 'Mocked response' }\r\n<\/b><\/pre>\n<ol start=\"3\">\n<li><b> Mock Service Worker (MSW):-\u00a0<\/b><\/li>\n<\/ol>\n<p><span style=\"font-weight: 400;\">MSW is a powerful library that intercepts requests on the network level, enabling realistic mocking for both client-side and server-side applications. It seamlessly integrates with popular testing libraries like Jest and testing-library\/react.\u00a0<\/span><\/p>\n<p><b>\/\/ MSW example\u00a0<\/b><\/p>\n<pre>import { setupWorker, rest } from 'msw'; \r\nconst worker = setupWorker( \r\nrest.get('https:\/\/api.example.com\/data', (req, res, ctx) =&gt; { \r\nreturn res(ctx.json({ data: 'Mocked response' })); \r\n}), \r\n); \r\n\/\/ Start the worker \r\nworker.start(); \r\n\/\/ Usage in code \r\nfetch('https:\/\/api.example.com\/data') \r\n.then(response =&gt; response.json()) \r\n.then(data =&gt; console.log(data)); \/\/ Outputs: { data: 'Mocked response' }<\/pre>\n<p><b>Axios-mock-adapter for API Mocking<\/b><\/p>\n<p><span style=\"font-weight: 400;\">The Axios-mock-adapter is an NPM library that allows mocking API requests. It is pretty helpful in testing and fron-tend development as this library will enable us to send HTTP requests to an API.\u00a0<\/span><\/p>\n<p><b>Step 1\u2014Install the library\u00a0<\/b><\/p>\n<pre><b>npm install --save-dev axios-mock-adapter\u00a0<\/b><\/pre>\n<p><strong>Step 2\u2014Create and pass an Axios instance to Axios adapter\u00a0<\/strong><\/p>\n<p><span style=\"font-weight: 400;\">The following code creates an Axios instance and then passes it to the Axios adapter.\u00a0<\/span><\/p>\n<pre>import axios, { AxiosRequestConfig } from 'axios'; \r\nimport AxiosMockAdapter from 'axios-mock-adapter'; \r\nconst axiosMockInstance = axios.create(); \r\nconst axiosLiveInstance = axios.create(); \r\nexport const axiosMockAdapterInstance= new AxiosMockAdapter( \r\naxiosMockInstance, \r\n{ delayResponse: 0 } \r\n); \r\nexport default process.env.isAxioMock? axiosMockInstance : axiosLiveInstance;<\/pre>\n<p><b>Step 3\u2014Create the mock file <\/b><\/p>\n<pre>import { axiosMockAdapterInstance } from 'src\/lib\/axios'; \r\nmock \r\n.onGet('\/api\/social\/profiles') \r\n.reply(() =&gt; { \r\nconst profile: User = { \r\nid: 'u001', \r\ntitle: 'Manager', \r\nname: 'John Mayor', \r\nemail: 'johne@example.com' \r\n}; \r\nreturn [200, { User }];<\/pre>\n<p>&nbsp;<\/p>\n<p>&nbsp;<\/p>\n<p>&nbsp;<\/p>\n<p>&nbsp;<\/p>\n","protected":false},"excerpt":{"rendered":"<p>API mocking has become an integral part of the software development process, especially in JavaScript development. It allows developers to simulate actual APIs and receive realistic responses generated with custom data. This practice proves invaluable in various scenarios, such as writing unit tests or dealing with situations where external dependencies are unavailable.\u00a0 What is API [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":7968,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[71],"tags":[203,484,943,946],"class_list":["post-7963","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-mobile","tag-api","tag-api-testing","tag-automate-api-testing","tag-mapping"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v27.7 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>JavaScript API Mocking Techniques - InnovationM - Blog<\/title>\n<meta name=\"description\" content=\"Explore powerful JavaScript API mocking techniques in this insightful blog. Enhance your testing and development workflow with expert tips on mocking APIs effectively. Elevate your JavaScript skills today!\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.innovationm.com\/blog\/javascript-api-mocking-techniques\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"JavaScript API Mocking Techniques - InnovationM - Blog\" \/>\n<meta property=\"og:description\" content=\"Explore powerful JavaScript API mocking techniques in this insightful blog. Enhance your testing and development workflow with expert tips on mocking APIs effectively. Elevate your JavaScript skills today!\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.innovationm.com\/blog\/javascript-api-mocking-techniques\/\" \/>\n<meta property=\"og:site_name\" content=\"InnovationM - Blog\" \/>\n<meta property=\"article:published_time\" content=\"2023-11-30T12:55:24+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2023-11-30T13:02:28+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.innovationm.com\/blog\/wp-content\/uploads\/2023\/11\/Thursday-Blog-scaled.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"2560\" \/>\n\t<meta property=\"og:image:height\" content=\"1344\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"author\" content=\"InnovationM Admin\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"InnovationM Admin\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"4 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/www.innovationm.com\\\/blog\\\/javascript-api-mocking-techniques\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.innovationm.com\\\/blog\\\/javascript-api-mocking-techniques\\\/\"},\"author\":{\"name\":\"InnovationM Admin\",\"@id\":\"https:\\\/\\\/www.innovationm.com\\\/blog\\\/#\\\/schema\\\/person\\\/a831bf4602d69d1fa452e3de0c8862ed\"},\"headline\":\"JavaScript API Mocking Techniques\",\"datePublished\":\"2023-11-30T12:55:24+00:00\",\"dateModified\":\"2023-11-30T13:02:28+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/www.innovationm.com\\\/blog\\\/javascript-api-mocking-techniques\\\/\"},\"wordCount\":489,\"commentCount\":0,\"image\":{\"@id\":\"https:\\\/\\\/www.innovationm.com\\\/blog\\\/javascript-api-mocking-techniques\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/www.innovationm.com\\\/blog\\\/wp-content\\\/uploads\\\/2023\\\/11\\\/Thursday-Blog-scaled.jpg\",\"keywords\":[\"API\",\"API testing\",\"Automate API Testing\",\"Mapping\"],\"articleSection\":[\"Mobile\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\\\/\\\/www.innovationm.com\\\/blog\\\/javascript-api-mocking-techniques\\\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/www.innovationm.com\\\/blog\\\/javascript-api-mocking-techniques\\\/\",\"url\":\"https:\\\/\\\/www.innovationm.com\\\/blog\\\/javascript-api-mocking-techniques\\\/\",\"name\":\"JavaScript API Mocking Techniques - InnovationM - Blog\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.innovationm.com\\\/blog\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/www.innovationm.com\\\/blog\\\/javascript-api-mocking-techniques\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/www.innovationm.com\\\/blog\\\/javascript-api-mocking-techniques\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/www.innovationm.com\\\/blog\\\/wp-content\\\/uploads\\\/2023\\\/11\\\/Thursday-Blog-scaled.jpg\",\"datePublished\":\"2023-11-30T12:55:24+00:00\",\"dateModified\":\"2023-11-30T13:02:28+00:00\",\"author\":{\"@id\":\"https:\\\/\\\/www.innovationm.com\\\/blog\\\/#\\\/schema\\\/person\\\/a831bf4602d69d1fa452e3de0c8862ed\"},\"description\":\"Explore powerful JavaScript API mocking techniques in this insightful blog. Enhance your testing and development workflow with expert tips on mocking APIs effectively. Elevate your JavaScript skills today!\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/www.innovationm.com\\\/blog\\\/javascript-api-mocking-techniques\\\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/www.innovationm.com\\\/blog\\\/javascript-api-mocking-techniques\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/www.innovationm.com\\\/blog\\\/javascript-api-mocking-techniques\\\/#primaryimage\",\"url\":\"https:\\\/\\\/www.innovationm.com\\\/blog\\\/wp-content\\\/uploads\\\/2023\\\/11\\\/Thursday-Blog-scaled.jpg\",\"contentUrl\":\"https:\\\/\\\/www.innovationm.com\\\/blog\\\/wp-content\\\/uploads\\\/2023\\\/11\\\/Thursday-Blog-scaled.jpg\",\"width\":2560,\"height\":1344},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/www.innovationm.com\\\/blog\\\/javascript-api-mocking-techniques\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/www.innovationm.com\\\/blog\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"JavaScript API Mocking Techniques\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/www.innovationm.com\\\/blog\\\/#website\",\"url\":\"https:\\\/\\\/www.innovationm.com\\\/blog\\\/\",\"name\":\"AI, Software Development & Digital Engineering Insights Blog | InnovationM\",\"description\":\"\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/www.innovationm.com\\\/blog\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/www.innovationm.com\\\/blog\\\/#\\\/schema\\\/person\\\/a831bf4602d69d1fa452e3de0c8862ed\",\"name\":\"InnovationM Admin\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/5c99d9eece9dfbc82297cf34ddd58e9fe05bb52fe66c8f6bf6c0a45bfb6d7629?s=96&r=g\",\"url\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/5c99d9eece9dfbc82297cf34ddd58e9fe05bb52fe66c8f6bf6c0a45bfb6d7629?s=96&r=g\",\"contentUrl\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/5c99d9eece9dfbc82297cf34ddd58e9fe05bb52fe66c8f6bf6c0a45bfb6d7629?s=96&r=g\",\"caption\":\"InnovationM Admin\"},\"sameAs\":[\"https:\\\/\\\/www.innovationm.com\\\/\"],\"url\":\"https:\\\/\\\/www.innovationm.com\\\/blog\\\/author\\\/innovationmadmin\\\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"JavaScript API Mocking Techniques - InnovationM - Blog","description":"Explore powerful JavaScript API mocking techniques in this insightful blog. Enhance your testing and development workflow with expert tips on mocking APIs effectively. Elevate your JavaScript skills today!","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.innovationm.com\/blog\/javascript-api-mocking-techniques\/","og_locale":"en_US","og_type":"article","og_title":"JavaScript API Mocking Techniques - InnovationM - Blog","og_description":"Explore powerful JavaScript API mocking techniques in this insightful blog. Enhance your testing and development workflow with expert tips on mocking APIs effectively. Elevate your JavaScript skills today!","og_url":"https:\/\/www.innovationm.com\/blog\/javascript-api-mocking-techniques\/","og_site_name":"InnovationM - Blog","article_published_time":"2023-11-30T12:55:24+00:00","article_modified_time":"2023-11-30T13:02:28+00:00","og_image":[{"width":2560,"height":1344,"url":"https:\/\/www.innovationm.com\/blog\/wp-content\/uploads\/2023\/11\/Thursday-Blog-scaled.jpg","type":"image\/jpeg"}],"author":"InnovationM Admin","twitter_misc":{"Written by":"InnovationM Admin","Est. reading time":"4 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.innovationm.com\/blog\/javascript-api-mocking-techniques\/#article","isPartOf":{"@id":"https:\/\/www.innovationm.com\/blog\/javascript-api-mocking-techniques\/"},"author":{"name":"InnovationM Admin","@id":"https:\/\/www.innovationm.com\/blog\/#\/schema\/person\/a831bf4602d69d1fa452e3de0c8862ed"},"headline":"JavaScript API Mocking Techniques","datePublished":"2023-11-30T12:55:24+00:00","dateModified":"2023-11-30T13:02:28+00:00","mainEntityOfPage":{"@id":"https:\/\/www.innovationm.com\/blog\/javascript-api-mocking-techniques\/"},"wordCount":489,"commentCount":0,"image":{"@id":"https:\/\/www.innovationm.com\/blog\/javascript-api-mocking-techniques\/#primaryimage"},"thumbnailUrl":"https:\/\/www.innovationm.com\/blog\/wp-content\/uploads\/2023\/11\/Thursday-Blog-scaled.jpg","keywords":["API","API testing","Automate API Testing","Mapping"],"articleSection":["Mobile"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/www.innovationm.com\/blog\/javascript-api-mocking-techniques\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/www.innovationm.com\/blog\/javascript-api-mocking-techniques\/","url":"https:\/\/www.innovationm.com\/blog\/javascript-api-mocking-techniques\/","name":"JavaScript API Mocking Techniques - InnovationM - Blog","isPartOf":{"@id":"https:\/\/www.innovationm.com\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.innovationm.com\/blog\/javascript-api-mocking-techniques\/#primaryimage"},"image":{"@id":"https:\/\/www.innovationm.com\/blog\/javascript-api-mocking-techniques\/#primaryimage"},"thumbnailUrl":"https:\/\/www.innovationm.com\/blog\/wp-content\/uploads\/2023\/11\/Thursday-Blog-scaled.jpg","datePublished":"2023-11-30T12:55:24+00:00","dateModified":"2023-11-30T13:02:28+00:00","author":{"@id":"https:\/\/www.innovationm.com\/blog\/#\/schema\/person\/a831bf4602d69d1fa452e3de0c8862ed"},"description":"Explore powerful JavaScript API mocking techniques in this insightful blog. Enhance your testing and development workflow with expert tips on mocking APIs effectively. Elevate your JavaScript skills today!","breadcrumb":{"@id":"https:\/\/www.innovationm.com\/blog\/javascript-api-mocking-techniques\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.innovationm.com\/blog\/javascript-api-mocking-techniques\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.innovationm.com\/blog\/javascript-api-mocking-techniques\/#primaryimage","url":"https:\/\/www.innovationm.com\/blog\/wp-content\/uploads\/2023\/11\/Thursday-Blog-scaled.jpg","contentUrl":"https:\/\/www.innovationm.com\/blog\/wp-content\/uploads\/2023\/11\/Thursday-Blog-scaled.jpg","width":2560,"height":1344},{"@type":"BreadcrumbList","@id":"https:\/\/www.innovationm.com\/blog\/javascript-api-mocking-techniques\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.innovationm.com\/blog\/"},{"@type":"ListItem","position":2,"name":"JavaScript API Mocking Techniques"}]},{"@type":"WebSite","@id":"https:\/\/www.innovationm.com\/blog\/#website","url":"https:\/\/www.innovationm.com\/blog\/","name":"AI, Software Development & Digital Engineering Insights Blog | InnovationM","description":"","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.innovationm.com\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Person","@id":"https:\/\/www.innovationm.com\/blog\/#\/schema\/person\/a831bf4602d69d1fa452e3de0c8862ed","name":"InnovationM Admin","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/secure.gravatar.com\/avatar\/5c99d9eece9dfbc82297cf34ddd58e9fe05bb52fe66c8f6bf6c0a45bfb6d7629?s=96&r=g","url":"https:\/\/secure.gravatar.com\/avatar\/5c99d9eece9dfbc82297cf34ddd58e9fe05bb52fe66c8f6bf6c0a45bfb6d7629?s=96&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/5c99d9eece9dfbc82297cf34ddd58e9fe05bb52fe66c8f6bf6c0a45bfb6d7629?s=96&r=g","caption":"InnovationM Admin"},"sameAs":["https:\/\/www.innovationm.com\/"],"url":"https:\/\/www.innovationm.com\/blog\/author\/innovationmadmin\/"}]}},"_links":{"self":[{"href":"https:\/\/www.innovationm.com\/blog\/wp-json\/wp\/v2\/posts\/7963","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.innovationm.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.innovationm.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.innovationm.com\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.innovationm.com\/blog\/wp-json\/wp\/v2\/comments?post=7963"}],"version-history":[{"count":0,"href":"https:\/\/www.innovationm.com\/blog\/wp-json\/wp\/v2\/posts\/7963\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.innovationm.com\/blog\/wp-json\/wp\/v2\/media\/7968"}],"wp:attachment":[{"href":"https:\/\/www.innovationm.com\/blog\/wp-json\/wp\/v2\/media?parent=7963"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.innovationm.com\/blog\/wp-json\/wp\/v2\/categories?post=7963"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.innovationm.com\/blog\/wp-json\/wp\/v2\/tags?post=7963"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}