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

TypeError: Cannot read properties of null (reading 'parentNode') when trying to use tooltips with the latest version #1759

Open
6 tasks done
tjerman opened this issue Feb 10, 2024 · 3 comments
Labels
bug Something isn't working need reproduction This needs a reproduction in order to continue stale There has been no additional replies or questions and the thread is assumed closed

Comments

@tjerman
Copy link

tjerman commented Feb 10, 2024

Describe the bug

Following these instructions to use tooltips like so:

<template>
  <button v-b-tooltip="'My title'">xx</button>
</template>
<script lang="ts" setup>
import { vBTooltip } from "bootstrap-vue-next";
</script>

I was getting this error when navigating between routes using vue router

Uncaught (in promise) TypeError: Cannot read properties of null (reading 'parentNode')
    at parentNode (chunk-ZFKCPPMZ.js?v=a2cdeadc:9626:30)
    at Object.resolve (chunk-ZFKCPPMZ.js?v=a2cdeadc:2979:15)
    at Object.resolve (chunk-ZFKCPPMZ.js?v=a2cdeadc:3009:28)
    at chunk-ZFKCPPMZ.js?v=a2cdeadc:3108:20

If I was just loading up a page and looked at the tooltips, it worked just fine.
As soon as I tried to navigate to some page, it erroed out.

After downgrading to

{
    "@bootstrap-vue-next/nuxt": "0.15.5",
    "bootstrap-vue-next": "0.15.5",
}

it works as expected.

Reproduction

/

Used Package Manager

npm

Validations

  • Have tested with the latest version. This is still alpha version and sometime things change rapidly.
  • Follow our Code of Conduct
  • Read the Contributing Guide.
  • Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
  • Check that this is a concrete bug. For Q&A, please open a GitHub Discussion instead.
  • The provided reproduction is a minimal reproducible of the bug.
@tjerman tjerman added the bug Something isn't working label Feb 10, 2024
@xvaara xvaara added the need reproduction This needs a reproduction in order to continue label Feb 13, 2024
Copy link
Contributor

Hello @tjerman. Please provide a minimal reproduction using StackBlitz vite with script setup / light vue or a link to a repo.

@xvaara
Copy link
Contributor

xvaara commented Feb 13, 2024

I pasted your code to stackblitz and it works... can you provide a reproduction?

https://stackblitz.com/edit/github-ivrnps?file=src%2Fcomponents%2FComp.vue

I guess when you're navigating between pages some element is removed from dom before the directive cleans up after it self.

Use component to be sure:

     <BTooltip>
        <template #target>
          <BButton>
            tooltip component
          </BButton>
        </template>
        Tooltip content
      </BTooltip>

Copy link
Contributor

This issue is stale because it has been open for 30 days with no activity. It will not be auto-closed

@github-actions github-actions bot added the stale There has been no additional replies or questions and the thread is assumed closed label Mar 15, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug Something isn't working need reproduction This needs a reproduction in order to continue stale There has been no additional replies or questions and the thread is assumed closed
Projects
None yet
Development

No branches or pull requests

2 participants