microsoft / BotFramework-WebChat

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

Instead of only error messages being read, extra information is being read which is not required and can be confusing to user. #4888

Closed Kirank915 closed 8 months ago

Kirank915 commented 11 months ago

Is it an issue related to Adaptive Cards?

No.

What is the PWD impact?

Screen reader users will be confused if extra information is being read which is not required.

What browsers and screen readers do this issue affect?

Windows: Edge with Windows Narrator

Are there any code-based customization done to Web Chat?

No, I am using Web Chat without any customizations except "styleOptions".

What version of Web Chat are you using?

Latest production

Which area does this issue affect?

Others or unrelated

What is the public URL for the website?

https://servicesuat.microsoft.com/#/opdashboard/

How to reproduce the issue?

  1. Hit the URL https://servicesuat.microsoft.com/#/opdashboard/
  2. Tab till iris bot icon in the header section and press enter.
  3. Iris bit welcome screen will be displayed
  4. Tab till type your message textbox and type Sap access request.
  5. Select self and press enter.
  6. Start Narrator and tab till submit button and press enter.

What do you expect?

Screen reader should read only the displayed error messages.

What actually happened?

Observe that two error messages are being displayed when user is not filling in the required fields but the name for all the checboxes are being read along with error message which is confusing for the user.

Environment Details:

Do you have any screenshots or recordings to repro the issue?

11059109A11y_Intelligent Support_Iris bot_SAPaccessrequest_ScreenReader.webm

Did you find any DOM elements that might have caused the issue?

No response

MAS reference

MAS 1.3.1 – Info and Relationships

WCAG reference

No response

WAI-ARIA reference

No response

Adaptive Card JSON

No response

Additional context

No response

v-prahu commented 11 months ago

A11yMAS;#A11ySev2;#MAS1.3.1;#HCL;#Accessibility;#FeatureBotframeworkwebchat-Apr23;

Kirank915 commented 11 months ago

This bug is copied from TCS team: Bug 11059109

compulim commented 11 months ago

This is an issue with Adaptive Cards. I tried the JSON in AC Designer and repro.

AC controls how the form is getting validated.

{
  "type": "AdaptiveCard",
  "version": "1.3",
  "body": [
    {
      "type": "ColumnSet",
      "columns": [
        {
          "type": "Column",
          "width": "2",
          "items": [
            {
              "type": "TextBlock",
              "weight": "bolder",
              "text": "Please enter the below details to create SAP user account request",
              "wrap": true
            },
            {
              "type": "Input.ChoiceSet",
              "id": "Roles",
              "value": "",
              "style": "expanded",
              "isMultiSelect": true,
              "choices": [
                {
                  "title": "ES Project Manager",
                  "value": "YR:ES_PROJECT_MGR_0000"
                },
                {
                  "title": "ES Relationship Manager",
                  "value": "YR:ES_RELATIONSHIP_MGR_0000"
                },
                {
                  "title": "ES Operations Specialist - Non-Confidential",
                  "value": "YR:ES_OPS_SPECIALIST_0000"
                },
                {
                  "title": "ES Operations Specialist - Confidential",
                  "value": "YR:ES_OPS_SPECIALIST_CNFD_0000"
                },
                {
                  "title": "ES Operations Specialist - Confidential(USPS)",
                  "value": "YR:ES_OPS_SPC_USPS_CNFD_0000"
                },
                {
                  "title": "ES Operations Pricing Maintenance (Business Add On)",
                  "value": "YRESOP0000"
                },
                {
                  "title": "ES Business Desk Support Read Only - Confidential",
                  "value": "YR:ES_BUS_SUPPT_DISP_CNFD_0000"
                },
                {
                  "title": "ES Business Desk Support Read Only",
                  "value": "YR:ES_BUS_SUPPT_DISPLAY_0000"
                },
                {
                  "title": "ES Operations Read Only - Non-Confidential",
                  "value": "YR:ES_OPS_DISPLAY_0000"
                },
                {
                  "title": "ES Operations Read Only - Confidential",
                  "value": "YR:ES_OPS_DISPLAY_CNFD_0000"
                },
                {
                  "title": "ES Operations Read Only - Confidential(USPS)",
                  "value": "YR:ES_OPS_DIS_USPS_CNFD_0000"
                },
                {
                  "title": "ES Project Controller - Non-Confidential",
                  "value": "YR:ES_PROJECT_CONTROLLER_0000"
                },
                {
                  "title": "ES Project Controller - Confidential",
                  "value": "YR:ES_PROJECT_CTRLR_CNFD_0000"
                },
                {
                  "title": "ES Compliance - Non-Confidential",
                  "value": "YR:ES_COMPLIANCE_0000"
                },
                {
                  "title": "ES Compliance - Confidential",
                  "value": "YR:ES_COMPLIANCE_CNFD_0000"
                },
                {
                  "title": "Enterprise Services Authorization Role (Business Add On)",
                  "value": "YRESAD0000"
                },
                {
                  "title": "ES Business Read Only (Plan and Forecast Access)",
                  "value": "YR:ES_BUS_RO_PLFC_0000"
                }
              ],
              "wrap": true,
              "isRequired": true,
              "label": "Role",
              "errorMessage": "Please select the role"
            },
            {
              "type": "Input.Text",
              "id": "Justification",
              "value": "",
              "isMultiline": true,
              "isRequired": true,
              "label": "Business Justification",
              "errorMessage": "Please provide the business justification",
              "wrap": true
            }
          ]
        }
      ]
    }
  ],
  "actions": [
    {
      "type": "Action.Submit",
      "data": {
        "id": "SAPUserRequest_Submit"
      },
      "title": "Submit"
    }
  ]
}
compulim commented 8 months ago

Please file the issue to Adaptive Cards team.