Support contentless activity in livestream

.eslintrc.yml

@@ -19,14 +19,6 @@ parserOptions:
   sourceType: module
 
 overrides:
-  - files:
-      - '__tests__/**/*.js'
-      - '*.spec.js'
-      - '*.test.js'
-
-    env:
-      jest: true
-
   - files:
       - 'jest.config.js'
       - 'jest.*.config.js'
@@ -85,6 +77,24 @@ overrides:
       # Shorthanding if-condition with && and ||.
       '@typescript-eslint/no-unused-expressions': off
 
+  - files:
+      - '__tests__/**/*.js'
+      - '**/*.spec.js'
+      - '**/*.spec.jsx'
+      - '**/*.spec.ts'
+      - '**/*.spec.tsx'
+      - '**/*.test.js'
+      - '**/*.test.jsx'
+      - '**/*.test.ts'
+      - '**/*.test.tsx'
+
+    env:
+      jest: true
+
+    rules:
+      '@typescript-eslint/no-require-imports': off
+      no-magic-numbers: off
+
 rules:
   # Only list rules that are not in *:recommended set
   # If rules are set to disable the one in *:recommended, please elaborate the reason

CHANGELOG.md

@@ -82,6 +82,7 @@ Notes: web developers are advised to use [`~` (tilde range)](https://github.com/
 - Added dedicated loading animation for messages in preparing state for Fluent theme, in PR [#5423](https://github.com/microsoft/BotFramework-WebChat/pull/5423), by [@OEvgeny](https://github.com/OEvgeny)
 - Resolved [#2661](https://github.com/microsoft/BotFramework-WebChat/issues/2661) and [#5352](https://github.com/microsoft/BotFramework-WebChat/issues/5352). Added speech recognition continuous mode with barge-in support, in PR [#5426](https://github.com/microsoft/BotFramework-WebChat/pull/5426), by [@RushikeshGavali](https://github.com/RushikeshGavali) and [@compulim](https://github.com/compulim)
    - Set `styleOptions.speechRecognitionContinuous` to `true` with a Web Speech API provider with continuous mode support
+- Added support of [contentless activity in livestream](https://github.com/microsoft/BotFramework-WebChat/blob/main/docs/LIVESTREAMING.md#scenario-3-interim-activities-with-no-content), in PR [#5430](https://github.com/microsoft/BotFramework-WebChat/pull/5430), by [@compulim](https://github.com/compulim)
 
 ### Changed
 

__tests__/basic.js

@@ -22,184 +22,3 @@ test('setup', async () => {
 
   expect(base64PNG).toMatchImageSnapshot(imageSnapshotOptions);
 });
-
-test('long URLs with break-word', async () => {
-  const { driver, pageObjects } = await setupWebDriver();
-
-  await driver.wait(uiConnected(), timeouts.directLine);
-  await pageObjects.sendMessageViaSendBox(
-    'https://subdomain.domain.com/pathname0/pathname1/pathname2/pathname3/pathname4/',
-    { waitForSend: true }
-  );
-
-  await driver.wait(minNumActivitiesShown(2), timeouts.directLine);
-  await driver.wait(allImagesLoaded(), timeouts.fetchImage);
-
-  const base64PNG = await driver.takeScreenshot();
-
-  expect(base64PNG).toMatchImageSnapshot(imageSnapshotOptions);
-});
-
-test('long URLs with break-all', async () => {
-  const WEB_CHAT_PROPS = { styleOptions: { messageActivityWordBreak: 'break-all' } };
-
-  const { driver, pageObjects } = await setupWebDriver({ props: WEB_CHAT_PROPS });
-
-  await driver.wait(uiConnected(), timeouts.directLine);
-  await pageObjects.sendMessageViaSendBox(
-    'https://subdomain.domain.com/pathname0/pathname1/pathname2/pathname3/pathname4/',
-    { waitForSend: true }
-  );
-
-  await driver.wait(minNumActivitiesShown(2), timeouts.directLine);
-  await driver.wait(allImagesLoaded(), timeouts.fetchImage);
-
-  const base64PNG = await driver.takeScreenshot();
-
-  expect(base64PNG).toMatchImageSnapshot(imageSnapshotOptions);
-});
-
-test('long URLs with keep-all', async () => {
-  const WEB_CHAT_PROPS = { styleOptions: { messageActivityWordBreak: 'keep-all' } };
-
-  const { driver, pageObjects } = await setupWebDriver({ props: WEB_CHAT_PROPS });
-
-  await driver.wait(uiConnected(), timeouts.directLine);
-  await pageObjects.sendMessageViaSendBox('箸より重いものを持ったことがない箸より重いものを持ったことがない', {
-    waitForSend: true
-  });
-
-  await driver.wait(minNumActivitiesShown(2), timeouts.directLine);
-  await driver.wait(allImagesLoaded(), timeouts.fetchImage);
-
-  const base64PNG = await driver.takeScreenshot();
-
-  expect(base64PNG).toMatchImageSnapshot(imageSnapshotOptions);
-});
-
-test('hero card with a long title and richCardWrapTitle set to true', async () => {
-  const { driver, pageObjects } = await setupWebDriver({ props: { styleOptions: { richCardWrapTitle: true } } });
-
-  await driver.wait(uiConnected(), timeouts.directLine);
-  await pageObjects.sendMessageViaSendBox('herocard long title', { waitForSend: true });
-
-  await driver.wait(minNumActivitiesShown(2), timeouts.directLine);
-  await driver.wait(allImagesLoaded(), timeouts.fetchImage);
-
-  const base64PNG = await driver.takeScreenshot();
-
-  expect(base64PNG).toMatchImageSnapshot(imageSnapshotOptions);
-});
-
-test('hero card with a long title and richCardWrapTitle set to default value', async () => {
-  const { driver, pageObjects } = await setupWebDriver();
-
-  await driver.wait(uiConnected(), timeouts.directLine);
-  await pageObjects.sendMessageViaSendBox('herocard long title', { waitForSend: true });
-
-  await driver.wait(minNumActivitiesShown(2), timeouts.directLine);
-  await driver.wait(allImagesLoaded(), timeouts.fetchImage);
-
-  const base64PNG = await driver.takeScreenshot();
-
-  expect(base64PNG).toMatchImageSnapshot(imageSnapshotOptions);
-});
-
-test('thumbnail card with a long title and richCardWrapTitle set to true', async () => {
-  const { driver, pageObjects } = await setupWebDriver({ props: { styleOptions: { richCardWrapTitle: true } } });
-
-  await driver.wait(uiConnected(), timeouts.directLine);
-  await pageObjects.sendMessageViaSendBox('thumbnailcard long title', { waitForSend: true });
-
-  await driver.wait(minNumActivitiesShown(2), timeouts.directLine);
-  await driver.wait(allImagesLoaded(), timeouts.fetchImage);
-
-  const base64PNG = await driver.takeScreenshot();
-
-  expect(base64PNG).toMatchImageSnapshot(imageSnapshotOptions);
-});
-
-test('thumbnail card with a long title and richCardWrapTitle set to default value', async () => {
-  const { driver, pageObjects } = await setupWebDriver();
-
-  await driver.wait(uiConnected(), timeouts.directLine);
-  await pageObjects.sendMessageViaSendBox('thumbnailcard long title', { waitForSend: true });
-
-  await driver.wait(minNumActivitiesShown(2), timeouts.directLine);
-  await driver.wait(allImagesLoaded(), timeouts.fetchImage);
-
-  const base64PNG = await driver.takeScreenshot();
-
-  expect(base64PNG).toMatchImageSnapshot(imageSnapshotOptions);
-});
-
-test('absolute timestamp', async () => {
-  const activities = [
-    {
-      channelData: {},
-      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!"'
-    },
-    {
-      channelData: {},
-      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.'
-    },
-    {
-      channelData: {},
-      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);
-});
-
-test('avatar background color', async () => {
-  const styleOptions = {
-    botAvatarBackgroundColor: 'red',
-    botAvatarInitials: 'B',
-    userAvatarBackgroundColor: 'blue',
-    userAvatarInitials: 'TJ'
-  };
-
-  const { driver, pageObjects } = await setupWebDriver({ props: { styleOptions } });
-
-  await driver.wait(uiConnected(), timeouts.directLine);
-  await pageObjects.sendMessageViaSendBox('echo "Hello, World!"', { waitForSend: true });
-
-  await driver.wait(minNumActivitiesShown(3), timeouts.directLine);
-
-  const base64PNG = await driver.takeScreenshot();
-
-  expect(base64PNG).toMatchImageSnapshot(imageSnapshotOptions);
-});

__tests__/html/conversationStartProperties.noLocaleIsSent.html

@@ -24,7 +24,7 @@
         await pageConditions.uiConnected();
 
         await pageObjects.sendMessageViaSendBox('conversationstart');
-        await pageConditions.minNumActivitiesShown(1);
+        await pageConditions.minNumActivitiesShown(2);
 
         await host.snapshot();
       });

__tests__/html/conversationStartProperties.sendEnUs.html

@@ -27,7 +27,7 @@
         await pageConditions.uiConnected();
 
         await pageObjects.sendMessageViaSendBox('conversationstart');
-        await pageConditions.minNumActivitiesShown(1);
+        await pageConditions.minNumActivitiesShown(2);
 
         await host.snapshot();
       });

__tests__/html/conversationStartProperties.sendInvalidType.html

@@ -27,7 +27,7 @@
         await pageConditions.uiConnected();
 
         await pageObjects.sendMessageViaSendBox('conversationstart');
-        await pageConditions.minNumActivitiesShown(1);
+        await pageConditions.minNumActivitiesShown(2);
 
         await host.snapshot();
       });

__tests__/html/conversationStartProperties.sendNonExisting.html

@@ -27,7 +27,7 @@
         await pageConditions.uiConnected();
 
         await pageObjects.sendMessageViaSendBox('conversationstart');
-        await pageConditions.minNumActivitiesShown(1);
+        await pageConditions.minNumActivitiesShown(2);
 
         await host.snapshot();
       });

__tests__/html/conversationStartProperties.sendNonISOFormat.html

@@ -27,7 +27,7 @@
         await pageConditions.uiConnected();
 
         await pageObjects.sendMessageViaSendBox('conversationstart');
-        await pageConditions.minNumActivitiesShown(1);
+        await pageConditions.minNumActivitiesShown(2);
 
         await host.snapshot();
       });

__tests__/html/conversationStartProperties.sendZhCn.html

@@ -27,7 +27,7 @@
         await pageConditions.uiConnected();
 
         await pageObjects.sendMessageViaSendBox('conversationstart');
-        await pageConditions.minNumActivitiesShown(1);
+        await pageConditions.minNumActivitiesShown(2);
 
         await host.snapshot();
       });

__tests__/html/hooks.useActiveTyping.html

@@ -90,22 +90,28 @@
         await pageObjects.typeInSendBox('.');
 
         // THEN: `useActiveTyping` should return both.
-        await expect(renderWithFunction(() => Object.values(useActiveTyping()[0]))).resolves.toEqual([
-          {
-            at: 600,
-            expireAt: 5600,
-            name: expect.any(String),
-            role: 'bot',
-            type: 'busy'
-          },
-          {
-            at: 600,
-            expireAt: 5600,
-            name: expect.any(String),
-            role: 'user',
-            type: 'busy'
-          }
-        ]);
+        const hookResult = await renderWithFunction(() => Object.values(useActiveTyping()[0]));
+
+        expect(hookResult).toHaveLength(2);
+
+        expect(hookResult).toEqual(
+          expect.arrayContaining([
+            {
+              at: 600,
+              expireAt: 5600,
+              name: expect.any(String),
+              role: 'bot',
+              type: 'busy'
+            },
+            {
+              at: 600,
+              expireAt: 5600,
+              name: expect.any(String),
+              role: 'user',
+              type: 'busy'
+            }
+          ])
+        );
       });
     </script>
   </body>

__tests__/html/hooks.useActiveTyping.livestream.html

@@ -74,7 +74,7 @@
           {
             bot: {
               at: 600,
-              expireAt: 5600,
+              expireAt: Infinity,
               name: 'Bot',
               role: 'bot',
               type: 'livestream'