New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Scrolling up/down with table and virtual-repeat-for causes display bugs #128

Closed
reft opened this Issue Feb 10, 2018 · 7 comments

Comments

Projects
None yet
6 participants
@reft
Copy link

reft commented Feb 10, 2018

I'm submitting a bug report

  • Library Version:
    1.0.0-beta.3.2.0

Please tell us about your environment:

  • Operating System:
    Windows 10

  • Node Version:
    8.9.1

  • NPM Version:
    5.5.1

  • Browser:
    Chrome

  • Language:
    TypeScript >=1.9.0-dev || ^2.0.0

Current behavior:
Using table with virtual-repeat-for is causing unexpected bugs with the display of the array.

It seems like the order of the array is changed, for example if I have fifty rows with ids 1-50 and then scroll up and down the order of which the array is displayed is changed. Instead of the first row being id=1 it's something else depending on how you scrolled.

Expected/desired behavior:
Should display array in proper order.

What is the motivation / use case for changing the behavior?
In it's current state it's not viable to use table with aurelia virtualization.

Repo with example:
https://github.com/reft/au-virtualization-table

Before scrolling up and down:

1

After scrolling up and down:

2

As you can see the first row has switched position with another element in the array. In my case id 1 has swapped position with id 38. The problem seems to only affect the first element in the array but I'm not 100% sure.

Please clone the provided repo to reproduce the bug.

@veikkoeeva

This comment has been minimized.

Copy link

veikkoeeva commented Feb 10, 2018

Might be related to #101 too.

@tbnovaes

This comment has been minimized.

Copy link

tbnovaes commented Mar 13, 2018

I'm having same problem, with components. I'm creating a table, and each row has 3 charts, when I scroll up and down, the attached/detached method of the component is not called again. So it loads the wrong component.

It would also be nice to have rowCreated and scrollingStarted, scrollingEnded callbacks.

@PhanindraKumar

This comment has been minimized.

Copy link

PhanindraKumar commented Apr 18, 2018

any update on this. I am too facing same problem. Is there any work around for this

@avrahamcool

This comment has been minimized.

Copy link

avrahamcool commented Apr 18, 2018

same issue here..

@bigopon

This comment has been minimized.

Copy link
Member

bigopon commented Apr 18, 2018

I'll take a look

@bigopon

This comment has been minimized.

Copy link
Member

bigopon commented Apr 19, 2018

@reft @avrahamcool @PhanindraKumar A fix is at #131, could you guys give it a check ?

@PhanindraKumar

This comment has been minimized.

Copy link

PhanindraKumar commented May 3, 2018

@bigopon I can still see the issue. One thing may be its because we are not using html table. we are using div with flex box to build tables. does it make any difference ?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment