techhub/mastodon
2
0
Fork 0
Code Activity

Fix browser glitch caused by two overlapping scroll animations in web UI (#31960)

Browse Source
This commit is contained in:
Eugen Rochko
2024-09-19 12:52:46 +02:00
committed by GitHub
parent efdc17513d
commit ef4d6ab988
3 changed files with 25 additions and 40 deletions
Download Patch File Download Diff File Expand all files Collapse all files

25
app/javascript/mastodon/scroll.ts
View File

@@ -38,13 +38,20 @@ const scroll = (
const isScrollBehaviorSupported =
'scrollBehavior' in document.documentElement.style;
export const scrollRight = (node: Element, position: number) => {
if (isScrollBehaviorSupported)
node.scrollTo({ left: position, behavior: 'smooth' });
else scroll(node, 'scrollLeft', position);
};
export const scrollRight = (node: Element, position: number) =>
requestIdleCallback(() => {
if (isScrollBehaviorSupported) {
node.scrollTo({ left: position, behavior: 'smooth' });
} else {
scroll(node, 'scrollLeft', position);
}
});
export const scrollTop = (node: Element) => {
if (isScrollBehaviorSupported) node.scrollTo({ top: 0, behavior: 'smooth' });
else scroll(node, 'scrollTop', 0);
};
export const scrollTop = (node: Element) =>
requestIdleCallback(() => {
if (isScrollBehaviorSupported) {
node.scrollTo({ top: 0, behavior: 'smooth' });
} else {
scroll(node, 'scrollTop', 0);
}
});