Merge branch 'main' into bump-speech-sdk-1.23.0

Author: compulim

CHANGELOG.md

@@ -24,6 +24,7 @@ and this project adheres to [Semantic Versioning](http://semver.org/spec/v2.0.0.
 
 ### Changed
 
+-  Bumped Adaptive Cards to [`adaptivecards@2.11.1`](https://npmjs.com/package/adaptivecards), by [@compulim](https://github.com/compulim) in PR [#4424](https://github.com/microsoft/BotFramework-WebChat/pull/4424)
 -  Bumped Microsoft Cognitive Services Speech SDK to [`microsoft-cognitiveservices-speech-sdk@1.23.0`](https://npmjs.com/package/microsoft-cognitiveservices-speech-sdk), by [@compulim](https://github.com/compulim) in PR [#4424](https://github.com/microsoft/BotFramework-WebChat/pull/4435)
    -  Also bumped [`web-speech-cognitive-services@7.1.2`](https://npmjs.com/package/web-speech-cognitive-services)
 -  Bumped all dependencies to the latest versions, by [@compulim](https://github.com/compulim) in PR [#4423](https://github.com/microsoft/BotFramework-WebChat/pull/4423)

__tests__/html/accessibility.adaptiveCard.disabled.focus.withShowCard.html

@@ -146,8 +146,13 @@
         // WHEN: Pressing TAB key.
         await host.sendKeys('TAB');
 
-        // THEN: It should focus on the first textbox (this is done by Adaptive Cards, they set tabindex="-1" on other buttons).
-        //       We just verify whatever behavior they have.
+        // THEN: It should focus on the "Skip" button.
+        expect(document.activeElement).toBe(document.querySelector('button[title="Skip"]'));
+
+        // WHEN: Pressing TAB key again.
+        await host.sendKeys('TAB');
+
+        // THEN: It should focus on the textbox.
         expect(document.activeElement).toBe(document.querySelector('input'));
 
         // WHEN: Pressing TAB key.

__tests__/html/accessibility.adaptiveCard.disabled.inputs.html

@@ -77,6 +77,7 @@
             'DOWN', // What color do you want? Red
             'DOWN', // Green
             'TAB',
+            'TAB', // AC 2.11: Checkbox group container has tabindex="0"
             'SPACE', // What colors do you want? Red
             'TAB',
             'SPACE', // Green

__tests__/html/accessibility.liveRegion.activityStatus.sendFailed.event.html

@@ -29,15 +29,35 @@
 
           await pageConditions.uiConnected();
 
-          const { flush } = pageObjects.observeLiveRegion();
+          const { disconnect, flush } = pageObjects.observeLiveRegion();
 
-          const sendMessage = await directLine.emulateOutgoingActivity({ name: 'hello', type: 'event', value: 'aloha' });
+          try {
+            const sendMessage = await directLine.emulateOutgoingActivity({
+              name: 'hello',
+              type: 'event',
+              value: 'aloha'
+            });
 
-          sendMessage.rejectPostActivity(new Error('artificial error'));
+            sendMessage.rejectPostActivity(new Error('artificial error'));
 
-          await directLine.emulateIncomingActivity('Aloha!');
+            await directLine.emulateIncomingActivity('Aloha!');
 
-          expect(flush()).toEqual(['Bot said:\nAloha!']);
+            await pageConditions.became(
+              'live region narrated bot message',
+              () => {
+                try {
+                  expect(flush()).toEqual(['Bot said:\nAloha!']);
+
+                  return true;
+                } catch {
+                  return false;
+                }
+              },
+              1000
+            );
+          } finally {
+            disconnect();
+          }
         },
         { ignoreErrors: true }
       );

__tests__/html/accessibility.liveRegion.activityStatus.sendFailed.html

@@ -29,21 +29,45 @@
 
           await pageConditions.uiConnected();
 
-          const { flush } = pageObjects.observeLiveRegion();
+          const { disconnect, flush } = pageObjects.observeLiveRegion();
 
-          const sendMessage = await directLine.emulateOutgoingActivity('Hello, World!');
+          try {
+            const sendMessage = await directLine.emulateOutgoingActivity('Hello, World!');
 
-          await directLine.emulateIncomingActivity('Aloha!');
+            await directLine.emulateIncomingActivity('Aloha!');
 
-          sendMessage.rejectPostActivity(new Error('artificial error'));
+            sendMessage.rejectPostActivity(new Error('artificial error'));
 
-          await pageConditions.became(
-            'failed to send message',
-            () => pageElements.activityStatuses()[0]?.innerText === 'Send failed. Retry.',
-            1000
-          );
+            await pageConditions.became(
+              'failed to send message',
+              () => pageElements.activityStatuses()[0]?.innerText === 'Send failed. Retry.',
+              1000
+            );
+
+            const liveRegionText = [];
+
+            await pageConditions.became(
+              'live region narrated failed to send message',
+              () => {
+                try {
+                  liveRegionText.push(...flush());
+
+                  expect(liveRegionText).toEqual([
+                    'You said:\nHello, World!',
+                    'Bot said:\nAloha!',
+                    'Failed to send message.'
+                  ]);
 
-          expect(flush()).toEqual(['You said:\nHello, World!', 'Bot said:\nAloha!', 'Failed to send message.']);
+                  return true;
+                } catch (err) {
+                  return false;
+                }
+              },
+              1000
+            );
+          } finally {
+            disconnect();
+          }
         },
         { ignoreErrors: true }
       );

__tests__/html/accessibility.liveRegion.activityStatus.sendFailed.typing.html

@@ -29,15 +29,31 @@
 
           await pageConditions.uiConnected();
 
-          const { flush } = pageObjects.observeLiveRegion();
-
-          const sendMessage = await directLine.emulateOutgoingActivity({ type: 'typing' });
-
-          sendMessage.rejectPostActivity(new Error('artificial error'));
-
-          await directLine.emulateIncomingActivity('Aloha!');
-
-          expect(flush()).toEqual(['Bot said:\nAloha!']);
+          const { disconnect, flush } = pageObjects.observeLiveRegion();
+
+          try {
+            const sendMessage = await directLine.emulateOutgoingActivity({ type: 'typing' });
+
+            sendMessage.rejectPostActivity(new Error('artificial error'));
+
+            await directLine.emulateIncomingActivity('Aloha!');
+
+            await pageConditions.became(
+              'live region narrated bot message',
+              () => {
+                try {
+                  expect(flush()).toEqual(['Bot said:\nAloha!']);
+
+                  return true;
+                } catch {
+                  return false;
+                }
+              },
+              1000
+            );
+          } finally {
+            disconnect();
+          }
         },
         { ignoreErrors: true }
       );

packages/bundle/package-lock.json

@@ -47,7 +47,7 @@
   },
   "dependencies": {
     "@babel/runtime": "7.19.0",
-    "adaptivecards": "2.10.0",
+    "adaptivecards": "2.11.1",
     "botframework-directlinejs": "0.15.1",
     "botframework-directlinespeech-sdk": "0.0.0-0",
     "botframework-webchat-api": "0.0.0-0",

packages/bundle/package.json

@@ -22,6 +22,7 @@ export default function observeLiveRegion() {
   mutationObserver.observe(liveRegionElement, { childList: true });
 
   return {
+    disconnect: () => mutationObserver.disconnect(),
     flush: () => liveRegionInnerTexts.splice(0),
     getInnerTexts: () => Object.freeze([...liveRegionInnerTexts])
   };