@redocly/openapi-docs 3.24.0 → 3.24.1

package/lib/components/PayloadSamples/__tests__/ExampleValue.test.js

@@ -0,0 +1,197 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { render } from '@testing-library/react';
+import { vi } from 'vitest';
+import * as Jotai from 'jotai';
+import { ExampleValue } from '../ExampleValue.js';
+import { globalOptionsAtom } from '../../../jotai/store.js';
+import { normalizeOptions } from '../../../services/index.js';
+vi.mock('@redocly/theme/components/JsonViewer/JsonViewer', () => ({
+    JsonViewer: vi.fn(({ data, expandLevel, onCopyClick, onPanelToggle }) => (_jsxs("div", { "data-testid": "json-viewer", "data-expand-level": expandLevel, children: [_jsx("pre", { "data-testid": "json-viewer-data", children: JSON.stringify(data, null, 2) }), onCopyClick && _jsx("button", { "data-testid": "copy-button", onClick: onCopyClick }), onPanelToggle && _jsx("button", { "data-testid": "panel-toggle", onClick: () => onPanelToggle(true) })] }))),
+}));
+vi.mock('../styled.js', () => ({
+    StyledCodeBlock: vi.fn(({ source, lang, header }) => (_jsxs("div", { "data-testid": "code-block", "data-lang": lang, children: [_jsx("pre", { children: source }), header?.controls?.copy && (_jsx("button", { "data-testid": "code-block-copy", onClick: header.controls.copy.onClick }))] }))),
+}));
+vi.mock('jotai', async () => {
+    const actual = await vi.importActual('jotai');
+    return {
+        ...actual,
+        useAtomValue: vi.fn(),
+    };
+});
+describe('ExampleValue', () => {
+    const mockUseAtomValue = Jotai.useAtomValue;
+    const options = normalizeOptions({});
+    beforeEach(async () => {
+        vi.clearAllMocks();
+        const actualJotai = await vi.importActual('jotai');
+        mockUseAtomValue.mockImplementation((atom) => {
+            if (atom === globalOptionsAtom) {
+                return {
+                    ...options,
+                    jsonSamplesExpandLevel: 2,
+                };
+            }
+            return actualJotai.useAtomValue(atom);
+        });
+    });
+    describe('JSON parsing for application/json', () => {
+        it('should parse valid JSON string and pass parsed object to JsonViewer', () => {
+            const validJsonString = '{"name":"Test User","value":"premium","count":5}';
+            const props = {
+                value: validJsonString,
+                mimeType: 'application/json',
+                onCopyClick: vi.fn(),
+            };
+            const { getByTestId } = render(_jsx(Jotai.Provider, { children: _jsx(ExampleValue, { ...props }) }));
+            const jsonData = getByTestId('json-viewer-data');
+            const parsedData = JSON.parse(jsonData.textContent || '{}');
+            expect(parsedData).toEqual({
+                name: 'Test User',
+                value: 'premium',
+                count: 5,
+            });
+        });
+        it('should use value as-is when it is already an object (not a string)', () => {
+            const objectValue = { name: 'Test User', value: 'premium', count: 5 };
+            const props = {
+                value: objectValue,
+                mimeType: 'application/json',
+                onCopyClick: vi.fn(),
+            };
+            const { getByTestId } = render(_jsx(Jotai.Provider, { children: _jsx(ExampleValue, { ...props }) }));
+            const jsonData = getByTestId('json-viewer-data');
+            const parsedData = JSON.parse(jsonData.textContent || '{}');
+            expect(parsedData).toEqual(objectValue);
+        });
+        it('should fallback to original value when JSON string is invalid', () => {
+            const invalidJsonString = '{"name":"Test User",invalid json}';
+            const props = {
+                value: invalidJsonString,
+                mimeType: 'application/json',
+                onCopyClick: vi.fn(),
+            };
+            const { getByTestId } = render(_jsx(Jotai.Provider, { children: _jsx(ExampleValue, { ...props }) }));
+            const jsonData = getByTestId('json-viewer-data');
+            const parsedData = JSON.parse(jsonData.textContent || '');
+            expect(parsedData).toBe(invalidJsonString);
+        });
+    });
+    describe('XML handling for application/xml', () => {
+        it('should wrap object in root tag and convert to XML (dataValue case)', () => {
+            const objectValue = { name: 'Test User', value: 'premium' };
+            const props = {
+                value: objectValue,
+                mimeType: 'application/xml',
+                onCopyClick: vi.fn(),
+            };
+            const { getByTestId } = render(_jsx(Jotai.Provider, { children: _jsx(ExampleValue, { ...props }) }));
+            const codeBlock = getByTestId('code-block');
+            const source = codeBlock.querySelector('pre')?.textContent || '';
+            expect(source).toContain('<root>');
+            expect(source).toContain('<name>Test User</name>');
+            expect(source).toContain('<value>premium</value>');
+            expect(source).toContain('</root>');
+        });
+        it('should not wrap array in root tag for XML', () => {
+            const arrayValue = [{ item: 'one' }, { item: 'two' }];
+            const props = {
+                value: arrayValue,
+                mimeType: 'application/xml',
+                onCopyClick: vi.fn(),
+            };
+            const { getByTestId } = render(_jsx(Jotai.Provider, { children: _jsx(ExampleValue, { ...props }) }));
+            const codeBlock = getByTestId('code-block');
+            const source = codeBlock.querySelector('pre')?.textContent || '';
+            expect(source).not.toContain('<root>');
+            expect(source).toContain('<item>one</item>');
+            expect(source).toContain('<item>two</item>');
+        });
+        it('should render pre-built XML string from sampler with attributes (nodeType: attribute)', () => {
+            const xmlString = '<Artifact catalogId="ART-2024-001">\n  <title>Mona Lisa</title>\n</Artifact>';
+            const props = {
+                value: xmlString,
+                mimeType: 'application/xml',
+                onCopyClick: vi.fn(),
+            };
+            const { getByTestId } = render(_jsx(Jotai.Provider, { children: _jsx(ExampleValue, { ...props }) }));
+            const codeBlock = getByTestId('code-block');
+            const source = codeBlock.querySelector('pre')?.textContent || '';
+            expect(source).toContain('catalogId="ART-2024-001"');
+            expect(source).toContain('<title>Mona Lisa</title>');
+        });
+        it('should render pre-built XML string with text nodes (nodeType: text)', () => {
+            const xmlString = '<Artifact>\n  <title>Mona Lisa</title>\nPortrait painting by Leonardo da Vinci</Artifact>';
+            const props = {
+                value: xmlString,
+                mimeType: 'application/xml',
+                onCopyClick: vi.fn(),
+            };
+            const { getByTestId } = render(_jsx(Jotai.Provider, { children: _jsx(ExampleValue, { ...props }) }));
+            const codeBlock = getByTestId('code-block');
+            const source = codeBlock.querySelector('pre')?.textContent || '';
+            expect(source).toContain('Portrait painting by Leonardo da Vinci');
+            expect(source).toContain('<title>Mona Lisa</title>');
+        });
+        it('should render pre-built XML string with CDATA (nodeType: cdata)', () => {
+            const xmlString = '<Documentation>\n  <![CDATA[<html><head><title>Docs</title></head></html>]]>\n</Documentation>';
+            const props = {
+                value: xmlString,
+                mimeType: 'application/xml',
+                onCopyClick: vi.fn(),
+            };
+            const { getByTestId } = render(_jsx(Jotai.Provider, { children: _jsx(ExampleValue, { ...props }) }));
+            const codeBlock = getByTestId('code-block');
+            const source = codeBlock.querySelector('pre')?.textContent || '';
+            expect(source).toContain('<![CDATA[');
+            expect(source).toContain('<html><head><title>Docs</title></head></html>');
+            expect(source).toContain(']]>');
+        });
+        it('should render pre-built XML string with all nodeTypes combined (sampler output)', () => {
+            const xmlString = [
+                '<Artifact catalogId="ART-2024-001" era="Renaissance">',
+                '  <title>Mona Lisa</title>',
+                'Portrait painting by Leonardo da Vinci',
+                '  <![CDATA[<note>Handle with <b>extreme</b> care</note>]]>',
+                '  <artists>',
+                '    <Artist role="painter">',
+                '      <name>Leonardo da Vinci</name>',
+                '    </Artist>',
+                '  </artists>',
+                '</Artifact>',
+            ].join('\n');
+            const props = {
+                value: xmlString,
+                mimeType: 'application/xml',
+                onCopyClick: vi.fn(),
+            };
+            const { getByTestId } = render(_jsx(Jotai.Provider, { children: _jsx(ExampleValue, { ...props }) }));
+            const codeBlock = getByTestId('code-block');
+            const source = codeBlock.querySelector('pre')?.textContent || '';
+            expect(source).toContain('catalogId="ART-2024-001"');
+            expect(source).toContain('era="Renaissance"');
+            expect(source).toContain('<title>Mona Lisa</title>');
+            expect(source).toContain('Portrait painting by Leonardo da Vinci');
+            expect(source).toContain('<![CDATA[<note>Handle with <b>extreme</b> care</note>]]>');
+            expect(source).not.toContain('internalCode');
+            expect(source).not.toContain('INT-7742-X');
+        });
+        it('should convert JS object to XML with CDATA support via xmlBuilder', () => {
+            const objectValue = {
+                Documentation: {
+                    '#cdata': '<html><head><title>Docs</title></head></html>',
+                },
+            };
+            const props = {
+                value: objectValue,
+                mimeType: 'application/xml',
+                onCopyClick: vi.fn(),
+            };
+            const { getByTestId } = render(_jsx(Jotai.Provider, { children: _jsx(ExampleValue, { ...props }) }));
+            const codeBlock = getByTestId('code-block');
+            const source = codeBlock.querySelector('pre')?.textContent || '';
+            expect(source).toContain('<![CDATA[');
+            expect(source).toContain(']]>');
+        });
+    });
+});
+//# sourceMappingURL=ExampleValue.test.js.map

package/lib/components/PayloadSamples/__tests__/PayloadSamples.test.d.ts

@@ -0,0 +1 @@
+export {};

package/lib/components/PayloadSamples/__tests__/PayloadSamples.test.js

@@ -0,0 +1,38 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { render } from '@testing-library/react';
+import { normalizeOptions, OpenAPIParser } from '../../../services/index.js';
+import { getMediaContent, getOperation } from '../../../models/index.js';
+import { withTestProviders } from '../../../testProviders.js';
+import { PayloadSamples } from '../PayloadSamples.js';
+import testDefinition from './fixtures/mediaTypeUrlencoded.json';
+describe('PayloadSamples', () => {
+    let operation;
+    const options = normalizeOptions({});
+    const parser = new OpenAPIParser(testDefinition, undefined, options);
+    test('should renders correctly without example to application/x-www-form-urlencoded', async () => {
+        operation = getOperation(parser, {
+            pointer: '#/paths/~1test/get',
+            pathName: '/test',
+            httpVerb: 'GET',
+            pathParameters: [],
+            pathServers: [],
+            isWebhook: false,
+            isAdditionalOperation: false,
+            ...testDefinition.paths['/test'].get,
+        }, undefined, options, 'tests');
+        const props = {
+            operation,
+            content: getMediaContent({
+                parser,
+                info: testDefinition.paths['/test'].get.requestBody.content,
+                isRequestType: true,
+                options,
+                data: { operation },
+            }),
+            onCopyClick: vi.fn(),
+        };
+        const { container } = render(withTestProviders(_jsx(PayloadSamples, { ...props }), { definition: parser.definition }));
+        expect(container).toHaveTextContent(/name=string&status=string/);
+    });
+});
+//# sourceMappingURL=PayloadSamples.test.js.map

package/lib/components/PropertyDetails/__tests__/Extensions.test.d.ts

@@ -0,0 +1 @@
+export {};

package/lib/components/PropertyDetails/__tests__/Extensions.test.js

@@ -0,0 +1,21 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { render } from '@testing-library/react';
+import * as Jotai from 'jotai';
+import { Extensions } from '../Extensions.js';
+import { normalizeOptions } from '../../../services/index.js';
+vi.mock('jotai', async () => ({
+    ...(await vi.importActual('jotai')),
+    useAtomValue: vi.fn(),
+}));
+describe('Components', () => {
+    describe('Extensions', () => {
+        it('Extensions label renders correctly', () => {
+            vi.spyOn(Jotai, 'useAtomValue').mockReturnValue(normalizeOptions({
+                showExtensions: true,
+            }));
+            const { container } = render(_jsx(Extensions, { extensions: { 'x-test': 'Add new pet to the store inventory' } }));
+            expect(container).toHaveTextContent(/test: Add new pet to the store inventory/);
+        });
+    });
+});
+//# sourceMappingURL=Extensions.test.js.map

package/lib/components/PropertyDetails/__tests__/FieldDetail.test.d.ts

@@ -0,0 +1 @@
+export {};

package/lib/components/PropertyDetails/__tests__/FieldDetail.test.js

@@ -0,0 +1,52 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { render } from '@testing-library/react';
+import { FieldDetail } from '../FieldDetail.js';
+describe('FieldDetail', () => {
+    const wrapper = (label, value) => render(_jsx(FieldDetail, { label: label, value: value }));
+    it('should render with DefaultValue component', () => {
+        const { getByText } = wrapper('Default', 'value');
+        expect(getByText('"value"')).toBeInTheDocument();
+        expect(getByText('Default')).toBeInTheDocument();
+    });
+    it('should render with ExampleValue component', () => {
+        const { getByText } = wrapper('Example:', 'value');
+        expect(getByText('"value"')).toBeInTheDocument();
+        expect(getByText('Example:')).toBeInTheDocument();
+    });
+    it('should render FieldValueLabel in all other cases', () => {
+        const { getByText } = wrapper('Deprecated', 'value');
+        expect(getByText('"value"')).toBeInTheDocument();
+        expect(getByText('Deprecated')).toBeInTheDocument();
+    });
+    describe('example type with structured values', () => {
+        const objectValue = {
+            name: 'John Alfred Smith',
+            street: '123 Main Street',
+            city: 'San Francisco',
+        };
+        it('should render object example pretty-printed with JSON highlighting', () => {
+            const { getByTestId, getByText } = render(_jsx(FieldDetail, { label: "Example:", value: objectValue, type: "example" }));
+            expect(getByText('Example:')).toBeInTheDocument();
+            const viewer = getByTestId('json-viewer');
+            // pretty-printed: keys and values are separate tokens on multiple lines,
+            // not a single-line JSON.stringify blob
+            expect(viewer.textContent).toContain('"name"');
+            expect(viewer.textContent).toContain('"John Alfred Smith"');
+            expect(viewer.textContent).toContain('\n');
+            // syntax highlighting: token spans styled by the code theme
+            expect(viewer.querySelector('.token.string')).not.toBeNull();
+        });
+        it('should render array example pretty-printed with JSON highlighting', () => {
+            const { getByTestId } = render(_jsx(FieldDetail, { label: "Example:", value: ['79f943e212cce7de21c054a8'], type: "example" }));
+            const viewer = getByTestId('json-viewer');
+            expect(viewer.textContent).toContain('"79f943e212cce7de21c054a8"');
+            expect(viewer.querySelector('.token.string')).not.toBeNull();
+        });
+        it('should keep scalar example values inline without JSON viewer', () => {
+            const { getByText, queryByTestId } = render(_jsx(FieldDetail, { label: "Example:", value: "HRIS-27", type: "example" }));
+            expect(getByText('"HRIS-27"')).toBeInTheDocument();
+            expect(queryByTestId('json-viewer')).toBeNull();
+        });
+    });
+});
+//# sourceMappingURL=FieldDetail.test.js.map

package/lib/components/PropertyDetails/__tests__/FieldDetails.test.d.ts

@@ -0,0 +1 @@
+export {};

package/lib/components/PropertyDetails/__tests__/FieldDetails.test.js

@@ -0,0 +1,191 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { render, screen } from '@testing-library/react';
+import * as Jotai from 'jotai';
+import { normalizeOptions, OpenAPIParser } from '../../../services/index.js';
+import { FieldDetails } from '../FieldDetails.js';
+import { getField } from '../../../models/index.js';
+import spec from './fixtures/fields.json';
+import { TestBrowserRouter } from '../../../testProviders.js';
+vi.mock('jotai', async () => ({
+    ...(await vi.importActual('jotai')),
+    useAtomValue: vi.fn(),
+}));
+describe('FieldDetails', () => {
+    const options = normalizeOptions({});
+    const parser = new OpenAPIParser(spec, undefined, options);
+    const deps = { operation: { pointer: 'defaultPointer' } };
+    vi.spyOn(Jotai, 'useAtomValue').mockReturnValue(options);
+    it('should render FieldDetails with enum', async () => {
+        options.showAccessMode = true;
+        const field = getField(parser, {
+            name: 'test',
+            in: 'path',
+            content: {
+                'application/json': {
+                    schema: {
+                        $ref: '#/components/testProperties/fieldWithEnum',
+                    },
+                },
+            },
+        }, '', options, deps);
+        render(_jsx(FieldDetails, { field: field }), { wrapper: TestBrowserRouter });
+        expect(screen.getByText('Enum')).toBeInTheDocument();
+        expect(screen.getByText('"foo"')).toBeInTheDocument();
+        expect(screen.getByText('"bar"')).toBeInTheDocument();
+    });
+    it('should render FieldDetails with enum and x-enumDescriptions', async () => {
+        const field = getField(parser, {
+            name: 'test',
+            in: 'path',
+            content: {
+                'application/json': {
+                    schema: {
+                        $ref: '#/components/testProperties/fieldWithEnumDescription',
+                    },
+                },
+            },
+        }, '', options, deps);
+        render(_jsx(FieldDetails, { field: field }), { wrapper: TestBrowserRouter });
+        expect(screen.getByText('Enum Value')).toBeInTheDocument();
+        expect(screen.getByText('foo')).toBeInTheDocument();
+        expect(screen.getByText('bar')).toBeInTheDocument();
+        expect(screen.getByText('Description foo')).toBeInTheDocument();
+        expect(screen.getByText('Description bar')).toBeInTheDocument();
+    });
+    it('should render FieldDetails with enum and x-enumDescription with hiding value', async () => {
+        vi.spyOn(Jotai, 'useAtomValue').mockReturnValue(normalizeOptions({ maxDisplayedEnumValues: 1 }));
+        const field = getField(parser, {
+            name: 'test',
+            in: 'path',
+            content: {
+                'application/json': {
+                    schema: {
+                        $ref: '#/components/testProperties/fieldWithEnumDescription',
+                    },
+                },
+            },
+        }, '', options, deps);
+        render(_jsx(FieldDetails, { field: field }), { wrapper: TestBrowserRouter });
+        expect(screen.getByText('Value')).toBeInTheDocument();
+        expect(screen.getByText('foo')).toBeInTheDocument();
+        expect(screen.getByText('Description foo')).toBeInTheDocument();
+        expect(screen.getByText('+1 more')).toBeInTheDocument();
+    });
+    it('should not render duplicate descriptions for anyOf schemas', async () => {
+        const field = getField(parser, {
+            name: 'testAnyOf',
+            content: {
+                'application/json': {
+                    schema: {
+                        $ref: '#/components/anyOfSchemaWithDescription',
+                    },
+                },
+            },
+        }, '', options, deps);
+        render(_jsx(FieldDetails, { field: field }), { wrapper: TestBrowserRouter });
+        const descriptions = screen.queryAllByText('This is a test anyOf schema with description');
+        expect(descriptions).toHaveLength(0);
+        const plainTextDescriptions = screen.queryAllByText('A plain text value');
+        expect(plainTextDescriptions).toHaveLength(0);
+        const numberDescriptions = screen.queryAllByText('A number value');
+        expect(numberDescriptions).toHaveLength(0);
+    });
+    it('should keep only array-level info on the array field row when items have their own documentation', () => {
+        vi.spyOn(Jotai, 'useAtomValue').mockReturnValue(options);
+        const field = getField(parser, {
+            name: 'owners',
+            required: true,
+            schema: {
+                type: 'array',
+                minItems: 1,
+                maxItems: 20,
+                description: 'List of ACL groups.',
+                items: {
+                    type: 'string',
+                    format: 'email',
+                    maxLength: 256,
+                    pattern: '^\\S+@\\S+$',
+                    description: 'ACL group formatted as an email.',
+                },
+            },
+        }, '', options, deps);
+        render(_jsx(FieldDetails, { field: field }), { wrapper: TestBrowserRouter });
+        expect(screen.getByText('owners')).toBeInTheDocument();
+        expect(screen.getByText('Array of strings')).toBeInTheDocument();
+        expect(screen.getByText('[ 1 .. 20 ] items')).toBeInTheDocument();
+        expect(screen.getByText('List of ACL groups.')).toBeInTheDocument();
+        // the items info is rendered in the nested items row instead
+        expect(screen.queryByText('(email)')).not.toBeInTheDocument();
+        expect(screen.queryByText('<= 256 characters')).not.toBeInTheDocument();
+        expect(screen.queryByText('^\\S+@\\S+$')).not.toBeInTheDocument();
+        expect(screen.queryByText('ACL group formatted as an email.')).not.toBeInTheDocument();
+    });
+    it('should hoist format of trivial items on the array field row', () => {
+        vi.spyOn(Jotai, 'useAtomValue').mockReturnValue(options);
+        const field = getField(parser, {
+            name: 'emails',
+            schema: {
+                type: 'array',
+                items: {
+                    type: 'string',
+                    format: 'email',
+                },
+            },
+        }, '', options, deps);
+        render(_jsx(FieldDetails, { field: field }), { wrapper: TestBrowserRouter });
+        expect(screen.getByText('Array of strings')).toBeInTheDocument();
+        expect(screen.getByText('(email)')).toBeInTheDocument();
+    });
+    it('should render object property example pretty-printed with JSON highlighting', () => {
+        vi.spyOn(Jotai, 'useAtomValue').mockReturnValue(options);
+        const field = getField(parser, {
+            name: 'postal_address',
+            schema: {
+                type: 'object',
+                example: {
+                    name: 'John Alfred Smith',
+                    street: '123 Main Street',
+                    city: 'San Francisco',
+                },
+            },
+        }, '', options, deps);
+        render(_jsx(FieldDetails, { field: field }), { wrapper: TestBrowserRouter });
+        expect(screen.getByText('Example:')).toBeInTheDocument();
+        const viewer = screen.getByTestId('json-viewer');
+        // pretty-printed on multiple lines instead of a single-line JSON.stringify blob
+        expect(viewer.textContent).toContain('"John Alfred Smith"');
+        expect(viewer.textContent).toContain('\n');
+        expect(screen.queryByText(JSON.stringify(field.example))).not.toBeInTheDocument();
+        // syntax highlighting via code theme token spans
+        expect(viewer.querySelector('.token.string')).not.toBeNull();
+    });
+    it('should keep scalar property example inline without JSON viewer', () => {
+        vi.spyOn(Jotai, 'useAtomValue').mockReturnValue(options);
+        const field = getField(parser, {
+            name: 'custom_id',
+            schema: { type: 'string', example: 'HRIS-27' },
+        }, '', options, deps);
+        render(_jsx(FieldDetails, { field: field }), { wrapper: TestBrowserRouter });
+        expect(screen.getByText('"HRIS-27"')).toBeInTheDocument();
+        expect(screen.queryByTestId('json-viewer')).toBeNull();
+    });
+    it('should render x-badges with before position, no position, and after position', () => {
+        const field = getField(parser, {
+            name: 'experimentalFlag',
+            in: 'query',
+            required: false,
+            schema: { type: 'boolean' },
+            'x-badges': [
+                { name: 'Beta', position: 'before' },
+                { name: 'Experimental default' },
+                { name: 'Experimental', position: 'after' },
+            ],
+        }, '#/components/parameters/paramWithBadges', options, deps);
+        render(_jsx(FieldDetails, { field: field }), { wrapper: TestBrowserRouter });
+        expect(screen.getByText('Beta')).toBeInTheDocument();
+        expect(screen.getByText('Experimental default')).toBeInTheDocument();
+        expect(screen.getByText('Experimental')).toBeInTheDocument();
+        expect(screen.getByText('experimentalFlag')).toBeInTheDocument();
+    });
+});
+//# sourceMappingURL=FieldDetails.test.js.map

package/lib/components/PropertyDetails/__tests__/PropertyDetails.test.d.ts

@@ -0,0 +1 @@
+export {};