diff --git a/CHANGELOG.md b/CHANGELOG.md index 3aa4d8e60a..e258bd6a89 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -79,6 +79,7 @@ and this project adheres to [Semantic Versioning](http://semver.org/spec/v2.0.0. - Fixes [#2709](https://github.com/microsoft/BotFramework-WebChat/issues/2709). Reduce wasted render of activities by memoizing partial result of ``, by [@compulim](https://github.com/compulim) in PR [#2710](https://github.com/microsoft/BotFramework-WebChat/pull/2710) - Fixes [#2710](https://github.com/microsoft/BotFramework-WebChat/issues/2710). Suggested actions container should persist for AT, by [@corinagum](https://github.com/corinagum) in PR [#2710](https://github.com/microsoft/BotFramework-WebChat/pull/2710) - Fixes [#2718](https://github.com/microsoft/BotFramework-WebChat/issues/2718). Add `Object.is` polyfill for IE11, by [@compulim](https://github.com/compulim) in PR [#2719](https://github.com/microsoft/BotFramework-WebChat/pull/2719) +- Fixes [#2723](https://github.com/microsoft/BotFramework-WebChat/issues/2723). Fix `renderMarkdown` should not be called if it is `undefined` in minimal bundle, by [@compulim](https://github.com/compulim) in PR [#2724](https://github.com/microsoft/BotFramework-WebChat/pull/2724) ### Changed diff --git a/__tests__/__image_snapshots__/chrome-docker/markdown-js-null-render-markdown-function-1-snap.png b/__tests__/__image_snapshots__/chrome-docker/markdown-js-null-render-markdown-function-1-snap.png new file mode 100644 index 0000000000..0f95efd451 Binary files /dev/null and b/__tests__/__image_snapshots__/chrome-docker/markdown-js-null-render-markdown-function-1-snap.png differ diff --git a/__tests__/hooks/useRenderMarkdownAsHTML.js b/__tests__/hooks/useRenderMarkdownAsHTML.js index da175d0214..fce52dd637 100644 --- a/__tests__/hooks/useRenderMarkdownAsHTML.js +++ b/__tests__/hooks/useRenderMarkdownAsHTML.js @@ -24,3 +24,13 @@ test('renderMarkdown should use custom Markdown transform function from props', pageObjects.runHook('useRenderMarkdownAsHTML', [], fn => fn('Hello, World!')) ).resolves.toMatchInlineSnapshot(`"HELLO, WORLD!"`); }); + +test('renderMarkdown should return falsy if the custom Markdown transform function is null', async () => { + const { pageObjects } = await setupWebDriver({ + props: { + renderMarkdown: null + } + }); + + await expect(pageObjects.runHook('useRenderMarkdownAsHTML', [], fn => !!fn)).resolves.toMatchInlineSnapshot(`false`); +}); diff --git a/__tests__/markdown.js b/__tests__/markdown.js index 4aca9dcef6..f1041fcbc4 100644 --- a/__tests__/markdown.js +++ b/__tests__/markdown.js @@ -22,3 +22,16 @@ test('hero card', async () => { expect(base64PNG).toMatchImageSnapshot(imageSnapshotOptions); }); + +test('null renderMarkdown function', async () => { + const { driver, pageObjects } = await setupWebDriver({ props: { renderMarkdown: null } }); + + await pageObjects.sendMessageViaSendBox('echo **This text should be plain text**', { waitForSend: true }); + + await driver.wait(allImagesLoaded(), timeouts.fetch); + await driver.wait(minNumActivitiesShown(2), timeouts.directLine); + + const base64PNG = await driver.takeScreenshot(); + + expect(base64PNG).toMatchImageSnapshot(imageSnapshotOptions); +}); diff --git a/packages/bundle/src/useComposerProps.js b/packages/bundle/src/useComposerProps.js index e4f9923ac2..c575e958b6 100644 --- a/packages/bundle/src/useComposerProps.js +++ b/packages/bundle/src/useComposerProps.js @@ -22,6 +22,7 @@ export default function useComposerProps({ attachmentMiddleware, renderMarkdown, return { attachmentMiddleware: patchedAttachmentMiddleware, extraStyleSet, - renderMarkdown: renderMarkdown || (text => defaultRenderMarkdown(text, patchedStyleOptions)) + renderMarkdown: + typeof renderMarkdown === 'undefined' ? text => defaultRenderMarkdown(text, patchedStyleOptions) : renderMarkdown }; } diff --git a/packages/component/src/hooks/useRenderMarkdownAsHTML.js b/packages/component/src/hooks/useRenderMarkdownAsHTML.js index 7fb682addc..250270429a 100644 --- a/packages/component/src/hooks/useRenderMarkdownAsHTML.js +++ b/packages/component/src/hooks/useRenderMarkdownAsHTML.js @@ -1,4 +1,4 @@ -import { useCallback } from 'react'; +import { useMemo } from 'react'; import useStyleOptions from '../hooks/useStyleOptions'; import useWebChatUIContext from './internal/useWebChatUIContext'; @@ -7,5 +7,8 @@ export default function useRenderMarkdownAsHTML() { const { renderMarkdown } = useWebChatUIContext(); const [styleOptions] = useStyleOptions(); - return useCallback(markdown => renderMarkdown(markdown, styleOptions), [renderMarkdown, styleOptions]); + return useMemo(() => renderMarkdown && (markdown => renderMarkdown(markdown, styleOptions)), [ + renderMarkdown, + styleOptions + ]); }