Merge branch 'master' into test-focus-sink

.github/ISSUE_TEMPLATE/bug_report.md

@@ -2,12 +2,12 @@
 name: Bug report
 about: Create a report to help us improve
 title: ''
-labels: Bug, Pending, customer-reported
+labels: Bug, Pending, customer-reported, Bot Services
 assignees: ''
 
 ---
 
-<!-- ATTENTION: Bot Framework internals, please remove the `customer-reported` label before submitting this issue. -->
+<!-- ATTENTION: Bot Framework internals, please remove the `customer-reported` and `Bot Services` labels before submitting this issue. -->
 
 <!-- [GitHub issues](https://github.com/microsoft/botframework-webchat/issues) should be used for bugs and feature requests. See the Support section to get support related to Bot Framework and Web Chat. -->
 

.github/ISSUE_TEMPLATE/feature_request.md

@@ -2,12 +2,12 @@
 name: Feature request
 about: Suggest an idea for this project
 title: ''
-labels: Enhancement, Pending, customer-reported
+labels: Enhancement, Pending, customer-reported, Bot Services
 assignees: ''
 
 ---
 
-<!-- ATTENTION: Bot Framework internals, please remove the `customer-reported` label before submitting this issue. -->
+<!-- ATTENTION: Bot Framework internals, please remove the `customer-reported` and `Bot Services` labels before submitting this issue. -->
 
 ## Feature Request
 

.github/ISSUE_TEMPLATE/question-template.md

@@ -2,14 +2,14 @@
 name: Question template
 about: Ask a question not related to implementation here
 title: ''
-labels: Pending, Question, customer-reported
+labels: Question, Pending, customer-reported, Bot Services
 assignees: ''
 
 ---
 
 🚨 The issue tracker is not for implementation questions 🚨
 
-<!-- ATTENTION: Bot Framework internals, please remove the `customer-reported` label before submitting this issue. -->
+<!-- ATTENTION: Bot Framework internals, please remove the `customer-reported`  and `Bot Services` labels before submitting this issue. -->
 
 <!-- If you have other questions on implementation of Web Chat or about other features of Bot Framework, please see the support page on where to direct your question. -->
 

CHANGELOG.md

@@ -76,6 +76,7 @@ and this project adheres to [Semantic Versioning](http://semver.org/spec/v2.0.0.
 -  Fix [#2273](https://github.com/microsoft/BotFramework-WebChat/issues/2273). Add `ScreenReaderText` component, by [@corinagum](https://github.com/corinagum) in PR [#2278](https://github.com/microsoft/BotFramework-WebChat/pull/2278)
 -  Fix [#2231](https://github.com/microsoft/BotFramework-WebChat/issues/2231). Fallback to English (US) if date time formatting failed, by [@compulim](https://github.com/compulim) in PR [#2286](https://github.com/microsoft/BotFramework-WebChat/pull/2286)
 -  Fix [#2298](https://github.com/microsoft/BotFramework-WebChat/issues/2298). Speech synthesize errors to be ignored, by [@compulim](https://github.com/compulim) in PR [#2300](https://github.com/microsoft/BotFramework-WebChat/issues/2300)
+-  Fix [#2243](https://github.com/microsoft/BotFramework-WebChat/issues/2243). Fixed sagas to correctly mark activities with speaking attachments, by [@tdurnford](https://github.com/tdurnford) in PR [#2320](https://github.com/microsoft/BotFramework-WebChat/issues/2320)
 
 ### Added
 
@@ -87,6 +88,8 @@ and this project adheres to [Semantic Versioning](http://semver.org/spec/v2.0.0.
    - [`MessageChannel`](https://developer.mozilla.org/en-US/docs/Web/API/MessageChannel)/[`MessagePort`](https://developer.mozilla.org/en-US/docs/Web/API/MessagePort)
    - [`OffscreenCanvas`](https://developer.mozilla.org/en-US/docs/Web/API/OffscreenCanvas)
       - Specifically [`OffscreenCanvas.getContext('2d')`](https://developer.mozilla.org/en-US/docs/Web/API/OffscreenCanvas/getContext)
+-  Added `timestampFormat` option to the default style options and created `AbsoluteTime` component, by [@tdurnford](https://github.com/tdurnford), in PR [#2295](https://github.com/microsoft/BotFramework-WebChat/pull/2295)
+-  `embed`: Added ES5 polyfills and dev server, by [@compulim](https://github.com/compulim), in PR [#2315](https://github.com/microsoft/BotFramework-WebChat/pull/2315)
 
 ### Samples
 

__tests__/basic.js

@@ -144,3 +144,51 @@ test('thumbnail card with a long title and richCardWrapTitle set to default valu
 
   expect(base64PNG).toMatchImageSnapshot(imageSnapshotOptions);
 });
+
+test('absolute timestamp', async () => {
+  const activities = [
+    {
+      type: 'message',
+      id: '6266x5ZXhXkBfuIH0fNx0h-o|0000000',
+      timestamp: '2019-08-08T16:41:12.9397263Z',
+      from: {
+        id: 'dl_654b35e09ab4149595a70aa6f1af6f50',
+        name: '',
+        role: 'user'
+      },
+      textFormat: 'plain',
+      text: 'echo "Hello, World!"'
+    },
+    {
+      type: 'message',
+      id: '6266x5ZXhXkBfuIH0fNx0h-o|0000001',
+      timestamp: '2019-08-08T16:41:13.1835518Z',
+      from: {
+        id: 'webchat-mockbot',
+        name: 'webchat-mockbot',
+        role: 'bot'
+      },
+      text: 'Echoing back in a separate activity.'
+    },
+    {
+      type: 'message',
+      id: '6266x5ZXhXkBfuIH0fNx0h-o|0000002',
+      timestamp: '2019-08-08T16:41:13.3963019Z',
+      from: {
+        id: 'webchat-mockbot',
+        name: 'webchat-mockbot',
+        role: 'bot'
+      },
+      text: 'Hello, World!'
+    }
+  ];
+  const styleOptions = { timestampFormat: 'absolute' };
+  const { driver } = await setupWebDriver({ storeInitialState: { activities }, props: { styleOptions } });
+
+  await driver.wait(uiConnected(), timeouts.directLine);
+  await driver.wait(minNumActivitiesShown(3), timeouts.directLine);
+
+  const base64PNG = await driver.takeScreenshot();
+
+  expect(base64PNG).toMatchImageSnapshot(imageSnapshotOptions);
+});

__tests__/setup/web/index.html

@@ -92,7 +92,7 @@
       const PASSTHRU_MIDDLEWARE = store => next => action => next(action);
 
       async function main(options) {
-        let { createDirectLine, createStyleSet, props, setup, storeMiddleware = PASSTHRU_MIDDLEWARE } = unmarshal(options);
+        let { createDirectLine, createStyleSet, props, setup, storeInitialState = {}, storeMiddleware = PASSTHRU_MIDDLEWARE } = unmarshal(options);
 
         props = unmarshal(props);
 
@@ -113,7 +113,7 @@
           }
         }, 3);
 
-        const store = window.WebChatTest.store = window.WebChat.createStore({}, store => {
+        const store = window.WebChatTest.store = window.WebChat.createStore(storeInitialState, store => {
           const setupMiddleware = storeMiddleware(store);
 
           return next => {

packages/component/src/Activity/Timestamp.js

@@ -2,14 +2,25 @@ import classNames from 'classnames';
 import PropTypes from 'prop-types';
 import React from 'react';
 
+import AbsoluteTime from '../Utils/AbsoluteTime';
 import connectToWebChat from '../connectToWebChat';
 import RelativeTime from '../Utils/RelativeTime';
 
-const Timestamp = ({ activity: { timestamp }, className, styleSet }) => (
-  <span className={classNames(styleSet.timestamp + '', (className || '') + '')}>
-    <RelativeTime value={timestamp} />
-  </span>
-);
+const Timestamp = ({ activity: { timestamp }, className, styleSet }) => {
+  if (!timestamp) {
+    return false;
+  }
+
+  return (
+    <span className={classNames(styleSet.timestamp + '', (className || '') + '')}>
+      {styleSet.options.timestampFormat === 'relative' ? (
+        <RelativeTime value={timestamp} />
+      ) : (
+        <AbsoluteTime value={timestamp} />
+      )}
+    </span>
+  );
+};
 
 Timestamp.defaultProps = {
   className: ''

packages/component/src/Styles/defaultStyleOptions.js

@@ -99,6 +99,7 @@ const DEFAULT_OPTIONS = {
 
   // Timestamp
   timestampColor: DEFAULT_SUBTLE,
+  timestampFormat: 'relative', // 'absolute'
 
   // Transcript overlay buttons (e.g. carousel and suggested action flippers, scroll to bottom, etc.)
   transcriptOverlayButtonBackground: 'rgba(0, 0, 0, .6)',

packages/component/src/Utils/AbsoluteTime.js

@@ -0,0 +1,26 @@
+/* eslint react/no-unsafe: off */
+
+import PropTypes from 'prop-types';
+import React from 'react';
+
+import { getLocaleString, localize } from '../Localization/Localize';
+import connectToWebChat from '../connectToWebChat';
+import ScreenReaderText from '../ScreenReaderText';
+
+const AbsoluteTime = ({ language, value }) => {
+  const localizedTime = getLocaleString(value, language);
+
+  return (
+    <React.Fragment>
+      <ScreenReaderText text={localize('SentAt', language) + localizedTime} />
+      <span aria-hidden={true}>{localizedTime}</span>
+    </React.Fragment>
+  );
+};
+
+AbsoluteTime.propTypes = {
+  language: PropTypes.string.isRequired,
+  value: PropTypes.string.isRequired
+};
+
+export default connectToWebChat(({ language }) => ({ language }))(AbsoluteTime);

packages/core/src/sagas/speakActivityAndStartDictateOnIncomingActivityFromOthersSaga.js

@@ -15,7 +15,12 @@ function* speakActivityAndStartDictateOnIncomingActivityFromOthers({ userID }) {
     const shouldSpeakIncomingActivity = yield select(shouldSpeakIncomingActivitySelector);
     const shouldSpeak = speakableActivity(activity) && shouldSpeakIncomingActivity;
 
-    if (shouldSpeak && (activity.speak || activity.text)) {
+    if (
+      shouldSpeak &&
+      (activity.speak ||
+        activity.text ||
+        ~(activity.attachments || []).findIndex(({ content: { speak } = {} }) => speak))
+    ) {
       yield put(markActivity(activity, 'speak', true));
     }
 

packages/embed/hostDevServer.js

@@ -0,0 +1,42 @@
+const {
+  createServer,
+  plugins: { queryParser, serveStatic }
+} = require('restify');
+const { join } = require('path');
+const fetch = require('node-fetch');
+const proxy = require('http-proxy-middleware');
+
+const { PORT = 5000 } = process.env;
+const server = createServer();
+
+server.use(queryParser());
+
+server.get('/', async (req, res, next) => {
+  if (!req.query.b) {
+    const tokenRes = await fetch('https://webchat-mockbot.azurewebsites.net/directline/token', {
+      headers: {
+        origin: 'http://localhost:5000'
+      },
+      method: 'POST'
+    });
+
+    if (!tokenRes.ok) {
+      return res.send(500);
+    }
+
+    const { token } = await tokenRes.json();
+
+    return res.send(302, null, {
+      location: `/?b=webchat-mockbot&t=${encodeURIComponent(token)}`
+    });
+  }
+
+  return serveStatic({
+    directory: join(__dirname, 'dist'),
+    file: 'index.html'
+  })(req, res, next);
+});
+
+server.get('/embed/*/config', proxy({ changeOrigin: true, target: 'https://webchat.botframework.com/' }));
+
+server.listen(PORT, () => console.log(`Embed dev server is listening to port ${PORT}`));