data.coop/pinafore
8
0
Fork 0
Code Issues 1 Pull requests Packages Projects Releases Wiki Activity

fix observer bug in svelte store

Browse source
This commit is contained in:
Nolan Lawson 2018-01-24 18:58:10 -08:00
parent 747a842304
commit d0391a6c0f
2 changed files with 34 additions and 25 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

56
routes/_components/VirtualListContainer.html
View file

@ -31,8 +31,34 @@
scrollHeight: cachedStore.state.scrollHeight,
offsetHeight: cachedStore.state.offsetHeight
})
this.rehydrateScrollTop(cachedStore)
this.store.set(cachedStore.state)
// rehydrate scroll top
let cachedScrollTop = cachedStore.state.scrollTop || 0
if (cachedScrollTop === 0) {
if (process.env.NODE_ENV !== 'production') {
console.log('no need to force scroll top')
}
return
}
let initializedScrollTop = false
let node = this.refs.node
this.observe('allVisibleItemsHaveHeight', allVisibleItemsHaveHeight => {
if (process.env.NODE_ENV !== 'production') {
console.log('allVisibleItemsHaveHeight', allVisibleItemsHaveHeight)
}
if (!initializedScrollTop && allVisibleItemsHaveHeight && node) {
initializedScrollTop = true
requestAnimationFrame(() => {
mark('set scrollTop')
if (process.env.NODE_ENV !== 'production') {
console.log('forcing scroll top to ', cachedScrollTop)
}
node.scrollTop = cachedScrollTop
stop('set scrollTop')
})
}
})
} else {
this.store.set({
scrollTop: 0,
@ -102,31 +128,11 @@
}
this.set({ fullscreen: isFullscreen() })
stop('onFullscreenChange')
}
},
rehydrateScrollTop(cachedStore) {
let cachedScrollTop = cachedStore.state.scrollTop || 0
if (cachedScrollTop === 0) {
if (process.env.NODE_ENV !== 'production') {
console.log('no need to force scroll top')
}
return
}
let initializedScrollTop = false
let node = this.refs.node
this.store.observe('allVisibleItemsHaveHeight', allVisibleItemsHaveHeight => {
if (!initializedScrollTop && allVisibleItemsHaveHeight && node) {
initializedScrollTop = true
requestAnimationFrame(() => {
mark('set scrollTop')
if (process.env.NODE_ENV !== 'production') {
console.log('forcing scroll top to ', cachedScrollTop)
}
node.scrollTop = cachedScrollTop
stop('set scrollTop')
})
}
})
}
computed: {
// TODO: bug in svelte/store – the observer in oncreate() never get removed without this hack
allVisibleItemsHaveHeight: ($allVisibleItemsHaveHeight) => $allVisibleItemsHaveHeight
}
};
</script>

3
routes/_utils/virtualListStore.js
View file

@ -120,6 +120,9 @@ virtualListStore.compute('numItems', ['items'], (items) => items.length)
virtualListStore.compute('allVisibleItemsHaveHeight',
['visibleItems', 'itemHeights'],
(visibleItems, itemHeights) => {
if (!visibleItems.length) {
return false
}
for (let visibleItem of visibleItems) {
if (!itemHeights[visibleItem.key]) {
return false