Visual glitch when tapling the Search input

mihzor

There is a noticable visual glitch at the top when tapping the search input on a mobile device.

I have the recording but I do not have permission to upload a video file and Imgur links are forbidden.

Just a small bug but fixing it would make the experience feel a bit smoother.

Karl

mihzor I don't see a glitch at all on my end.

mihzor

I will use pictures to show you.

Search form:

When you tap on it, a white rectangle appears at the top

Then it disappears and modal appears

Karl

mihzor that's the toolbar menu. Elements are transitioning. I guess it never bothered me since I knew it was the toolbar lol

luceos

Karl are you looking at the white block covering the logo?

Karl

luceos yeah, that's the background of the toolbar no?
I'm mentioning that as the source of where it's coming from and how I wasn't bothered with it prior to this interaction lol

luceos

Karl I didn't verify the issue, but that's really weird seeing it block the logo 🙈

mihzor

It's also present on desktop (firefox).

Karl

luceos it wants the attention for sure. I'll see what I can find on it.

mihzor yeah it's consistent between Chrome and Firefox based browsers.

Karl

@mihzor @luceos flarum/framework4811

mihzor

Karl that was fast. Could you please explain how you managed to catch what element is glitching? Did you slow down the animations or something else?

Karl

mihzor app.drawer.hide();

mihzor

Karl i am not following. To be more specific, I'm interested in method you used to find an issue.

Karl

mihzor the files themselves are modularized pretty easily. So I looked at AbstractGlobalSearch.tsx unless you're wondering how I've determined the method itself works?

mihzor

Karl TypeScript is kinda out of my scope so even if you explained, I am sure I wouldn't understand. 🙂 But thank you nevertheless.