diff --git a/packages/elements-core/package.json b/packages/elements-core/package.json index 00a6017cd..8b2aadd03 100644 --- a/packages/elements-core/package.json +++ b/packages/elements-core/package.json @@ -1,6 +1,6 @@ { "name": "@stoplight/elements-core", - "version": "9.0.0", + "version": "9.0.1", "sideEffects": [ "web-components.min.js", "src/web-components/**", diff --git a/packages/elements-core/src/components/TryIt/Body/useTextRequestBodyState.ts b/packages/elements-core/src/components/TryIt/Body/useTextRequestBodyState.ts index fc62347ae..158087e4a 100644 --- a/packages/elements-core/src/components/TryIt/Body/useTextRequestBodyState.ts +++ b/packages/elements-core/src/components/TryIt/Body/useTextRequestBodyState.ts @@ -12,12 +12,12 @@ import { useGenerateExampleFromMediaTypeContent } from '../../../utils/exampleGe export const useTextRequestBodyState = ( mediaTypeContent: IMediaTypeContent | undefined, skipReadOnly: boolean, -): [string, React.Dispatch>] => { +): [string | undefined, React.Dispatch>] => { const initialRequestBody = useGenerateExampleFromMediaTypeContent(mediaTypeContent, undefined, { skipReadOnly, }); - const [textRequestBody, setTextRequestBody] = React.useState(initialRequestBody); + const [textRequestBody, setTextRequestBody] = React.useState(initialRequestBody); React.useEffect(() => { setTextRequestBody(initialRequestBody); diff --git a/packages/elements-core/src/components/TryIt/TryIt.spec.tsx b/packages/elements-core/src/components/TryIt/TryIt.spec.tsx index 372172f5f..d7e048493 100644 --- a/packages/elements-core/src/components/TryIt/TryIt.spec.tsx +++ b/packages/elements-core/src/components/TryIt/TryIt.spec.tsx @@ -609,6 +609,60 @@ describe('TryIt', () => { expect(bodyHeader).not.toBeInTheDocument(); }); + it('does not hide panel when request body has no schema but has content', async () => { + render( + , + ); + + let bodyHeader = screen.queryByText('Body'); + expect(bodyHeader).toBeInTheDocument(); + }); + + it('send content-type header when request body has no schema but has content', async () => { + render( + , + ); + + clickSend(); + await waitFor(() => expect(fetchMock).toHaveBeenCalled()); + const requestInit = fetchMock.mock.calls[0][1]!; + expect(requestInit.method).toMatch(/^post$/i); + const headers = new Headers(requestInit.headers); + expect(headers.get('Content-Type')).toBe('application/json'); + }); + it('statically generates request body basing on request body schema', () => { render(); @@ -725,6 +779,56 @@ describe('TryIt', () => { }); }); + describe('No Request body', () => { + it('Adds no Content-type header with GET method', async () => { + render(); + + clickSend(); + + await waitFor(() => expect(fetchMock).toHaveBeenCalled()); + 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); + }); + + it('Adds no Content-type header with POST method', async () => { + render(); + + clickSend(); + + await waitFor(() => expect(fetchMock).toHaveBeenCalled()); + const requestInit = fetchMock.mock.calls[0][1]!; + expect(requestInit.method).toMatch(/^post$/i); + const headers = new Headers(requestInit.headers); + expect(headers.get('Content-Type')).toBe(null); + }); + + it('Adds no Content-type header with PATCH method', async () => { + render(); + + clickSend(); + + await waitFor(() => expect(fetchMock).toHaveBeenCalled()); + const requestInit = fetchMock.mock.calls[0][1]!; + expect(requestInit.method).toMatch(/^patch$/i); + const headers = new Headers(requestInit.headers); + expect(headers.get('Content-Type')).toBe(null); + }); + + it('Adds no Content-type header with PUT method', async () => { + render(); + + clickSend(); + + await waitFor(() => expect(fetchMock).toHaveBeenCalled()); + const requestInit = fetchMock.mock.calls[0][1]!; + expect(requestInit.method).toMatch(/^put$/i); + const headers = new Headers(requestInit.headers); + expect(headers.get('Content-Type')).toBe(null); + }); + }); + describe('Mocking', () => { it('Shows mock button', () => { render(); diff --git a/packages/elements-core/src/components/TryIt/TryIt.tsx b/packages/elements-core/src/components/TryIt/TryIt.tsx index 56e8595e5..8f3fab0e8 100644 --- a/packages/elements-core/src/components/TryIt/TryIt.tsx +++ b/packages/elements-core/src/components/TryIt/TryIt.tsx @@ -296,7 +296,7 @@ export const TryIt: React.FC = ({ values={bodyParameterValues} onChangeValues={setBodyParameterValues} /> - ) : mediaTypeContent ? ( + ) : mediaTypeContent && textRequestBody !== undefined ? ( { const textRequestBodySchema = mediaTypeContent?.schema; const textRequestBodyExamples = mediaTypeContent?.examples; + const textRequestBodyMediaType = mediaTypeContent?.mediaType; try { if (textRequestBodyExamples?.length) { @@ -57,7 +58,10 @@ export const generateExampleFromMediaTypeContent = ( console.warn(e); return `Example cannot be created for this schema\n${e}`; } - return ''; + if (textRequestBodyMediaType) { + return ''; + } + return undefined; }; export const generateExamplesFromJsonSchema = (schema: JSONSchema7 & { 'x-examples'?: unknown }): Example[] => { diff --git a/packages/elements-dev-portal/package.json b/packages/elements-dev-portal/package.json index f12f58ce1..046e42f40 100644 --- a/packages/elements-dev-portal/package.json +++ b/packages/elements-dev-portal/package.json @@ -1,6 +1,6 @@ { "name": "@stoplight/elements-dev-portal", - "version": "3.0.0", + "version": "3.0.1", "description": "UI components for composing beautiful developer documentation.", "keywords": [], "sideEffects": [ @@ -64,9 +64,9 @@ ] }, "dependencies": { + "@stoplight/elements-core": "^9.0.1", "@stoplight/markdown-viewer": "^5.7.1", "@stoplight/mosaic": "^1.53.4", - "@stoplight/elements-core": "~9.0.0", "@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 index 1b7277aac..cee825091 100644 --- a/packages/elements/package.json +++ b/packages/elements/package.json @@ -1,6 +1,6 @@ { "name": "@stoplight/elements", - "version": "9.0.0", + "version": "9.0.1", "description": "UI components for composing beautiful developer documentation.", "keywords": [], "sideEffects": [ @@ -63,7 +63,7 @@ ] }, "dependencies": { - "@stoplight/elements-core": "~9.0.0", + "@stoplight/elements-core": "^9.0.1", "@stoplight/http-spec": "^7.1.0", "@stoplight/json": "^3.18.1", "@stoplight/mosaic": "^1.53.4", @@ -109,4 +109,4 @@ "release": { "extends": "@stoplight/scripts/release" } -} \ No newline at end of file +}