Skip to content
This repository has been archived by the owner on Jul 21, 2021. It is now read-only.

[Palemoon] Altering menu filters causes UI flicker #301

Closed
Tharn opened this issue Jul 23, 2015 · 15 comments
Closed

[Palemoon] Altering menu filters causes UI flicker #301

Tharn opened this issue Jul 23, 2015 · 15 comments

Comments

@Tharn
Copy link

Tharn commented Jul 23, 2015

On Palemoon 25.5 running uMatrix 0.9.2.0-rc.0, changing filter settings using the toolbar menu will result in UI flickering as if the width of the menu was repeatedly being altered by a few pixels. On very long lists the scrollbar will flicker in and out. The only fix I've found is to close the menu and open it again.

@ghost
Copy link

ghost commented Jul 23, 2015

Here is a small video (194K), demonstrating this horizontal shift effect.

https://dl.dropboxusercontent.com/u/32559805/v/umatrix-jitter-in-palemoon.mp4

This clip has a low frame rate, making the effect look less severe than it actually is. Further, it becomes better or worse depending on the relative position of the uMatrix icon within the toolbar.

@gorhill
Copy link
Owner

gorhill commented Jul 23, 2015

I did not test directly with Pale Moon but I tested with Firefox 25. What would be the closest FF version? I am on Linux, and I could not find any .deb package on the Pale Moon site for me to install. There was a link to Sourceforge, but for obvious reasons I won't touch anything on Sourceforge. Ideally even just a compressed package which I can just extract/execute without a formal installation is best.

Note that the issue might not be solvable, I labelled the code to resize the popup in Firefox as "voodoo", because it's anything but straightforward to resize the popup in Firefox, but so far, it works fine on my side for all versions of Firefox, from 25 to 42 -- so maybe there is also something for Pale Moon to address.

Edit: I remember having this exact issue with Firefox, and the solution was to calculate and cache the scrollbar width. This got rid of the issue completely. (Edit again: actually I am not sure this is the issue here.)

@Tharn
Copy link
Author

Tharn commented Jul 23, 2015

As far as I know, the closest relative to Palemoon 25.5 is still the Firefox ESR 24.8.1.

@ghost
Copy link

ghost commented Jul 23, 2015

In terms of UI behaviour, Firefox 24 should be the closest match. Although the focus is on the Windows builds, Pale Moon should build and run fine in Linux. I used it a few months ago in an Arch Linux VM without issue.

There's also a build script provided by the PM4Linux-installer project here on GitHub.

Many thanks for the effort, by the way.

EDIT: Removed SourceForge link. I can't find any other mirror for the binary distribution.

@Tharn
Copy link
Author

Tharn commented Jul 23, 2015

If you wanna go through the trouble of doing it manually,

there is an installer here: http://linux.palemoon.org/download/installer/
tar.bz2 files here: http://linux.palemoon.org/download/mainline/
instructions for the latter here: http://linux.palemoon.org/help/installation/

@gorhill
Copy link
Owner

gorhill commented Jul 23, 2015

tar.bz2 files here: http://linux.palemoon.org/download/mainline/

Thanks, exactly what I was looking for.

https://dl.dropboxusercontent.com/u/32559805/v/umatrix-jitter-in-palemoon.mp4

I tested on my side, and I cannot reproduce this issue. The only difference which comes to mind is that you are using Pale Moon on Windows, I was using Pale Moon on Linux. Being able to reproduce is key for me to investigate (and hopefully fix) the glitch. Given that I can't also see this glitch on Firefox, now I wonder if the glitch is also experienced by some users on Firefox.

@ghost
Copy link

ghost commented Jul 23, 2015

I installed Firefox 24.8.1 in Windows and can reproduce the issue there.

@Tharn
Copy link
Author

Tharn commented Jul 23, 2015

Same here. And check out what it's doing in Firefox 28. The menu looks okay for a split second, then aligns itself to the right. It does this in windowed and maximized mode. Still flickers, too: http://i.imgur.com/CJBZIMg.png

This leads me to believe it might have something to do with the extension trying to align itself properly relative to the FF window and/or the screen.

@quilloss
Copy link

Not sure if this is related but uMatrix and uBlock popups flickers every time they are opened in Firefox Windows. It looks like it tries to resize the popup twice during the opening animation.

@gorhill
Copy link
Owner

gorhill commented Jul 23, 2015

I changed the way it is decided when the popup is resized: we are dealing with a popup which content is dynamic here, and because of this, the popup is best placed to know when it needs to be resized. So this is how it works now, the popup code itself (platform-independent side) will trigger the resize only if needed. This is as opposed to before where whatever changes in the DOM of the popup (including irrelevant ones with regard to resize) would trigger the resize code.

Hopefully this will work. I tried on Nightly and Pale Moon, and it still work as before on my side. Fix is in latest rc.1 build.

@ghost
Copy link

ghost commented Jul 23, 2015

It doesn't quite fix it. Upon opening the popup, it will still occasionally jump to the right then left again. The same applies upon clicking any clickable element within the popup window. The chances of it shaking appear to continually vary. Sometimes, it will happen on the first click then three or four times in a row. Sometimes, it takes a dozen repeated clicks to trigger. When it does occur, it doesn't continually shake until the popup is closed, as was happening before. In that respect, it's definitely an improvement.

@gorhill
Copy link
Owner

gorhill commented Jul 23, 2015

It doesn't quite fix it.

I looked at your mp4 again, because as said now the popup will resize only if needed. From what I see in the video, the matrix is not resized, so I don't know from where that glitch comes from, there is something else at work than resizing in there. It's as if there is some kind of window snapping going on, I can't quite tell since the video crops the right part which is where something seems to be going on.

With the last fix, the popup on Pale Moon Linux is rock solid, the popup appears already all properly sized without any visual intermediate state, it even looks better than with Nightly, for which I can see an intermediate state.

@Tharn
Copy link
Author

Tharn commented Jul 23, 2015

With rc1, in Palemoon I get an occasional single twitch when selecting an item in the menu, but otherwise the UI is solid and useable.

Firefox 28 still aligns itself to the right side, even if it means that most of the menu will be off-screen.

@gorhill
Copy link
Owner

gorhill commented Jul 23, 2015

Ok, I launched Windows 7 in a VM, downloaded Pale Moon for Windows, and I can see the glitch.

Now that I can experienced myself, I can tell that yes, it is related to resize.

Currently it happens when one click a cell, and there is indeed a resize in such case -- because it could happens a row ends up hidden as a result of toggling one cell (in a very edgy case though, I think I will remove the trigger to resize in such case, worst will be that the popup is one matrix row higher than required when that rare case is encountered, not a terrible side-effect).

The fact that the glitch occurred before even without any further interaction after clicking means that the matrix was constantly resizing before, not sure why, so the fix is a keeper, and I will probably import it to uBlock too.

Now I am not sure the slight horizontal shift at resize time can be completely eliminated, there seems to be something specific to Windows causing this (as said, it doesn't happen with Linux, same code).

@ghost
Copy link

ghost commented Jul 26, 2015

I looked at your mp4 again, because as said now the popup will resize only if needed. From what I see in the video, the matrix is not resized, so I don't know from where that glitch comes from, there is something else at work than resizing in there. It's as if there is some kind of window snapping going on, I can't quite tell since the video crops the right part which is where something seems to be going on.

The window was maximized, hence no cropping on the top or right-hand side. I've prepared another clip in which the window is positioned so that its right-hand border is far from the right-hand edge of the desktop.

https://dl.dropboxusercontent.com/u/32559805/v/umatrix-dropdown-no-forced-alignment.mp4

This clip demonstrates two things. Firstly, the drop-down is left-aligned relative to the toolbar button, not right-aligned (as it is in the Chrome version). Secondly, the shaking does not occur.

I am certain that these two facts are related. The drop-down never overflows past the right-hand side of the desktop, instead being forced to the left if needs be. Only then does the shaking occur. Should it be possible to align the drop-down similarly as with Chrome, I think that it will be enough to mitigate this issue.

gorhill added a commit that referenced this issue Jul 28, 2015
Noxgrim pushed a commit to Noxgrim/uMatrix that referenced this issue Dec 29, 2021
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants