microsoft / microsoft/react-native-gallery

Bug 54110693: [React Native Gallery -> Home]: 'Scroll right' or 'Scroll left' button is not visible clearly in high contrast theme.

Open
#514 0 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

A11ySev3 Area: Accessibility Area: Paper bug
Dominant language
TypeScript
Stars
257
Forks
57
Avg merge
18h 19m
Merged PRs (30d)
10

Description

Build Details:
OS Version: Dev (OS Build 27695.1000)
App: React Native Gallery
App Version: 1.0.18.0
React Native Windows Version: 0.75.0
AT: High Contrast

Pre-Requisite:
Turn on High Contrast Aquatic Theme (Settings->Accessibility->Contrast themes->Aquatic/Dessert theme->Apply)

Repro-Steps:
Launch the React Native Gallery app.
Navigate to ‘Home’ button present in left navigation pane and invoke it.
Now observe 'Scroll right' or 'Scroll left' button in high contrast themes.
Actual Result:
'Scroll right' or 'Scroll left' button is not visible clearly in high contrast theme.

Expected Result:
'Scroll right' or 'Scroll left' button should be visible clearly in high contrast theme.

User impact:

Users with low vision will not be able to identify the presence of the buttons if it is not visible in High Contrast Themes.

Link to ADO bug: https://microsoft.visualstudio.com/OS/_workitems/edit/54110693

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Reproduce the issue in the React Native Gallery by opening the Home entry from the left navigation pane with the Aquatic or Desert high-contrast theme enabled. Inspect the Home screen's “Scroll right” and “Scroll left” buttons and their contrast behavior. Done means both buttons are clearly visible in high-contrast themes and the repro steps no longer show the reported issue.

Written by the indexing model from the issue text.

Assessment

Tech stack
react-native, typescript
Domain
accessibility, frontend, mobile
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
45/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.