• Type: Bug
• Resolution: Unresolved
• Priority: Medium (View bug fix roadmap)
• Fix Version/s: None
• Affects Version/s: 8.20.30, 9.12.2, 9.4.17
• Component/s: (Advanced Roadmaps) Accessibility
• Labels:

  • 1.3.1
  • Level-A
  • WCAG2.1
  • a11y-triaged
  • ax-at-JAWS
  • ax-at-NVDA
  • ax-at-VO
  • ax-at-user
  • ax-bug
  • ax-desktop
  • ax-high-priority
  • ax-jiradc-arj
  • ax-jiradc-arj-vpat2024
  • ax-jiradc-vpat
  • ax-jiradc-vpat-accessibilityassesmentteams
  • ax-jiradc-vpat-accessibilityassessmentroadmaps
  • ax-jiradc-vpat-pg04
  • ax-macos-safari
  • ax-qa
  • batman-frontend-triaged
  • ril

1. 

   image-2024-02-12-15-34-19-102.png

   734 kB

   12/Feb/2024 10:04 AM

[JSWSERVER-25735] Accessibility Assessment | Teams: Incorrect explicit association for shared team field

Marc Dacanay made changes - 13/Nov/2024 2:27 AM

Labels

Original: 1.3.1 Level-A WCAG2.1 a11y-triaged ax-at-JAWS ax-at-NVDA ax-at-VO ax-at-user ax-bug ax-desktop ax-high-priority ax-jiradc-arj ax-jiradc-arj-vpat2024 ax-jiradc-vpat ax-jiradc-vpat-accessibilityassesmentteams ax-jiradc-vpat-accessibilityassessmentroadmaps ax-jiradc-vpat-pg04 ax-macos-safari ax-qa batman-frontend-triaged

New: 1.3.1 Level-A WCAG2.1 a11y-triaged ax-at-JAWS ax-at-NVDA ax-at-VO ax-at-user ax-bug ax-desktop ax-high-priority ax-jiradc-arj ax-jiradc-arj-vpat2024 ax-jiradc-vpat ax-jiradc-vpat-accessibilityassesmentteams ax-jiradc-vpat-accessibilityassessmentroadmaps ax-jiradc-vpat-pg04 ax-macos-safari ax-qa batman-frontend-triaged ril

Marc Dacanay made changes - 13/Nov/2024 2:27 AM

Remote Link

New: This issue links to "Internal ticket (Web Link)" [ 963907 ]

Sylwia Mikołajczuk made changes - 28/Oct/2024 3:45 PM

Priority

Original: High [ 2 ]

New: Medium [ 3 ]

Stasiu made changes - 29/Feb/2024 9:54 AM

Introduced in Version	Original: 9.12	New: 8.2
Affects Version/s		New: 8.20.30 [ 106364 ]
Affects Version/s		New: 9.4.17 [ 106909 ]

Sylwia Mikołajczuk made changes - 22/Feb/2024 9:05 AM

Labels

Original: 1.3.1 Level-A WCAG2.1 a11y-triaged ax-at-JAWS ax-at-NVDA ax-at-VO ax-at-user ax-bug ax-desktop ax-high-priority ax-jiradc-vpat ax-jiradc-vpat-accessibilityassesmentteams ax-jiradc-vpat-accessibilityassessmentroadmaps ax-jiradc-vpat-pg04 ax-macos-safari ax-qa batman-frontend-triaged

New: 1.3.1 Level-A WCAG2.1 a11y-triaged ax-at-JAWS ax-at-NVDA ax-at-VO ax-at-user ax-bug ax-desktop ax-high-priority ax-jiradc-arj ax-jiradc-arj-vpat2024 ax-jiradc-vpat ax-jiradc-vpat-accessibilityassesmentteams ax-jiradc-vpat-accessibilityassessmentroadmaps ax-jiradc-vpat-pg04 ax-macos-safari ax-qa batman-frontend-triaged

Stasiu made changes - 13/Feb/2024 8:28 AM

Component/s	Original: Accessibility [ 62491 ]
Component/s	Original: (Advanced Roadmaps) Other [ 73719 ]
Component/s		New: (Advanced Roadmaps) Accessibility [ 74392 ]

Stasiu made changes - 13/Feb/2024 8:12 AM

Priority

Original: Low [ 4 ]

New: High [ 2 ]

Varsha Bansode made changes - 12/Feb/2024 10:04 AM

Description

Original: h3. Issue Summary On the Accessibility Assessment | Teams page, the "Shared team" form field is not correctly associated with its visual label in the modal dialog (that becomes available on activating "Add team" button). h3. Steps to Reproduce  # Open the "Accessibility Assessment | Teams" page.  # Navigate to the main content.  # Navigate to the "Add team" button and activate it.  # A modal dialog appears on the page.  # Navigate to the "Add existing shared team" radio button and activate it.  # Navigate to the mentioned form field.  # Inspect the code.  # Observe that the form field is not correctly associated with its visual label. h3. Screenshot   h3. Actual Results The "Shared team" form field is not correctly associated with its visual label using “for” and “id” attributes. The <label> and <input> elements although use “for” and “id” attributes respectively in the DOM. However, the values within the “for” and “id” attributes do not match appropriately. As a result, users of assistive technologies found it challenging to interact with the form field. h3. Expected Results The labels and the form fields should be correctly explicitly associated. To implement this, use <label> element. As well, associate the <label> element with the form field using “for” and “id” attributes. Make sure that the values within “for” and “id” match appropriately. *Code Snippet* {noformat} <label class="Field__Label-vqybw1-1 ghWQGY" id="sharedTeamId-cd3a3996-1cd6-4867-930c-82229b34f84b-label" for="sharedTeamId-cd3a3996-1cd6-4867-930c-82229b34f84b">Shared team</label> <input autocapitalize="none" autocomplete="off" autocorrect="off" id="sharedTeamId-cd3a3996-1cd6-4867-930c-82229b34f84b" spellcheck="false" tabindex="0" type="text" aria-autocomplete="list" aria-labelledby="sharedTeamId-cd3a3996-1cd6-4867-930c-82229b34f84b-label sharedTeamId-cd3a3996-1cd6-4867-930c-82229b34f84b-helper sharedTeamId-cd3a3996-1cd6-4867-930c-82229b34f84b-valid sharedTeamId-cd3a3996-1cd6-4867-930c-82229b34f84b-error" value="" style="box-sizing: content-box; width: 2px; background: 0px center; border: 0px; font-size: inherit; opacity: 1; outline: 0px; padding: 0px; color: inherit;">{noformat} h3. Workaround Currently there is no known workaround for this behavior. A workaround will be added here when available h3. Environment MacBook Pro (16-inch, 2021) macOs Monterey Version 12.3.1 Chrome - Version 101.0.4606.81 (Official Build) (64-bit) Firefox- Version 93.0 (32-bit) Safari- Version 15.3 (17612.4.9.1.5) JAWS- Version 2022 NVDA- Version 2020.3 Voiceover - Version Latest

New: h3. Issue Summary On the Accessibility Assessment | Teams page, the "Shared team" form field is not correctly associated with its visual label in the modal dialog (that becomes available on activating "Add team" button). h3. Steps to Reproduce  # Open the "Accessibility Assessment | Teams" page.  # Navigate to the main content.  # Navigate to the "Add team" button and activate it.  # A modal dialog appears on the page.  # Navigate to the "Add existing shared team" radio button and activate it.  # Navigate to the mentioned form field.  # Inspect the code.  # Observe that the form field is not correctly associated with its visual label. h3. Screenshot !image-2024-02-12-15-34-19-102.png|thumbnail! h3. Actual Results The "Shared team" form field is not correctly associated with its visual label using “for” and “id” attributes. The <label> and <input> elements although use “for” and “id” attributes respectively in the DOM. However, the values within the “for” and “id” attributes do not match appropriately. As a result, users of assistive technologies found it challenging to interact with the form field. h3. Expected Results The labels and the form fields should be correctly explicitly associated. To implement this, use <label> element. As well, associate the <label> element with the form field using “for” and “id” attributes. Make sure that the values within “for” and “id” match appropriately. *Code Snippet* {noformat} <label class="Field__Label-vqybw1-1 ghWQGY" id="sharedTeamId-cd3a3996-1cd6-4867-930c-82229b34f84b-label" for="sharedTeamId-cd3a3996-1cd6-4867-930c-82229b34f84b">Shared team</label> <input autocapitalize="none" autocomplete="off" autocorrect="off" id="sharedTeamId-cd3a3996-1cd6-4867-930c-82229b34f84b" spellcheck="false" tabindex="0" type="text" aria-autocomplete="list" aria-labelledby="sharedTeamId-cd3a3996-1cd6-4867-930c-82229b34f84b-label sharedTeamId-cd3a3996-1cd6-4867-930c-82229b34f84b-helper sharedTeamId-cd3a3996-1cd6-4867-930c-82229b34f84b-valid sharedTeamId-cd3a3996-1cd6-4867-930c-82229b34f84b-error" value="" style="box-sizing: content-box; width: 2px; background: 0px center; border: 0px; font-size: inherit; opacity: 1; outline: 0px; padding: 0px; color: inherit;">{noformat} h3. Workaround Currently there is no known workaround for this behavior. A workaround will be added here when available h3. Environment MacBook Pro (16-inch, 2021) macOs Monterey Version 12.3.1 Chrome - Version 101.0.4606.81 (Official Build) (64-bit) Firefox- Version 93.0 (32-bit) Safari- Version 15.3 (17612.4.9.1.5) JAWS- Version 2022 NVDA- Version 2020.3 Voiceover - Version Latest

Varsha Bansode made changes - 12/Feb/2024 10:04 AM

Attachment

New: image-2024-02-12-15-34-19-102.png [ 452078 ]

Varsha Bansode made changes - 12/Feb/2024 10:02 AM

Description

Original: h3. Issue Summary On the Accessibility Assessment | Teams page, the "Shared team" form field is not correctly associated with its visual label in the modal dialog (that becomes available on activating "Add team" button). h3. Steps to Reproduce  # Open the "Accessibility Assessment | Teams" page.  # Navigate to the main content.  # Navigate to the "Add team" button and activate it.  # A modal dialog appears on the page.  # Navigate to the "Add existing shared team" radio button and activate it.  # Navigate to the mentioned form field.  # Inspect the code.  # Observe that the form field is not correctly associated with its visual label. h3. Screenshot   h3. Actual Results The "Shared team" form field is not correctly associated with its visual label using “for” and “id” attributes. The <label> and <input> elements although use “for” and “id” attributes respectively in the DOM. However, the values within the “for” and “id” attributes do not match appropriately. As a result, users of assistive technologies found it challenging to interact with the form field. h3. Expected Results {noformat} The labels and the form fields should be correctly explicitly associated. To implement this, use <label> element. As well, associate the <label> element with the form field using “for” and “id” attributes. Make sure that the values within “for” and “id” match appropriately. Code Snippet <label class="Field__Label-vqybw1-1 ghWQGY" id="sharedTeamId-cd3a3996-1cd6-4867-930c-82229b34f84b-label" for="sharedTeamId-cd3a3996-1cd6-4867-930c-82229b34f84b">Shared team</label> <input autocapitalize="none" autocomplete="off" autocorrect="off" id="sharedTeamId-cd3a3996-1cd6-4867-930c-82229b34f84b" spellcheck="false" tabindex="0" type="text" aria-autocomplete="list" aria-labelledby="sharedTeamId-cd3a3996-1cd6-4867-930c-82229b34f84b-label sharedTeamId-cd3a3996-1cd6-4867-930c-82229b34f84b-helper sharedTeamId-cd3a3996-1cd6-4867-930c-82229b34f84b-valid sharedTeamId-cd3a3996-1cd6-4867-930c-82229b34f84b-error" value="" style="box-sizing: content-box; width: 2px; background: 0px center; border: 0px; font-size: inherit; opacity: 1; outline: 0px; padding: 0px; color: inherit;">{noformat} h3. Workaround Required, if there is no workaround please state: Currently there is no known workaround for this behavior. A workaround will be added here when available h3. Environment MacBook Pro (16-inch, 2021) macOs Monterey Version 12.3.1 Chrome - Version 101.0.4606.81 (Official Build) (64-bit) Firefox- Version 93.0 (32-bit) Safari- Version 15.3 (17612.4.9.1.5) JAWS- Version 2022 NVDA- Version 2020.3 Voiceover - Version Latest

New: h3. Issue Summary On the Accessibility Assessment | Teams page, the "Shared team" form field is not correctly associated with its visual label in the modal dialog (that becomes available on activating "Add team" button). h3. Steps to Reproduce  # Open the "Accessibility Assessment | Teams" page.  # Navigate to the main content.  # Navigate to the "Add team" button and activate it.  # A modal dialog appears on the page.  # Navigate to the "Add existing shared team" radio button and activate it.  # Navigate to the mentioned form field.  # Inspect the code.  # Observe that the form field is not correctly associated with its visual label. h3. Screenshot   h3. Actual Results The "Shared team" form field is not correctly associated with its visual label using “for” and “id” attributes. The <label> and <input> elements although use “for” and “id” attributes respectively in the DOM. However, the values within the “for” and “id” attributes do not match appropriately. As a result, users of assistive technologies found it challenging to interact with the form field. h3. Expected Results The labels and the form fields should be correctly explicitly associated. To implement this, use <label> element. As well, associate the <label> element with the form field using “for” and “id” attributes. Make sure that the values within “for” and “id” match appropriately. *Code Snippet* {noformat} <label class="Field__Label-vqybw1-1 ghWQGY" id="sharedTeamId-cd3a3996-1cd6-4867-930c-82229b34f84b-label" for="sharedTeamId-cd3a3996-1cd6-4867-930c-82229b34f84b">Shared team</label> <input autocapitalize="none" autocomplete="off" autocorrect="off" id="sharedTeamId-cd3a3996-1cd6-4867-930c-82229b34f84b" spellcheck="false" tabindex="0" type="text" aria-autocomplete="list" aria-labelledby="sharedTeamId-cd3a3996-1cd6-4867-930c-82229b34f84b-label sharedTeamId-cd3a3996-1cd6-4867-930c-82229b34f84b-helper sharedTeamId-cd3a3996-1cd6-4867-930c-82229b34f84b-valid sharedTeamId-cd3a3996-1cd6-4867-930c-82229b34f84b-error" value="" style="box-sizing: content-box; width: 2px; background: 0px center; border: 0px; font-size: inherit; opacity: 1; outline: 0px; padding: 0px; color: inherit;">{noformat} h3. Workaround Currently there is no known workaround for this behavior. A workaround will be added here when available h3. Environment MacBook Pro (16-inch, 2021) macOs Monterey Version 12.3.1 Chrome - Version 101.0.4606.81 (Official Build) (64-bit) Firefox- Version 93.0 (32-bit) Safari- Version 15.3 (17612.4.9.1.5) JAWS- Version 2022 NVDA- Version 2020.3 Voiceover - Version Latest

Load more older history items