diff --git a/src/index.tsx b/src/index.tsx index 802c367..4260166 100644 --- a/src/index.tsx +++ b/src/index.tsx @@ -403,8 +403,12 @@ const Toast = (props: ToastProps) => { classNames?.description, toast?.classNames?.description, )} - dangerouslySetInnerHTML={sanitizeHTML(toast.description as string)} - > + dangerouslySetInnerHTML={ + typeof toast.description === 'string' ? sanitizeHTML(toast.description as string) : undefined + } + > + {typeof toast.description === 'object' ? toast.description : null} + ) : null} {React.isValidElement(toast.cancel) ? ( diff --git a/test/src/app/page.tsx b/test/src/app/page.tsx index 598cf3d..bb121c6 100644 --- a/test/src/app/page.tsx +++ b/test/src/app/page.tsx @@ -155,6 +155,20 @@ export default function Home({ searchParams }: any) { > Updated Toast + + {showAutoClose ?
: null} {showDismiss ?
: null} { await expect(button).toHaveCSS('background-color', 'rgb(219, 239, 255)'); }); + + test('string description is rendered', async ({ page }) => { + await page.getByTestId('string-description').click(); + await expect(page.getByText('string description')).toHaveCount(1); + }); + + test('ReactNode description is rendered', async ({ page }) => { + await page.getByTestId('react-node-description').click(); + await expect(page.getByText('This is my custom ReactNode description')).toHaveCount(1); + }); });