[Adaptive Cards - Designer] - At 400% reflow settings 320px viewport, 'Calendar' icon in the 'Set due date' edit field present inside the 'Adaptive Card editor' section is not visible on the page.

[Rishikesh6521]

Target Platforms

Other

SDK Version

1.6

Application Name

Adaptive Cards

Problem Description

Test Environment:
URL: https://adaptivecards.io/
OS Version: 25H2 (OS Build 26200.5761)
Browser Version: Version 145.0.3734.1 (Official build) dev (64-bit)

Pre-requisite:

1. Navigate using keyboard only.
2. Go to system Settings-> System-> Display-> Scale & Layout-> Change the size of text, apps, and other items at 100%
3. Go to browser Settings-> Zoom- 200%
4. Change the view port of the page into 320px.

Repro Steps:

1. Open the above URL on the Edge Dev browser.
2. Navigate to the 'Designer' control present on the header section of the page using tab key and activate using enter key.
3. Navigate to the 'Set due date' button control present in the 'Adaptive Card editor' section using tab key and activate using enter key.
4. Now navigate to the 'Calendar' icon using tab key.
5. Verify that, at 400% reflow settings 320px viewport, 'Calendar' icon in the 'Set due date' edit field present inside the 'Adaptive Card editor' section is visible on the page or not.

Actual Result:
At 400% reflow settings 320px viewport, 'Calendar' icon in the 'Set due date' edit field present inside the 'Adaptive Card editor' section is not visible on the page.

Expected Result:
At 400% reflow settings 320px viewport, 'Calendar' icon in the 'Set due date' edit field present inside the 'Adaptive Card editor' section should be properly visible and available without getting crop/overlap on the page.

User Experience:
Low vision users depend on the reflow settings will be impacted if at 400% reflow settings 320px viewport, 'Calendar' icon in the 'Set due date' edit field present inside the 'Adaptive Card editor' section is not visible on the page due to which users will miss the functionality to access the control and might get confused without accessing them.

WCAG Reference:
https://www.w3.org/WAI/WCAG22/Understanding/reflow.html

Have feedback to share on Bugs ? please tag bug as “A11yRCA” and add your feedback in the comment section

Screenshots

At.400.reflow.settings.320px.viewport.Calendar.icon.in.the.Set.due.date.edit.field.present.inside.the.Adaptive.Card.editor.section.is.not.visible.on.the.page.mp4

Card JSON

NA

Sample Code Language

No response

Sample Code

No response

[Rishikesh6521]

Designer page is going to be deprecated, hence closing the bug.