feat: modernizing our JS and Node snippet targets (#245)

## 🧰 Changes

#### JS 
* [x] 🏄 `fetch`
  * Is now the default target. 🆕
  * Renamed `response` to `res`.
* [x] 🏄 `jquery`
  * Renamed `response` to `res`.
  * Moved response handling to arrow functions.

#### Node
* [x] 🏄 `axios`
  * Moved the `axios` import from `require` to `import`.
* No longer importing `URLSearchParams` from `node:url` as its global
now.
  * Renamed `response` to `res` and `error` to `err`.
  * Moved response handling to arrow functions.
* [x] 🏄 `fetch`
  * Has moved from `node-fetch` to native `fetch`.
  * Is now the default target. 🆕
* Dropped an `error: `output header from logged errors because it's
already using `console.error()`..
* [x] 🔪 `request`
  * It's been deprecated for a couple years now.
* [x] 🔪 `unirest`
* Hasn't been updated in six years, was a bespoke HTTP client from the
Mashape/Kong folks and never reached an adoption level worth us
supporting on all customer sites.

.github/workflows/ci.yml

@@ -13,8 +13,9 @@ jobs:
     strategy:
       matrix:
         node-version:
-          - 18
-          - 20
+          - lts/-1
+          - lts/*
+          - latest
 
     steps:
       - uses: actions/checkout@v4

.vscode/settings.json

@@ -1,10 +1,15 @@
 {
+  "editor.defaultFormatter": "esbenp.prettier-vscode",
   "editor.codeActionsOnSave": {
     "source.fixAll": "explicit"
   },
-  "editor.defaultFormatter": "esbenp.prettier-vscode",
+  "editor.formatOnSave": true,
 
   // controlled by the .editorconfig at root since we can't map vscode settings directly to files
   // https://github.com/microsoft/vscode/issues/35350
-  "files.insertFinalNewline": false
+  "files.insertFinalNewline": false,
+
+  "search.exclude": {
+    "coverage": true
+  }
 }

README.md

@@ -109,8 +109,8 @@ console.log(
   }),
 );
 
-// generate Node.js: Unirest output
-console.log(snippet.convert('node', 'unirest'));
+// generate Node.js: Axios output
+console.log(snippet.convert('node', 'axios'));
 ```
 
 ### addTarget(target)

integrations/node.Dockerfile

@@ -13,10 +13,7 @@ WORKDIR /src
 ADD package.json /src/
 
 # https://www.npmjs.com/package/axios
-# https://www.npmjs.com/package/request
-# Installing node-fetch@2 because as of 3.0 is't now an ESM-only package.
-# https://www.npmjs.com/package/node-fetch
-RUN npm install axios request node-fetch@2 && \
+RUN npm install axios && \
   npm install
 
 ADD . /src

package.json

@@ -53,14 +53,12 @@
     "ocaml",
     "php",
     "python",
-    "request",
     "requests",
     "ruby",
     "shell",
     "snippet",
     "swift",
     "swift",
-    "unirest",
     "xhr",
     "xmlhttprequest"
   ],

src/fixtures/customTarget.ts

@@ -1,15 +1,15 @@
 import type { Target } from '../targets/index.js';
 
-import { request } from '../targets/node/request/client.js';
+import { axios } from '../targets/node/axios/client.js';
 
 export const customTarget = {
   info: {
-    key: 'js-variant',
-    title: 'JavaScript Variant',
+    key: 'node-variant',
+    title: 'Node Variant',
     extname: '.js',
-    default: 'request',
+    default: 'axios',
   },
   clientsById: {
-    request,
+    axios,
   },
 } as unknown as Target;

src/helpers/__snapshots__/utils.test.ts.snap

@@ -150,7 +150,7 @@ exports[`availableTargets > returns all available targets 1`] = `
         "title": "jQuery",
       },
     ],
-    "default": "xhr",
+    "default": "fetch",
     "key": "javascript",
     "title": "JavaScript",
   },
@@ -192,39 +192,23 @@ exports[`availableTargets > returns all available targets 1`] = `
         "link": "http://nodejs.org/api/http.html#http_http_request_options_callback",
         "title": "HTTP",
       },
-      {
-        "description": "Simplified HTTP request client",
-        "extname": ".cjs",
-        "installation": "npm install request --save",
-        "key": "request",
-        "link": "https://github.com/request/request",
-        "title": "Request",
-      },
-      {
-        "description": "Lightweight HTTP Request Client Library",
-        "extname": ".cjs",
-        "key": "unirest",
-        "link": "http://unirest.io/nodejs.html",
-        "title": "Unirest",
-      },
       {
         "description": "Promise based HTTP client for the browser and node.js",
-        "extname": ".cjs",
+        "extname": ".js",
         "installation": "npm install axios --save",
         "key": "axios",
         "link": "https://github.com/axios/axios",
         "title": "Axios",
       },
       {
-        "description": "Simplified HTTP node-fetch client",
-        "extname": ".cjs",
-        "installation": "npm install node-fetch@2 --save",
+        "description": "Perform asynchronous HTTP requests with the Fetch API",
+        "extname": ".js",
         "key": "fetch",
-        "link": "https://github.com/bitinn/node-fetch",
-        "title": "Fetch",
+        "link": "https://nodejs.org/docs/latest/api/globals.html#fetch",
+        "title": "fetch",
       },
     ],
-    "default": "native",
+    "default": "fetch",
     "key": "node",
     "title": "Node.js",
   },

src/helpers/utils.test.ts

@@ -22,7 +22,7 @@ describe('extname', () => {
     expect(extname('c', 'libcurl')).toBe('.c');
     expect(extname('clojure', 'clj_http')).toBe('.clj');
     expect(extname('javascript', 'axios')).toBe('.js');
-    expect(extname('node', 'axios')).toBe('.cjs');
+    expect(extname('node', 'axios')).toBe('.js');
   });
 
   it('returns empty string if the extension is not found', () => {

src/integration.test.ts

@@ -21,7 +21,7 @@ const ENVIRONMENT_CONFIG = {
     c: ['libcurl'],
     csharp: ['httpclient', 'restsharp'],
     go: ['native'],
-    node: ['axios', 'fetch', 'native', 'request'],
+    node: ['axios', 'fetch'],
     php: ['curl', 'guzzle'],
     python: ['requests'],
     shell: ['curl'],
@@ -30,7 +30,7 @@ const ENVIRONMENT_CONFIG = {
     // When running tests locally, or within a CI environment, we shold limit the targets that
     // we're testing so as to not require a mess of dependency requirements that would be better
     // served within a container.
-    node: ['native'],
+    node: ['fetch'],
     php: ['curl'],
     python: ['requests'],
     shell: ['curl'],

src/targets/index.test.ts

@@ -31,7 +31,7 @@ const targetFilter: TargetId[] = [
 /** useful for debuggin, only run a particular set of targets */
 const clientFilter: ClientId[] = [
   // put your clientId here:
-  // 'unirest',
+  // 'axios',
 ];
 
 /** useful for debuggin, only run a particular set of fixtures */

src/targets/javascript/axios/client.ts

@@ -99,12 +99,8 @@ export const axios: Client = {
 
     push('axios');
     push('.request(options)', 1);
-    push('.then(function (response) {', 1);
-    push('console.log(response.data);', 2);
-    push('})', 1);
-    push('.catch(function (error) {', 1);
-    push('console.error(error);', 2);
-    push('});', 1);
+    push('.then(res => console.log(res.data))', 1);
+    push('.catch(err => console.error(err));', 1);
 
     return join();
   },

src/targets/javascript/axios/fixtures/application-form-encoded.js

@@ -13,9 +13,5 @@ const options = {
 
 axios
   .request(options)
-  .then(function (response) {
-    console.log(response.data);
-  })
-  .catch(function (error) {
-    console.error(error);
-  });
+  .then(res => console.log(res.data))
+  .catch(err => console.error(err));

src/targets/javascript/axios/fixtures/application-json.js

@@ -16,9 +16,5 @@ const options = {
 
 axios
   .request(options)
-  .then(function (response) {
-    console.log(response.data);
-  })
-  .catch(function (error) {
-    console.error(error);
-  });
+  .then(res => console.log(res.data))
+  .catch(err => console.error(err));

src/targets/javascript/axios/fixtures/cookies.js

@@ -8,9 +8,5 @@ const options = {
 
 axios
   .request(options)
-  .then(function (response) {
-    console.log(response.data);
-  })
-  .catch(function (error) {
-    console.error(error);
-  });
+  .then(res => console.log(res.data))
+  .catch(err => console.error(err));

src/targets/javascript/axios/fixtures/custom-method.js

@@ -4,9 +4,5 @@ const options = {method: 'PROPFIND', url: 'https://httpbin.org/anything'};
 
 axios
   .request(options)
-  .then(function (response) {
-    console.log(response.data);
-  })
-  .catch(function (error) {
-    console.error(error);
-  });
+  .then(res => console.log(res.data))
+  .catch(err => console.error(err));

src/targets/javascript/axios/fixtures/full.js

@@ -17,9 +17,5 @@ const options = {
 
 axios
   .request(options)
-  .then(function (response) {
-    console.log(response.data);
-  })
-  .catch(function (error) {
-    console.error(error);
-  });
+  .then(res => console.log(res.data))
+  .catch(err => console.error(err));

src/targets/javascript/axios/fixtures/headers.js

@@ -13,9 +13,5 @@ const options = {
 
 axios
   .request(options)
-  .then(function (response) {
-    console.log(response.data);
-  })
-  .catch(function (error) {
-    console.error(error);
-  });
+  .then(res => console.log(res.data))
+  .catch(err => console.error(err));

src/targets/javascript/axios/fixtures/http-insecure.js

@@ -4,9 +4,5 @@ const options = {method: 'GET', url: 'http://httpbin.org/anything'};
 
 axios
   .request(options)
-  .then(function (response) {
-    console.log(response.data);
-  })
-  .catch(function (error) {
-    console.error(error);
-  });
+  .then(res => console.log(res.data))
+  .catch(err => console.error(err));

src/targets/javascript/axios/fixtures/jsonObj-multiline.js

@@ -9,9 +9,5 @@ const options = {
 
 axios
   .request(options)
-  .then(function (response) {
-    console.log(response.data);
-  })
-  .catch(function (error) {
-    console.error(error);
-  });
+  .then(res => console.log(res.data))
+  .catch(err => console.error(err));

src/targets/javascript/axios/fixtures/jsonObj-null-value.js

@@ -9,9 +9,5 @@ const options = {
 
 axios
   .request(options)
-  .then(function (response) {
-    console.log(response.data);
-  })
-  .catch(function (error) {
-    console.error(error);
-  });
+  .then(res => console.log(res.data))
+  .catch(err => console.error(err));

src/targets/javascript/axios/fixtures/multipart-data.js

@@ -13,9 +13,5 @@ const options = {
 
 axios
   .request(options)
-  .then(function (response) {
-    console.log(response.data);
-  })
-  .catch(function (error) {
-    console.error(error);
-  });
+  .then(res => console.log(res.data))
+  .catch(err => console.error(err));

src/targets/javascript/axios/fixtures/multipart-file.js

@@ -12,9 +12,5 @@ const options = {
 
 axios
   .request(options)
-  .then(function (response) {
-    console.log(response.data);
-  })
-  .catch(function (error) {
-    console.error(error);
-  });
+  .then(res => console.log(res.data))
+  .catch(err => console.error(err));

src/targets/javascript/axios/fixtures/multipart-form-data-no-params.js

@@ -8,9 +8,5 @@ const options = {
 
 axios
   .request(options)
-  .then(function (response) {
-    console.log(response.data);
-  })
-  .catch(function (error) {
-    console.error(error);
-  });
+  .then(res => console.log(res.data))
+  .catch(err => console.error(err));

src/targets/javascript/axios/fixtures/multipart-form-data.js

@@ -12,9 +12,5 @@ const options = {
 
 axios
   .request(options)
-  .then(function (response) {
-    console.log(response.data);
-  })
-  .catch(function (error) {
-    console.error(error);
-  });
+  .then(res => console.log(res.data))
+  .catch(err => console.error(err));

src/targets/javascript/axios/fixtures/nested.js

@@ -8,9 +8,5 @@ const options = {
 
 axios
   .request(options)
-  .then(function (response) {
-    console.log(response.data);
-  })
-  .catch(function (error) {
-    console.error(error);
-  });
+  .then(res => console.log(res.data))
+  .catch(err => console.error(err));