microsoft / BotFramework-WebChat

A highly-customizable web-based client for Azure Bot Services.
https://www.botframework.com/
MIT License
1.59k stars 1.53k forks source link

[Usable - Bot Framework Web Chat - Markdown]: Narrator is not announcing the name for the 'https://bing.com?q=some' and 'http://www.markitdown.net/' links #4716

Closed pgopinadhu closed 1 year ago

pgopinadhu commented 1 year ago

User Experience:

Screen reader users get affected and cannot know the purpose of the links if the screen reader doesn't announce the name of the link when it receives focus. Screen reader users cannot understand its purpose, they miss accessing it.

Note:

User credentials should NOT be included in the bug.

Repro Steps:

  1. Launch URL: https://microsoft.github.io/BotFramework-WebChat/01.getting-started/a.full-bundle/ on edge dev.
  2. Web chat page opens.
  3. Press 4-tab keys to reach 'Type your message' field. Enter the "markdown" keyword on it. Press 1-tab key to reach the 'send' button and activate it with the enter key.
  4. Press 2-shift tabs and 1-down arrow to reach the received card. Activate it with enter key. Focus lands on 'mark it down' link. Turn on screen reader (Narrator).
  5. Press 1 or 2 tab keys to reach 'https://bing.com?q=some' and 'http://www.markitdown.net/ links'.
  6. Verify whether the screen reader announces the name of the links or not.

    Actual Result:

    Narrator is not announcing the name for the 'https://bing.com?q=some' and 'http://www.markitdown.net/' links Observation:

Expected Result:

Narrator should announce the name for the 'https://bing.com?q=some' and 'http://www.markitdown.net/' links when focus lands on them.

Note:

pgopinadhu commented 1 year ago

A11yUsable;#A11ySev4;#HCL;#Accessibility;#Benchmark;#Win11-Edge(Chromium);#BotFrameworkWebChat-May23;

compulim commented 1 year ago

~This is an issue with the bot content, rather than Web Chat. I am going to fix it on the bot side.~

compulim commented 1 year ago

Note to tester, please file this bug to Windows Narrator.

This is an issue with Windows Narrator + Edge 116.0.1931.0 and is outside of Web Chat.

It seems when the link starts with https: and followed by an <img>, Windows Narrator will only narrate "link".

This is the minimal repro.

<!DOCTYPE html>
<html>
  <head> </head>
  <body>
    <p>
      Not repro:
      <a href="https://bing.com/">Hello<img /></a> will be narrated as "link, hello".
    </p>
    <p>
      Repro:
      <a href="https://bing.com/">https:Hello<img /></a> will be narrated as "link".
    </p>
    <p>
      Not repro:
      <a href="https://bing.com/">https:Hello</a> will be narrated as "link, H-T-T-P-S hello".
    </p>
    <p>
      Repro:
      <a href="https://bing.com/">ftp:Hello<img /></a> will be narrated as "link".
    </p>
    <p>
      Repro:
      <a href="https://bing.com/">anything:Hello<img /></a> will be narrated as "link".
    </p>
    <p>
      Not repro:
      <a href="https://bing.com/">anything: Hello<img /></a> will be narrated as "link, anything hello".
    </p>
  </body>
</html>

https://github.com/microsoft/BotFramework-WebChat/assets/1622400/be5e1669-8a0b-4240-b3fe-9fdbb2897bdf