[BUG] The Connect Wallet button doesn't work on iOS Safari and Android Chrome

[vldkhh]

https://good-collective-myojia2m2-gooddollarteam.vercel.app/

• [ ] The Connect Wallet button doesn't work on iOS Safari and Android Chrome Private Zenhub Video

[benefacto]

Highest priority because blocking

[benefacto]

Initial investigation (remote debugging on Android) implies that it's not handling the event correctly since there's no errors in the console (besides an issue with the subgraph which should not cause this). Here are the events being fired upon clicking the button:

pointerover PointerEvent {isTrusted: true, pointerId: 19, width: 2, height: 2.2857143878936768, pressure: 0.10236220061779022, …}
VM32:1 pointerenter PointerEvent {isTrusted: true, pointerId: 19, width: 2, height: 2.2857143878936768, pressure: 0.10236220061779022, …}
VM32:1 pointerdown PointerEvent {isTrusted: true, nativeEvent: PointerEvent, persist: ƒ, isDefaultPrevented: ƒ, isPropagationStopped: ƒ, …}
VM32:1 touchstart TouchEvent {isTrusted: true, nativeEvent: TouchEvent, persist: ƒ, isDefaultPrevented: ƒ, isPropagationStopped: ƒ, …}
VM32:1 gotpointercapture PointerEvent {isTrusted: true, pointerId: 19, width: 2, height: 2, pressure: 0.28346455097198486, …}
VM32:1 pointermove PointerEvent {isTrusted: true, nativeEvent: PointerEvent, persist: ƒ, isDefaultPrevented: ƒ, isPropagationStopped: ƒ, …}
VM32:1 pointermove PointerEvent {isTrusted: true, nativeEvent: PointerEvent, persist: ƒ, isDefaultPrevented: ƒ, isPropagationStopped: ƒ, …}
VM32:1 pointermove PointerEvent {isTrusted: true, nativeEvent: PointerEvent, persist: ƒ, isDefaultPrevented: ƒ, isPropagationStopped: ƒ, …}
VM32:1 pointermove PointerEvent {isTrusted: true, nativeEvent: PointerEvent, persist: ƒ, isDefaultPrevented: ƒ, isPropagationStopped: ƒ, …}
VM32:1 pointermove PointerEvent {isTrusted: true, nativeEvent: PointerEvent, persist: ƒ, isDefaultPrevented: ƒ, isPropagationStopped: ƒ, …}
VM32:1 pointermove PointerEvent {isTrusted: true, nativeEvent: PointerEvent, persist: ƒ, isDefaultPrevented: ƒ, isPropagationStopped: ƒ, …}
VM32:1 pointermove PointerEvent {isTrusted: true, nativeEvent: PointerEvent, persist: ƒ, isDefaultPrevented: ƒ, isPropagationStopped: ƒ, …}
VM32:1 pointermove PointerEvent {isTrusted: true, nativeEvent: PointerEvent, persist: ƒ, isDefaultPrevented: ƒ, isPropagationStopped: ƒ, …}
VM32:1 pointermove PointerEvent {isTrusted: true, nativeEvent: PointerEvent, persist: ƒ, isDefaultPrevented: ƒ, isPropagationStopped: ƒ, …}
VM32:1 pointerup PointerEvent {isTrusted: true, pointerId: 19, width: 1, height: 1, pressure: 0, …}
VM32:1 lostpointercapture PointerEvent {isTrusted: true, pointerId: 19, width: 1, height: 1, pressure: 0, …}
VM32:1 pointerout PointerEvent {isTrusted: true, pointerId: 19, width: 1, height: 1, pressure: 0, …}
VM32:1 pointerleave PointerEvent {isTrusted: true, pointerId: 19, width: 1, height: 1, pressure: 0, …}
VM32:1 touchend TouchEvent {isTrusted: true, touches: TouchList, targetTouches: TouchList, changedTouches: TouchList, altKey: false, …}
VM32:1 mousemove MouseEvent {isTrusted: true, nativeEvent: MouseEvent, persist: ƒ, isDefaultPrevented: ƒ, isPropagationStopped: ƒ, …}
VM32:1 mousedown MouseEvent {isTrusted: true, nativeEvent: MouseEvent, persist: ƒ, isDefaultPrevented: ƒ, isPropagationStopped: ƒ, …}
VM32:1 mouseup MouseEvent {isTrusted: true, nativeEvent: MouseEvent, persist: ƒ, isDefaultPrevented: ƒ, isPropagationStopped: ƒ, …}
VM32:1 click PointerEvent {isTrusted: true, pointerId: 19, width: 1, height: 1, pressure: 0, …}

Indeed, it seems that the corresponding TouchableOpacity has no event handler for this: https://github.com/GoodDollar/GoodCollective/blob/ad77a418eae66ff0bd447dc1573ba137be118feb/packages/app/src/components/Header.tsx#L170 It appears that this was only ever setup for desktop, at least in the UI: https://github.com/GoodDollar/GoodCollective/blob/ad77a418eae66ff0bd447dc1573ba137be118feb/packages/app/src/components/Header.tsx#L180

[benefacto]

My commit 57dc8a4 appears to have resolved the issue though UI cleanup is probably needed. @vldkhh Can you try again using the Wallet Connect button? That same button should also work with Metamask mobile.

[sirpy]

@benefacto tickets will be closed by @vldkhh when tested and verified

[vldkhh]

yes, @benefacto , you could move tickets to the QA column when it is ready to test (deployed to dev or local env) Also, provide a link to the testable env, please

[benefacto]

QA column

@vldkhh If you're referring to a GitHub project, I unfortunately do not have access to any here so am unable to change or see cards in columns. The latest preview environment is here and corresponds to the latest deployment on this pull request (all preview links can be accessed there).

[krisbitney]

What is the status of this? @vldkhh

[vldkhh]

@krisbitney fixed

[krisbitney]

Fantastic