[Bug]: Transaction table constantly resizing

matt-fidd commented 1 week ago

Verified issue does not already exist?

[X] I have searched and found no existing issue

What happened?

This is a really strange one, it only seems to happen on a single browser, but is reproducible for me on there. However it does not occur with the exact same budget file, on Chrome on a different computer.

Only occurs when viewing a single accounts table, none of the other accounts or tables.

I’ve not been able to create a test budget that reproduces the issue.

There is no logging in the console

https://github.com/actualbudget/actual/assets/81489167/671a3e37-c19a-464d-abcb-a528800eab8e

https://github.com/actualbudget/actual/assets/81489167/fb9b68b8-87a6-47d6-a4c7-38f923fb1be3

https://github.com/actualbudget/actual/assets/81489167/82150697-92d7-4b7f-aaf5-9bf6787008bf

Environment:

Windows 8.1 inside corporate VMWare
Chrome V109.0.5414.141 (32 bit)
Actual Edge

Where are you hosting Actual?

Locally via Yarn

What browsers are you seeing the problem on?

Chrome

Operating System

Other

MatissJanis commented 1 week ago

Are you able to reproduce this on https://demo.actualbudget.org (latest tagged release)?

matt-fidd commented 1 week ago

This is not reproducable on demo.

I've worked out what the trigger is. When there are too many transactions to fit on a single page the scroll bar appears. It looks like there must be a very niche edge case where it's just on the verge of needing the scroll bar, and so flicks between adding and removing it.

To reproduce:

Add just enough transactions to a blank account that one more will trigger the scroll bar
Add one more
If the screen size is just right (I imagine this is a very small window because it's only occured in a very specific environment for me) then the table will add and remove the scrollbar in a loop
Adding or removing a single transaction will stop this from occuring.

Edge: https://github.com/actualbudget/actual/assets/81489167/e758d50d-bfff-435c-8b14-a9e4418a28e7

Demo: https://github.com/actualbudget/actual/assets/81489167/cb5572a3-7a6d-4794-9550-3d2afb5cb70c

MatissJanis commented 1 week ago

Possible root cause: https://github.com/actualbudget/actual/pull/2867

matt-fidd commented 1 week ago

Let me try reverting that PR and seeing if it persists, the 200ms cycle would make sense

matt-fidd commented 1 week ago

Possible root cause: #2867

You're dead on, reverting the commit fixed the bug

MatissJanis commented 1 week ago

cc @lelemm FYI

lelemm commented 1 week ago

omg. I will try to reproduce it

lelemm commented 1 week ago

@matt-fidd can you tell me what resolution are you using on that machine and scale size?

matt-fidd commented 1 week ago

Looks to be a viewport of 1920 x 937 but I can't seem to reproduce it outside of my work remote desktop, even with the same viewport size.

matt-fidd commented 1 week ago

Aha! It's tied to the Chrome version, not so much the viewport.

I just tested in Chromium 1070081 and could reproduce it easily.

Official build for Windows: https://commondatastorage.googleapis.com/chromium-browser-snapshots/index.html?prefix=Win/1070081/

lelemm commented 1 week ago

nice, I will download it to test out

lelemm commented 1 week ago

tried to replicate, no success yet. Tried with demo and my own budget

lelemm commented 6 days ago

Ok, I was able to reproduce it now. The cause of this is the fact that the number of lines in the grid is size of the screen, so the app keeps adding the scrollbar and removing it.

lelemm commented 6 days ago

Try this https://deploy-preview-2941.demo.actualbudget.org/ @matt-fidd I was able to use the demo budget. You have to delete transactions from an account to fill the screen like this:

matt-fidd commented 6 days ago

Thank you!

That looks to have done the trick, I'm just using a blank file with 24 transactions, that seems to be the right amount to fill my page.

lelemm commented 6 days ago

Nice @matt-fidd ! good news! :)

@MatissJanis can you review the PR? merge is frozen atm too

actualbudget / actual