Ionic-framework: bug: Navigation Hooks are never called (beforeEnterHook, beforeLeaveHook)

[igorovic]

Bug Report

Ionic version:
[ ] 4.x
[x] 5.x

Current behavior:
ion-route properties beforeEnter and beforeLeave are removed in function matchesPath

snippet

return chain.map((route, i) => ({
      id: route.id,
      path: route.path,
      params: mergeParams(route.params, allparams![i])
    }));

should be something like this

return chain.map((route, i) => ({
      id: route.id,
      path: route.path,
      params: mergeParams(route.params, allparams[i]),
      beforeEnter: route.beforeEnter,
      beforeLeave: route.beforeLeave
    }));

Because then the navigation hooks are used in router.tsx

snippet

const beforeEnterHook = toChain && toChain[toChain.length - 1].beforeEnter;
const beforeLeaveHook = fromChain && fromChain[fromChain.length - 1].beforeLeave;

_But since those properties where previously removed they are always undefined._

[liamdebeasi]

Thanks for the issue. Can you provide a code reproduction of the issue and provide a link to the GitHub repo?

[ionitron-bot[bot]]

Thanks for the issue! This issue has been labeled as needs reproduction. This label is added to issues that need a code reproduction.

Please provide a reproduction with the minimum amount of code required to reproduce the issue. Without a reliable code reproduction, it is unlikely we will be able to resolve the issue, leading to it being closed.

For a guide on how to create a good reproduction, see our Contributing Guide.

[igorovic]

Here is the reproduction code.

https://github.com/igorovic/ionic-bug-navhooks

You should check the file app-root.tsx

[liamdebeasi]

Thanks! Can you try the following dev build and let me know if it resolves the issue?

npm install @ionic/[email protected]

[igorovic]

Yes it works :thumbsup:

Side note: _My VScode ts linter is not happy with my custom component since I installed this dev build._

[liamdebeasi]

Side note: My VScode ts linter is not happy with my custom component since I installed this dev build.

Are you getting an error?

[igorovic]

Never mind, it's an issue in my custom component that broke the linter.

Regarding the navigation hook it's fixed in => @ionic/[email protected]

[liamdebeasi]

Glad it's fixed! Thanks for double checking the linter issue.

[igorovic]

Thank you for the fix 👍 . I would have done it myself but I didn't read the contribution guide yet. 😄

[liamdebeasi]

Thanks for the issue. This has been resolved via https://github.com/ionic-team/ionic-framework/pull/22521, and a fix will be available in an upcoming release of Ionic Framework.