Compare commits

...

20 Commits

Author SHA1 Message Date
Peter Buglavecz
95c950e5ad
Merge 8612666471 into edc299a043 2024-11-20 21:45:41 +01:00
Peter Buglavecz
8612666471
Merge branch 'main' into main 2024-11-20 21:45:38 +01:00
Peter Buglavecz
23b1af766b fix: add nuxt load indicator to fixture 2024-11-19 16:29:17 +01:00
Peter Buglavecz
0646244a30 fix: add nuxt load indicator to fixture 2024-11-19 16:24:38 +01:00
Peter Buglavecz
df749b9b5b test: add fixture 2024-11-17 18:58:50 +01:00
Peter Buglavecz
d218a835f3 test: add nuxt page load indictor regression test 2024-11-17 18:51:52 +01:00
Peter Buglavecz
d4e2b44f4c test: add nuxt page load indictor regression test 2024-11-17 18:49:51 +01:00
Peter Buglavecz
8eeaed5164
Merge branch 'nuxt:main' into main 2024-11-17 15:49:58 +01:00
Peter Buglavecz
25a21f4d5a
Merge branch 'nuxt:main' into main 2024-11-05 20:39:14 +01:00
Daniel Roe
1edb8d2d7a
test: trigger logging with client-side navigation 2024-10-11 14:17:01 +01:00
Daniel Roe
2984d3f66a
test: only log on /page-load-hook route 2024-10-11 14:16:39 +01:00
Daniel Roe
9e83d05e17
Merge remote-tracking branch 'origin/main' into buglavecz/main 2024-10-11 14:07:47 +01:00
Peter Buglavecz
50255cb5c1 fix test 2024-10-10 22:09:06 +02:00
Peter Buglavecz
b5ec8f643a
Merge branch 'nuxt:main' into main 2024-10-10 21:54:32 +02:00
Peter Buglavecz
390f88bdf6 eslint fix 2024-10-10 21:51:12 +02:00
Peter Buglavecz
c90f321fb2
Merge branch 'nuxt:main' into main 2024-10-10 21:44:32 +02:00
Peter Buglavecz
b99d5660e4 add unit test 2024-10-10 21:43:14 +02:00
Peter Buglavecz
b73ff33136
Merge branch 'nuxt:main' into main 2024-10-09 21:13:47 +02:00
Peter Buglavecz
c759cf3f35
Merge branch 'main' into main 2024-09-16 15:45:37 +02:00
Peter Buglavecz
d5cf708041 fix(nuxt): hook called twice during navigation 2024-09-15 16:45:03 +02:00
5 changed files with 58 additions and 12 deletions

View File

@ -41,7 +41,6 @@ export default defineComponent({
const nuxtApp = useNuxtApp() const nuxtApp = useNuxtApp()
const pageRef = ref() const pageRef = ref()
const forkRoute = inject(PageRouteSymbol, null) const forkRoute = inject(PageRouteSymbol, null)
let previousPageKey: string | undefined | false
expose({ pageRef }) expose({ pageRef })
@ -97,10 +96,6 @@ export default defineComponent({
} }
const key = generateRouteKey(routeProps, props.pageKey) const key = generateRouteKey(routeProps, props.pageKey)
if (!nuxtApp.isHydrating && !hasChildrenRoutes(forkRoute, routeProps.route, routeProps.Component) && previousPageKey === key) {
nuxtApp.callHook('page:loading:end')
}
previousPageKey = key
const hasTransition = !!(props.transition ?? routeProps.route.meta.pageTransition ?? defaultPageTransition) const hasTransition = !!(props.transition ?? routeProps.route.meta.pageTransition ?? defaultPageTransition)
const transitionProps = hasTransition && _mergeTransitionProps([ const transitionProps = hasTransition && _mergeTransitionProps([
@ -161,10 +156,3 @@ function haveParentRoutesRendered (fork: RouteLocationNormalizedLoaded | null, n
(c, i) => c.components?.default !== fork.matched[i]?.components?.default) || (c, i) => c.components?.default !== fork.matched[i]?.components?.default) ||
(Component && generateRouteKey({ route: newRoute, Component }) !== generateRouteKey({ route: fork, Component })) (Component && generateRouteKey({ route: newRoute, Component }) !== generateRouteKey({ route: fork, Component }))
} }
function hasChildrenRoutes (fork: RouteLocationNormalizedLoaded | null, newRoute: RouteLocationNormalizedLoaded, Component?: VNode) {
if (!fork) { return false }
const index = newRoute.matched.findIndex(m => m.components?.default === Component?.type)
return index < newRoute.matched.length - 1
}

View File

@ -625,6 +625,44 @@ describe('pages', () => {
const html = await $fetch('/prerender/test') const html = await $fetch('/prerender/test')
expect(html).toContain('should be prerendered: true') expect(html).toContain('should be prerendered: true')
}) })
it('should trigger page:loading:end only once', async () => {
const { page, consoleLogs } = await renderPage('/')
await page.getByText('to page load hook').click()
await page.waitForFunction(path => window.useNuxtApp?.()._route.fullPath === path, '/page-load-hook')
const loadingEndLogs = consoleLogs.filter(c => c.text.includes('page:loading:end'))
expect(loadingEndLogs.length).toBe(1)
await page.close()
})
it('should hide nuxt page load indicator after navigate back from nested page', async () => {
const LOAD_INDICATOR_SELECTOR = '.nuxt-loading-indicator'
const { page } = await renderPage('/')
await page.getByText('to page nuxt load indicator').click()
await page.waitForFunction(path => window.useNuxtApp?.()._route.fullPath === path, '/nested/xyz')
await page.waitForSelector(LOAD_INDICATOR_SELECTOR)
let isVisible = await page.isVisible(LOAD_INDICATOR_SELECTOR)
expect(isVisible).toBe(true)
await page.waitForSelector(LOAD_INDICATOR_SELECTOR, { state: 'hidden' })
isVisible = await page.isVisible(LOAD_INDICATOR_SELECTOR)
expect(isVisible).toBe(false)
await page.goBack()
await page.waitForSelector(LOAD_INDICATOR_SELECTOR)
isVisible = await page.isVisible(LOAD_INDICATOR_SELECTOR)
expect(isVisible).toBe(true)
await page.waitForSelector(LOAD_INDICATOR_SELECTOR, { state: 'hidden' })
isVisible = await page.isVisible(LOAD_INDICATOR_SELECTOR)
expect(isVisible).toBe(false)
await page.close()
})
}) })
describe('nuxt composables', () => { describe('nuxt composables', () => {

View File

@ -3,6 +3,7 @@
<Head> <Head>
<Title>Basic fixture</Title> <Title>Basic fixture</Title>
</Head> </Head>
<NuxtLoadingIndicator :throttle="0" />
<h1>Hello Nuxt 3!</h1> <h1>Hello Nuxt 3!</h1>
<div>RuntimeConfig | testConfig: {{ config.public.testConfig }}</div> <div>RuntimeConfig | testConfig: {{ config.public.testConfig }}</div>
<div>Composable | foo: {{ foo }}</div> <div>Composable | foo: {{ foo }}</div>
@ -94,6 +95,12 @@
<NuxtLink to="/server-page"> <NuxtLink to="/server-page">
to server page to server page
</NuxtLink> </NuxtLink>
<NuxtLink to="/page-load-hook">
to page load hook
</NuxtLink>
<NuxtLink to="/nested/xyz">
to page nuxt load indicator
</NuxtLink>
</div> </div>
</template> </template>

View File

@ -0,0 +1,5 @@
<template>
<div>
Page for hook tests.
</div>
</template>

View File

@ -0,0 +1,8 @@
export default defineNuxtPlugin((nuxtApp) => {
const route = useRoute()
nuxtApp.hook('page:loading:end', () => {
if (route.path === '/page-load-hook') {
console.log('page:loading:end')
}
})
})