@redocly/openapi-docs 3.24.0-next.9 → 3.24.1

package/lib/components/MediaTypeSwitch/__tests__/MediaTypesSwitch.test.js

@@ -0,0 +1,79 @@
+import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { act, render } from '@testing-library/react';
+import { MediaTypesSwitch } from '../MediaTypesSwitch.js';
+import { getOperation } from '../../../models/index.js';
+import { normalizeOptions, OpenAPIParser } from '../../../services/index.js';
+import testDefinition from './fixtures/test-definition.json';
+import { withTestProviders } from '../../../testProviders.js';
+describe('Components', () => {
+    describe('MediaTypesSwitch', () => {
+        const options = normalizeOptions({});
+        const parser = new OpenAPIParser(testDefinition, undefined, options);
+        let operation;
+        beforeEach(() => {
+            operation = getOperation(parser, {
+                pointer: '#/paths/~1test/get',
+                pathName: '/test',
+                httpVerb: 'GET',
+                pathParameters: [],
+                pathServers: [],
+                isWebhook: false,
+                isAdditionalOperation: false,
+                ...testDefinition.paths['/test'].get,
+            }, undefined, options, '');
+        });
+        test('renders with default media type by default', () => {
+            const childrenFn = vi.fn((mimeType) => _jsxs(_Fragment, { children: ["children: ", mimeType.name] }));
+            const renderSelectFn = vi.fn(() => null);
+            const { getByText } = render(withTestProviders(_jsx(MediaTypesSwitch, { renderSelect: renderSelectFn, content: operation.requestBody?.content, children: childrenFn }), { definition: parser.definition }));
+            expect(renderSelectFn.mock.calls[0][0].options).toEqual([
+                { idx: 0, value: 'application/json' },
+                { idx: 1, value: 'application/xml' },
+            ]);
+            expect(getByText('children: application/json')).toBeInTheDocument();
+        });
+        test('withLabel renders label', () => {
+            const childrenFn = vi.fn((mimeType) => _jsxs(_Fragment, { children: ["children: ", mimeType.name] }));
+            const renderSelectFn = vi.fn(() => _jsx(_Fragment, { children: "dropdown" }));
+            const { getByText } = render(withTestProviders(_jsx(MediaTypesSwitch, { withLabel: true, renderSelect: renderSelectFn, content: operation.requestBody?.content, children: childrenFn }), { definition: parser.definition }));
+            expect(getByText('Content type')).toBeInTheDocument();
+        });
+        test('should try to restore scroll on switch', async () => {
+            const childrenFn = vi.fn((mimeType) => _jsxs(_Fragment, { children: ["children: ", mimeType.name] }));
+            const renderSelectFn = vi.fn(() => (_jsx(_Fragment, { children: "dropdown" })));
+            const { findByText, container } = render(withTestProviders(_jsx(MediaTypesSwitch, { withLabel: true, renderSelect: renderSelectFn, content: operation.requestBody?.content, children: childrenFn }), { definition: parser.definition }));
+            // Create a mock implementation of window.scrollBy
+            const scrollByMock = vi.fn();
+            Object.defineProperty(window, 'scrollBy', { value: scrollByMock });
+            const rectMock = vi.fn(() => {
+                return (rectMock.mock.calls.length > 1 ? { y: 150 } : { y: 100 });
+            });
+            vi.spyOn(container?.firstElementChild, 'getBoundingClientRect').mockImplementation(rectMock);
+            act(() => {
+                const selectProps = renderSelectFn.mock.calls[0][0];
+                selectProps.onChange(selectProps.options[1]);
+            });
+            await findByText('children: application/xml');
+            await new Promise((resolve) => setTimeout(resolve, 500)); // sleep
+            expect(rectMock).toHaveBeenCalledTimes(2);
+            expect(scrollByMock).toHaveBeenCalledWith(0, 50);
+        });
+        test('should not throw and render null for empty media types', () => {
+            const childrenFn = vi.fn((mimeType) => _jsxs(_Fragment, { children: ["children: ", mimeType.name] }));
+            const renderSelectFn = vi.fn(() => null);
+            const { container } = render(withTestProviders(_jsx(MediaTypesSwitch, { renderSelect: renderSelectFn, 
+                // @ts-ignore invalid content shape
+                content: null, children: childrenFn }), { definition: parser.definition }));
+            expect(container.firstChild).toBeNull();
+            const { container: container2 } = render(withTestProviders(_jsx(MediaTypesSwitch, { renderSelect: renderSelectFn, 
+                // @ts-expect-error invalid content shape
+                content: { mediaTypes: null }, children: childrenFn }), { definition: parser.definition }));
+            expect(container2.firstChild).toBeNull();
+            const { container: container3 } = render(withTestProviders(_jsx(MediaTypesSwitch, { renderSelect: renderSelectFn, 
+                // @ts-expect-error invalid content shape
+                content: { mediaTypes: [] }, children: childrenFn }), { definition: parser.definition }));
+            expect(container3.firstChild).toBeNull();
+        });
+    });
+});
+//# sourceMappingURL=MediaTypesSwitch.test.js.map

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

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

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

@@ -0,0 +1,70 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { render } from '@testing-library/react';
+import { OperationItem } from '../OperationItem.js';
+import { normalizeOptions } from '../../../services/index.js';
+import spec from './fixtures/petstore.json';
+import definition from './fixtures/operationDefinition.json';
+import { environmentAtom } from '../../../jotai/app.js';
+import { globalStoreAtom } from '../../../jotai/store.js';
+import { allOperationsAtom } from '../../../jotai/replay.js';
+import { MockIntersectionObserver } from './__mocks__/mock-intersection-observer.js';
+import { TestBrowserRouter } from '../../../testProviders.js';
+vi.mock('jotai', async () => ({
+    ...(await vi.importActual('jotai')),
+    useAtomValue: vi.fn((a) => {
+        if (a === globalStoreAtom) {
+            return {
+                parser: {
+                    definition: spec,
+                },
+                options: normalizeOptions({
+                    codeSamples: {
+                        languages: [{ lang: 'curl', label: 'curl' }],
+                    },
+                }),
+            };
+        }
+        if (a === environmentAtom) {
+            return [{}, ''];
+        }
+        if (a === allOperationsAtom) {
+            return [];
+        }
+        return {};
+    }),
+    useAtom: vi.fn((a) => {
+        if (a === environmentAtom) {
+            return [[{ server: {} }], vi.fn()];
+        }
+        return [
+            {
+                activeOneOf: { '/paths/~1pet/post': 0 },
+                requestValues: {},
+                request: { expandedFields: {} },
+                response: { expandedFields: {} },
+                activeLanguage: 'curl',
+            },
+            vi.fn(),
+        ];
+    }),
+}));
+describe('OperationItem', () => {
+    beforeAll(() => {
+        window.IntersectionObserver = MockIntersectionObserver;
+    });
+    it('should render badges with correct position', () => {
+        const { getByTestId } = render(_jsx(OperationItem, { item: {
+                operationDefinition: definition,
+                parent: undefined,
+                href: 'test',
+            } }), {
+            wrapper: TestBrowserRouter,
+        });
+        const parentElement = getByTestId('operation-item-header');
+        const childNodes = parentElement.childNodes;
+        expect(childNodes[1].textContent).toBe('Alpha');
+        expect(childNodes[3].textContent).toBe('Beta');
+        expect(childNodes[4].textContent).toBe('Gamma');
+    });
+});
+//# sourceMappingURL=OperationItem.test.js.map

package/lib/components/OperationItem/__tests__/__mocks__/mock-intersection-observer.d.ts

@@ -0,0 +1,16 @@
+export declare class MockIntersectionObserver {
+    readonly root: Element | Document | null;
+    readonly rootMargin: string;
+    readonly scrollMargin: string;
+    readonly thresholds: ReadonlyArray<number>;
+    private viewPort;
+    private entries;
+    private readonly callback;
+    constructor(callback: IntersectionObserverCallback, options?: IntersectionObserverInit);
+    private intersect;
+    isInViewPort(target: HTMLElement): boolean;
+    observe(target: HTMLElement): void;
+    unobserve(target: HTMLElement): void;
+    disconnect(): void;
+    takeRecords(): any[];
+}

package/lib/components/OperationItem/__tests__/__mocks__/mock-intersection-observer.js

@@ -0,0 +1,42 @@
+export class MockIntersectionObserver {
+    root;
+    rootMargin;
+    scrollMargin;
+    thresholds;
+    viewPort;
+    entries;
+    callback;
+    constructor(callback, options) {
+        this.viewPort = options?.root ? options.root : window;
+        this.entries = [];
+        this.root = null;
+        this.rootMargin = '0px';
+        this.scrollMargin = '';
+        this.thresholds = [1];
+        this.callback = callback;
+        this.viewPort.addEventListener('scroll', this.intersect);
+    }
+    intersect = () => {
+        this.entries.map((entry) => {
+            entry.isIntersecting = this.isInViewPort(entry.target);
+        });
+        this.callback(this.entries, this);
+    };
+    isInViewPort(target) {
+        return target.id !== 'toc-0';
+    }
+    observe(target) {
+        this.entries.push({ isIntersecting: false, target });
+    }
+    unobserve(target) {
+        this.entries = this.entries.filter((ob) => ob.target !== target);
+    }
+    disconnect() {
+        this.viewPort.removeEventListener('scroll', this.intersect);
+        this.entries = [];
+    }
+    takeRecords() {
+        return this.entries;
+    }
+}
+//# sourceMappingURL=mock-intersection-observer.js.map

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

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

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

@@ -0,0 +1,59 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { render } from '@testing-library/react';
+import { Overview } from '../Overview.js';
+const mockTranslate = (key, defaultValue) => defaultValue || key;
+describe('Overview', () => {
+    it('should render correctly with full data', () => {
+        const info = {
+            title: 'Test API',
+            version: '1.0.0',
+            description: 'Test description',
+            contact: {
+                name: 'Test Contact',
+                url: 'https://example.com',
+                email: 'test@example.com',
+            },
+            license: {
+                name: 'MIT',
+                url: 'https://opensource.org/licenses/MIT',
+                identifier: 'MIT',
+            },
+            termsOfService: 'https://example.com/terms',
+        };
+        const { container } = render(_jsx(Overview, { info: info, translate: mockTranslate }));
+        expect(container).toMatchSnapshot();
+    });
+    it('should render correctly with partial data', () => {
+        const info = {
+            title: 'Test API',
+            version: '1.0.0',
+        };
+        const { container } = render(_jsx(Overview, { info: info, translate: mockTranslate }));
+        expect(container).toMatchSnapshot();
+    });
+    it('should render correctly with contact data but without a name', () => {
+        const info = {
+            title: 'Test API',
+            version: '1.0.0',
+            contact: {
+                url: 'https://example.com',
+                email: 'test@example.com',
+            },
+        };
+        const { container } = render(_jsx(Overview, { info: info, translate: mockTranslate }));
+        expect(container).toMatchSnapshot();
+    });
+    it('should render license with name and url when identifier is not present', () => {
+        const info = {
+            title: 'Test API',
+            version: '1.0.0',
+            license: {
+                name: 'Apache 2.0',
+                url: 'https://www.apache.org/licenses/LICENSE-2.0.html',
+            },
+        };
+        const { container } = render(_jsx(Overview, { info: info, translate: mockTranslate }));
+        expect(container).toMatchSnapshot();
+    });
+});
+//# sourceMappingURL=Overview.test.js.map

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

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

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

@@ -0,0 +1,36 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { render } from '@testing-library/react';
+import * as Jotai from 'jotai';
+import { Example } from '../Example.js';
+import { normalizeOptions, OpenAPIParser } from '../../../services/index.js';
+import { getExamples } from '../../../models/index.js';
+import testDefinition from './fixtures/mediaTypeUrlencoded.json';
+describe('Example component', () => {
+    const opts = normalizeOptions({});
+    const parser = new OpenAPIParser(testDefinition, undefined, opts);
+    it('render component without error when `externalValue` is pdf file', () => {
+        const example = getExamples({
+            parser,
+            infoOrRef: {
+                summary: 'A sample file',
+                externalValue: 'https://assets.identi.tech/dummy.pdf',
+            },
+            mime: 'application/pdf',
+        });
+        const { container } = render(_jsx(Jotai.Provider, { children: _jsx(Example, { example: example, mimeType: example.mime, onCopyClick: vi.fn() }) }));
+        expect(container).toMatchSnapshot();
+    });
+    it('render component with `externalValue`', () => {
+        const example = getExamples({
+            parser,
+            infoOrRef: {
+                summary: 'A sample json',
+                externalValue: 'https://jsonplaceholder.typicode.com/todos/1',
+            },
+            mime: 'application/json',
+        });
+        const { container } = render(_jsx(Jotai.Provider, { children: _jsx(Example, { example: example, mimeType: example.mime, onCopyClick: vi.fn() }) }));
+        expect(container).toMatchSnapshot();
+    });
+});
+//# sourceMappingURL=Example.test.js.map

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

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

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 {};