Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Bug Report][3.0.0-beta.2] When using v-tooltip in v-button, if the button trigger a router event, the router change may fail #15130

Closed
GuMengYu opened this issue May 21, 2022 · 1 comment
Assignees
Labels
C: VOverlay VOverlay T: bug Functionality that does not work as intended/expected
Milestone

Comments

@GuMengYu
Copy link

Environment

Vuetify Version: 3.0.0-beta.2
Vue Version: 3.2.35
Browsers: Edge 101.0.1210.32
OS: Mac OS 10.15.7

Steps to reproduce

Try to use v-tooltip components in v-button

<v-btn class="mr-2" @click="back">back
    <v-tooltip activator="parent" anchor="bottom">back</v-tooltip>
</v-btn>

step1: push to page 1
step2: push to page 2
step3: use router.back() or history.back() back to page1

Expected Behavior

go back to page1

Actual Behavior

not working, throw error

Error: Navigation aborted from "/explore" to "/discover" via a navigation guard.
    at createRouterError (vue-router.esm-bundler.js:827:23)
    at next (vue-router.esm-bundler.js:1911:24)
    at vue-router.esm-bundler.js:1971:18
    at VOverlay.tsx:168:9
    at router.tsx:87:35

Reproduction Link

https://codepen.io/gumengyu/pen/GRQEYOJ

Other comments

Related source code:
packages/vuetify/src/components/VOverlay/VOverlay.tsx

useBackButton(next => {
      if (isTop.value && isActive.value) {
        next(false)
        if (!props.persistent) isActive.value = false
        else animateClick()
      } else {
        next()
      }
    })
@KaelWD KaelWD added T: bug Functionality that does not work as intended/expected C: VOverlay VOverlay and removed S: triage labels May 21, 2022
@KaelWD KaelWD added this to the v3.0.0-beta milestone May 21, 2022
@KaelWD KaelWD self-assigned this May 21, 2022
KaelWD added a commit that referenced this issue May 22, 2022
@KaelWD
Copy link
Member

KaelWD commented May 22, 2022

We can't tell the difference between that and the actual back button: vuejs/vue-router#3453

I've added a close-on-back prop that is false by default in v-tooltip

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
C: VOverlay VOverlay T: bug Functionality that does not work as intended/expected
Projects
None yet
Development

No branches or pull requests

2 participants