fix(elements-core): Do not omit request body for certain HTTP methods

stoplightio · Jul 29, 2024 · 3b8b13c · 3b8b13c
1 parent 63a9a79
commit 3b8b13c
Show file tree

Hide file tree

Showing 5 changed files with 25 additions and 15 deletions.
diff --git a/packages/elements-core/package.json b/packages/elements-core/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@stoplight/elements-core",
-  "version": "8.4.4",
+  "version": "8.4.5",
   "sideEffects": [
     "web-components.min.js",
     "src/web-components/**",

diff --git a/packages/elements-core/src/components/TryIt/TryIt.spec.tsx b/packages/elements-core/src/components/TryIt/TryIt.spec.tsx
@@ -62,7 +62,7 @@ describe('TryIt', () => {
     const requestInit = fetchMock.mock.calls[0][1]!;
     expect(requestInit.method).toMatch(/^get$/i);
     const headers = new Headers(requestInit.headers);
-    expect(headers.get('Content-Type')).toBe(null);
+    expect(headers.get('Content-Type')).toBe('application/json');
   });
 
   it('uses cors proxy url, if provided', async () => {
@@ -537,16 +537,14 @@ describe('TryIt', () => {
         await waitFor(() => expect(fetchMock).toHaveBeenCalled());
         expect(fetchMock.mock.calls[0]![1]!.body).toEqual(expect.stringMatching(/{.*}/s));
       });
-    });
 
-    describe('is not attached', () => {
       it('to operation with HEAD method', async () => {
         render(<TryItWithPersistence httpOperation={headWithRequestBody} />);
 
         clickSend();
 
         await waitFor(() => expect(fetchMock).toHaveBeenCalled());
-        expect(typeof fetchMock.mock.calls[0]![1]!.body).not.toBe('string');
+        expect(fetchMock.mock.calls[0]![1]!.body).toEqual(expect.stringMatching(/{.*}/s));
       });
     });
 
@@ -726,14 +724,21 @@ describe('TryIt', () => {
             method: 'GET',
             headers: {
               Prefer: 'code=200',
+              'Content-Type': 'application/json',
             },
+            body: '',
+            credentials: 'omit',
           }),
         ],
         [
           'https://todos.stoplight.io/todos',
           expect.objectContaining({
             method: 'GET',
-            headers: {},
+            headers: {
+              'Content-Type': 'application/json',
+            },
+            body: '',
+            credentials: 'omit',
           }),
         ],
       ]);
@@ -760,7 +765,11 @@ describe('TryIt', () => {
           'https://mock-todos.stoplight.io/todos',
           expect.objectContaining({
             method: 'GET',
-            headers: {},
+            headers: {
+              'Content-Type': 'application/json',
+            },
+            body: '',
+            credentials: 'omit',
           }),
         ],
       ]);
@@ -821,8 +830,11 @@ describe('TryIt', () => {
         expect.objectContaining({
           method: 'GET',
           headers: {
+            'Content-Type': 'application/json',
             Prefer: 'code=200',
           },
+          body: '',
+          credentials: 'omit',
         }),
       );
     });

diff --git a/packages/elements-core/src/components/TryIt/build-request.ts b/packages/elements-core/src/components/TryIt/build-request.ts
@@ -135,8 +135,7 @@ export async function buildFetchRequest({
 }: BuildRequestInput): Promise<Parameters<typeof fetch>> {
   const serverUrl = getServerUrl({ httpOperation, mockData, chosenServer, corsProxy, serverVariableValues });
 
-  const shouldIncludeBody =
-    ['PUT', 'POST', 'PATCH'].includes(httpOperation.method.toUpperCase()) && bodyInput !== undefined;
+  const shouldIncludeBody = bodyInput !== undefined;
 
   const queryParams = getQueryParams({ httpOperation, parameterValues });
 
@@ -249,8 +248,7 @@ export async function buildHarRequest({
   const serverUrl = getServerUrl({ httpOperation, mockData, chosenServer, corsProxy, serverVariableValues });
 
   const mimeType = mediaTypeContent?.mediaType ?? 'application/json';
-  const shouldIncludeBody =
-    ['PUT', 'POST', 'PATCH'].includes(httpOperation.method.toUpperCase()) && bodyInput !== undefined;
+  const shouldIncludeBody = bodyInput !== undefined;
 
   const queryParams = getQueryParams({ httpOperation, parameterValues });
 

diff --git a/packages/elements-dev-portal/package.json b/packages/elements-dev-portal/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@stoplight/elements-dev-portal",
-  "version": "2.4.4",
+  "version": "2.4.5",
   "description": "UI components for composing beautiful developer documentation.",
   "keywords": [],
   "sideEffects": [
@@ -66,7 +66,7 @@
   "dependencies": {
     "@stoplight/markdown-viewer": "^5.7.1",
     "@stoplight/mosaic": "^1.53.3",
-    "@stoplight/elements-core": "~8.4.4",
+    "@stoplight/elements-core": "~8.4.5",
     "@stoplight/path": "^1.3.2",
     "@stoplight/types": "^14.0.0",
     "classnames": "^2.2.6",

diff --git a/packages/elements/package.json b/packages/elements/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@stoplight/elements",
-  "version": "8.4.4",
+  "version": "8.4.5",
   "description": "UI components for composing beautiful developer documentation.",
   "keywords": [],
   "sideEffects": [
@@ -63,7 +63,7 @@
     ]
   },
   "dependencies": {
-    "@stoplight/elements-core": "~8.4.4",
+    "@stoplight/elements-core": "~8.4.5",
     "@stoplight/http-spec": "^7.1.0",
     "@stoplight/json": "^3.18.1",
     "@stoplight/mosaic": "^1.53.3",