[READ-ONLY] a fast, modern browser for the npm registry
0
fork

Configure Feed

Select the types of activity you want to include in your feed.

fix: timeout chart re-render (#629)

authored by

Alec Lloyd Probert and committed by
GitHub
d99bc67c fea10d07

+13 -10
+13 -10
app/components/PackageDownloadAnalytics.vue
··· 21 21 22 22 const chartKey = ref(0) 23 23 24 - function nextAnimationFrame(): Promise<void> { 25 - return new Promise(resolve => { 26 - requestAnimationFrame(() => resolve()) 27 - }) 28 - } 24 + let chartRemountTimeoutId: ReturnType<typeof setTimeout> | null = null 29 25 30 - onMounted(async () => { 26 + onMounted(() => { 31 27 rootEl.value = document.documentElement 32 28 resolvedMode.value = colorMode.value === 'dark' ? 'dark' : 'light' 33 29 34 30 // If the chart is painted too early, built-in auto-sizing does not adapt to the final container size 35 - await nextAnimationFrame() 36 - await nextAnimationFrame() 37 - await nextAnimationFrame() 38 - chartKey.value += 1 31 + chartRemountTimeoutId = setTimeout(() => { 32 + chartKey.value += 1 33 + chartRemountTimeoutId = null 34 + }, 10) 35 + }) 36 + 37 + onBeforeUnmount(() => { 38 + if (chartRemountTimeoutId !== null) { 39 + clearTimeout(chartRemountTimeoutId) 40 + chartRemountTimeoutId = null 41 + } 39 42 }) 40 43 41 44 const { colors } = useCssVariables(