Fix null renderMarkdown and add tests (#2724)

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 `<BasicTranscript>`, 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
 

__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`);
+});

__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);
+});

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

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
+  ]);
 }