-
Notifications
You must be signed in to change notification settings - Fork 19
Open
Labels
acknowledgedAcknowledged, work in progressAcknowledged, work in progressbugSomething isn't workingSomething isn't working
Description
When using the component, route-level pre hooks behave inconsistently depending on how the router-level hooks prop is configured.
Actual Behavior:
When only route-level hooks are defined, they work as expected.
When both route-level and router-level hooks are defined, only the router-level hook is triggered (and twice), while route-level hooks are ignored.
When hooks={undefined} is passed to the router, route-level hooks are also not triggered.
Expected Behavior:
Route-level hooks should always be triggered regardless of the presence or absence of router-level hooks.
Router-level hooks should be triggered once per navigation, not twice.
To Reproduce
<script>
import {Router, route} from "@mateothegreat/svelte5-router";
const routes = [
{
path: "/",
component: Home,
hooks: {
pre: (route) => {
console.log('pre called from: Home')
return true;
}
}
},
{
path: '/about',
component: About,
hooks: {
pre: (route) => {
console.log('pre called from: About')
return true;
}
}
},
]
async function pre(route) {
console.log('pre called from: Router');
return true
}
let useCase = $state('ROUTE_HOOKS_ONLY')
</script>
<div class="mt-7">
<a use:route href="/">home</a>
<a use:route href="/about">about</a>
<select bind:value={useCase}>
<option value="ROUTE_HOOKS_ONLY">ROUTE_HOOKS_ONLY</option>
<option value="ROUTE_AND_ROUTER_HOOKS">ROUTE_AND_ROUTER_HOOKS</option>
<option value="ROUTE_HOOKS_AND_EMPTY_ROUTER_HOOKS_PROP">ROUTE_HOOKS_AND_EMPTY_ROUTER_HOOKS_PROP</option>
</select>
<hr/>
{#if useCase === 'ROUTE_HOOKS_ONLY'}
<div>Route pre hooks works fine</div>
<Router {routes}/>
{:else if useCase === 'ROUTE_AND_ROUTER_HOOKS'}
<div>Actual: Route pre hooks not triggered while router pre hook is triggered twice</div>
<div>Expected: Route pre hooks are triggered and router pre hook is triggered once</div>
<Router hooks={{pre}} {routes}/>
{:else if useCase === 'ROUTE_HOOKS_AND_EMPTY_ROUTER_HOOKS_PROP'}
<div>Actual: Route pre hooks not triggered</div>
<div>Expected: Route pre hooks are triggered, Router hook prop should not have any effect</div>
<Router hooks={undefined} {routes} />
{/if}
</div>
uh-zuh
Metadata
Metadata
Assignees
Labels
acknowledgedAcknowledged, work in progressAcknowledged, work in progressbugSomething isn't workingSomething isn't working