fix(client): guard useNav against a missing injection context (#2694)

Author: renechoi

packages/client/composables/useNav.test.ts

@@ -127,4 +127,14 @@ describe('useNavBase', () => {
     expect(observedNav?.currentSlideRoute.value.meta.slide.frontmatter.title).toBe('Second')
     expect(observedNav?.tocTree.value[1].active).toBe(true)
   })
+
+  it('falls back to the shared nav when there is no injection context', () => {
+    // Directive hooks such as `v-motion`'s and `v-mark`'s `mounted` call
+    // `useNav()` while no component instance is current. There is no
+    // slide-local context to read there, so the shared nav is the answer.
+    vi.stubGlobal('location', { search: '' })
+
+    expect(() => useNav()).not.toThrow()
+    expect(useNav().currentSlideNo.value).toBe(1)
+  })
 })

packages/client/composables/useNav.ts

@@ -4,7 +4,7 @@ import type { RouteLocationNormalized, Router } from 'vue-router'
 import { clamp } from '@antfu/utils'
 import { parseRangeString } from '@slidev/parser/utils'
 import { createSharedComposable, injectLocal } from '@vueuse/core'
-import { computed, ref, toRaw, watch } from 'vue'
+import { computed, hasInjectionContext, ref, toRaw, watch } from 'vue'
 import { useRoute, useRouter } from 'vue-router'
 import { slides } from '#slidev/slides'
 import { CLICKS_MAX, injectionSlidevContext } from '../constants'
@@ -404,7 +404,13 @@ const useSharedNav = createSharedComposable((): SlidevContextNavFull => {
 
 export function useNav(): SlidevContextNavFull {
   const nav = useSharedNav()
-  const context = injectLocal(injectionSlidevContext, undefined)
+  // `useNav()` is also called outside of `setup()`, most notably from the
+  // `mounted`/`created` hooks of the `v-motion` and `v-mark` directives.
+  // `injectLocal` throws there, and there is no slide-local context to read
+  // anyway, so fall back to the shared nav.
+  const context = hasInjectionContext()
+    ? injectLocal(injectionSlidevContext, undefined)
+    : undefined
   if (!context)
     return nav