fix animation frame resize observer

client/src/components/History/Multiple/MultipleViewList.vue

@@ -70,8 +70,8 @@ export default {
         const isScrollable = ref(false);
         const { arrived } = useAnimationFrameScroll(scrollContainer);
 
-        useAnimationFrameResizeObserver(scrollContainer, () => {
-            isScrollable.value = scrollContainer.value.scrollWidth >= scrollContainer.value.clientWidth;
+        useAnimationFrameResizeObserver(scrollContainer, ({ clientSize, scrollSize }) => {
+            isScrollable.value = scrollSize.width >= clientSize.width + 1;
         });
 
         const scrolledLeft = computed(() => !isScrollable.value || arrived.left);

client/src/composables/sensors/animationFrameResizeObserver.js

@@ -2,16 +2,30 @@ import { useAnimationFrame } from "./animationFrame";
 import { unref } from "vue";
 
 export function useAnimationFrameResizeObserver(element, callback) {
-    var lastSize = { width: 0, height: 0 };
+    var clientSize = { width: 0, height: 0 };
+    var scrollSize = { width: 0, height: 0 };
+
+    const isSameSize = (a, b) => {
+        return a.width === b.width && a.height === b.height;
+    };
 
     const { stop } = useAnimationFrame(() => {
         const el = unref(element);
-        const width = el.offsetWidth;
-        const height = el.offsetHeight;
 
-        if (lastSize.width !== width || lastSize.height !== height) {
-            callback({ width, height }, lastSize);
-            lastSize = { width, height };
+        const newClientSize = {
+            width: el.clientWidth,
+            height: el.clientHeight,
+        };
+
+        const newScrollSize = {
+            width: el.scrollWidth,
+            height: el.scrollHeight,
+        };
+
+        if (!isSameSize(clientSize, newClientSize) || !isSameSize(scrollSize, newScrollSize)) {
+            callback({ clientSize: newClientSize, scrollSize: newScrollSize }, { clientSize, scrollSize });
+            clientSize = newClientSize;
+            scrollSize = newScrollSize;
         }
     });