Subresource Integrity

The CDN URL will be online in about a day after we completed publish to NPM.

:::html
<script
  crossorigin="anonymous"
  integrity="sha384-JrrxPK4UiMUpQfRYck+TH35vDgpZLtot9HqkG6F/pbubNCnNyRCYEbQ0mXH2z8s2"
  src="https://cdn.botframework.com/botframework-webchat/4.17.0/webchat.js"
></script>

:::html
<script
  crossorigin="anonymous"
  integrity="sha384-N+hZt09yrG7gT/xDkupYZeFnCoFR1S4ig9v3h1liavEgPm9C+Lt4MFPv85gfBp6E"
  src="https://cdn.botframework.com/botframework-webchat/4.17.0/webchat-es5.js"
></script>

:::html
<script
  crossorigin="anonymous"
  integrity="sha384-Z6hLc33tM1RVHGaYJbzrd6XkfxUwB+q4915W9K9ogwYqpIIew3oHhDfEzCfk1JgD"
  src="https://cdn.botframework.com/botframework-webchat/4.17.0/webchat-minimal.js"
></script>

Changelog

[4.17.0] - 2024-05-06

Known issues

• Web Chat is not loading with error Uncaught TypeError: Super constructor null of anonymous class is not a constructor
• A bug in webpack@>=5.84.1 is causing the issue. Please update to webpack@>=5.90.0

Breaking changes

• useSendMessage hook is updated to support sending attachments with a message. To reduce complexity, the useSendFiles hook is being deprecated. The hook will be removed on or after 2026-04-03
• styleOptions.uploadThumbnailHeight and styleOptions.uploadThumbnailWidth must be a number of pixels
• useSuggestedActions type is updated to align with its actual implementation, by @OEvgeny, in PR #5122
• Removed deprecated code: connect*, useRenderActivity, useRenderActivityStatus, useRenderAvatar, in PR #5148, by @compulim
• Added named exports in both CommonJS and ES Modules module format, in PR #5148, by @compulim
• Removed deprecated useFocusSendBox() hook, please use useFocus('sendBox') instead, in PR #5150, by @OEvgeny
• HTML-in-Markdown is now supported. To disable this feature, set styleOptions.markdownRenderHTML to false

Added

• Resolves #5083. Added sendAttachmentOn style option to send attachments and text in a single activity, by @ms-jb and @compulim, in PR #5123
• useSendMessage hook is updated to support sending attachments with a message
• useSendBoxAttachments hook is added to get/set attachments in the send box
• Resolves #5081. Added uploadAccept and uploadMultiple style options, by @ms-jb, in PR #5048
• Added sendBoxMiddleware and sendBoxToolbarMiddleware, by @compulim, in PR #5120
• (Experimental) Added botframework-webchat-fluent-theme package for applying Fluent UI theme to Web Chat, by @compulim and @OEvgeny
• Initial commit, in PR #5120
• Inherits Fluent CSS palette if available, in PR #5122
• New send box with Fluent look-and-feel, in PR #5122
  • styleOptions.maxMessageLength to specify maximum length of the outgoing message
• Drag-and-drop file support, in PR #5122
• Added telephone keypad (DTMF keypad), in PR #5122
• Fixed botframework-webchat-fluent-theme/package.json to export *.d.[m]ts and default exports, in PR #5131
• Added support of styleOptions.hideUploadButton, in PR #5132
• Added styleOptions.hideTelephoneKeypadButton and default to true, in PR #5132
• Fit-and-finish on suggested actions and telephone keypad, in PR #5132
• Fixed to keep telephone keypad on-screen on click, in PR #5132
• Disabled send button and hid message length when telephone keypad is shown, in PR #5136
• Added dark theme support, in PR #5138
• Added an information message to the telephone keypad, in PR #5140
• Added animation to focus indicator and pixel-perfected, in PR #5143
• Integrated focus management for send box, in PR #5150, by @OEvgeny
• Added keyboard navigation support into suggested actions, in PR #5154, by @OEvgeny
• Fixes #5166. Fixed "attach file" button in iOS Safari should looks the same as on other platforms, in PR #5167, by @compulim
• (Experimental) Added <LocalizeString /> component which can be used to localize strings, by @OEvgeny in PR #5140
• Added <ThemeProvider> component to apply theme pack to Web Chat, by @compulim, in PR #5120
• Added useMakeThumbnail hook option to create a thumbnail from the file given, by @compulim, in PR #5123 and #5122
• Added moduleFormat and transpiler build info to <meta> tag, in PR #5148, by @compulim
• Added support of rendering HTML-in-Markdown, in PR #5161 and PR #5164, by @compulim, @beyackle2, and @OEvgeny

Fixed

• Fixes #5050. Fixed focus should not blur briefly after tapping on a suggested action, by @compulim, in PR #5097
• Fixes #5111. Fixed keyboard help screen to use HTML description list, by @compulim, in PR #5116
• Fixes #5080. Fixed dateToLocaleISOString for handling sub-hour, by @marclundgren, in PR #5114
• Fixes #5146. Fixed chat history focus indicator should not show up on tap, by @OEvgeny, in PR #5145
• Fixes type portability issues by exporting types from all exported code, in PR #5148, by @compulim
• Fixes missing exports of useNotifications, in PR #5148, by @compulim
• Fixes suggested actions keyboard navigation skips actions after suggested actions got updated, in PR #5150, by @OEvgeny
• Fixes #5155. Fixed "Super constructor null of anonymous class is not a constructor" error in CDN bundle by bumping to webpack@5.91.0, in PR #5156, by @compulim

Changed

• Moved pull request validation pipeline to GitHub Actions, by @compulim, in PR #4976
• Bumped all dependencies to the latest versions, by @compulim in PR #4973, PR #5115, PR #5148, and PR #5156
• Notes: Some components/features in Adaptive Cards are in preview and not ready for production use. Web Chat does not support these components and features
• Production dependencies
  • adaptivecards@3.0.2
  • core-js@3.33.3
  • jwt-decode@4.0.0
  • markdown-it@13.0.2
  • markdown-it-for-inline@2.0.1
  • merge-refs@1.2.2
  • mime@4.0.0
  • redux@5.0.0
  • url-search-params-polyfill@8.2.5
  • use-ref-from@0.0.3
  • whatwg-fetch@3.6.19
• Development dependencies
  • @types/dom-speech-recognition@0.0.4
  • @types/node@20.10.3
  • @types/react@16.14.60
  • @typescript-eslint/eslint-plugin@6.13.2
  • @typescript-eslint/parser@6.13.2
  • axe-core@4.8.2
  • babel-jest@29.7.0
  • concurrently@8.2.2
  • esbuild@0.19.8
  • eslint-config-prettier@9.1.0
  • eslint-plugin-import@2.29.0
  • eslint-plugin-prettier@5.0.1
  • eslint@8.55.0
  • istanbul-lib-coverage@3.2.2
  • jest-image-snapshot@6.3.0
  • jest@29.7.0
  • lint-staged@15.2.0
  • nodemon@3.0.2
  • prettier@3.1.0
  • read-pkg-up@11.0.0
  • read-pkg@9.0.1
  • selenium-webdriver@4.15.0
  • typescript@5.3.2
  • webpack@5.91.0