wix / wix/react-native-ui-lib

Weird Hint behavior on Android

Open
#3,913 1 comment 1 reaction 0 assignees View on GitHub

Nobody has claimed this yet.

bug
Dominant language
TypeScript
Stars
7.2k
Forks
748
Avg merge
2d 18h
Merged PRs (30d)
1

Description

Description

On Android, the component wrapped by Hint shifts position when pressed. And then, when visibility is set back to false, an error like the below is thrown:

sendAccessibilityEvent() dropping event: Cannot find view with tag #8446

Related to
  • Components
  • Demo
  • Docs
  • Typings
Steps to reproduce

Steps to reproduce the behavior:

  1. Use the Hint component on Android and observe the behavior when toggling visibility of the hint's contents.

More Info

Code snippet
        <Hint
          visible={hintVisible}
          color="white"
          enableShadow
          offset={6}
          borderRadius={8}
          containerWidth={400}
          removePaddings
          onBackgroundPress={() => setHintVisible(!hintVisible)}
          customContent={
            <Text className="text-xs text-center p-2.5 px-5">
              Your ability to submit bids, update membership, and accept offers has been disabled.
              Where applicable, all your max bids have been lowered to current bids. Please contact
              Customer Support:{' '}
              <STText classes="color-[#6CA5C8]" onPress={openSubmitRequest}>
                submit a request
              </STText>
              .
            </Text>
          }
        >
          <Pressable
            accessibilityRole="button"
            accessibilityLabel="info"
            accessibilityHint="opens dialog explaining account suspension"
            onPress={() => setHintVisible(!hintVisible)}
          >
            <FontAwesomeIcon icon={faCircleInfo} size={18} color={'white'} />
          </Pressable>
        </Hint>
Screenshots/Video

https://github.com/user-attachments/assets/1996adf7-2a87-4256-8e3f-d6a74e062383

Environment
  • React Native version: 0.81.5
  • React Native UI Lib version: 8.2.1
Affected platforms
  • Android
  • iOS
  • Web

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

Start by reproducing the Hint component behavior on Android using the provided code snippet and the listed React Native and React Native UI Lib versions. Investigate the visibility toggle and pressed-state behavior; done means the wrapped component no longer shifts and toggling visibility does not produce the missing-view accessibility error.

Written by the indexing model from the issue text.

Assessment

Tech stack
react-native, typescript
Domain
mobile
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 days
Activity status
Quiet
Clarity
Needs clarification
Newbie friendliness
45/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.