diff --git a/code/renderers/react/src/docs/jsxDecorator.test.tsx b/code/renderers/react/src/docs/jsxDecorator.test.tsx index 57b1f3d4f61e..c7d3aaaf02df 100644 --- a/code/renderers/react/src/docs/jsxDecorator.test.tsx +++ b/code/renderers/react/src/docs/jsxDecorator.test.tsx @@ -1,5 +1,5 @@ /* eslint-disable jsx-a11y/no-static-element-interactions, jsx-a11y/click-events-have-key-events */ -import React, { createElement, FC, PropsWithChildren } from 'react'; +import React, { createElement, FC, Profiler, PropsWithChildren } from 'react'; import PropTypes from 'prop-types'; import { addons, useEffect } from '@storybook/addons'; import { SNIPPET_RENDERED } from '@storybook/docs-tools'; @@ -137,6 +137,23 @@ describe('renderJsx', () => { `); }); + it('Profiler', () => { + function ProfilerComponent(props: any) { + return ( + {}}> +
{props.children}
+
+ ); + } + + expect(renderJsx(createElement(ProfilerComponent, {}, 'I am Profiler'), {})) + .toMatchInlineSnapshot(` + + I am Profiler + + `); + }); + it('should not add default props to string if the prop value has not changed', () => { const Container = ({ className, children }: { className: string; children: string }) => { return
{children}
; diff --git a/code/renderers/react/src/docs/jsxDecorator.tsx b/code/renderers/react/src/docs/jsxDecorator.tsx index 343c30de9d95..c12fd692296a 100644 --- a/code/renderers/react/src/docs/jsxDecorator.tsx +++ b/code/renderers/react/src/docs/jsxDecorator.tsx @@ -79,6 +79,7 @@ export const renderJsx = (code: React.ReactElement, options: JSXOptions) => { // To get exotic component names resolving properly displayName: (el: any): string => el.type.displayName || + (el.type === Symbol.for('react.profiler') ? 'Profiler' : null) || getDocgenSection(el.type, 'displayName') || (el.type.name !== '_default' ? el.type.name : null) || (typeof el.type === 'function' ? 'No Display Name' : null) || @@ -119,7 +120,7 @@ export const renderJsx = (code: React.ReactElement, options: JSXOptions) => { return string; }).join('\n'); - return result.replace(/function\s+noRefCheck\(\)\s+\{\}/, '() => {}'); + return result.replace(/function\s+noRefCheck\(\)\s+\{\}/g, '() => {}'); }; const defaultOpts = {