Check for popperInstance before calling forceUpdate()

[mfal]

Like the typings already hinting, the popperInstance can be null and thus should be checked before accessing it to avoid TypeErrors.

[atomiks]

The reason a check isn't needed there is because if the popper is queried on the DOM, that means it's showing and its popper instance is always available

[mfal]

I can provide you with an example. Maybe i'm doing something wrong...

[mfal]

You can try it here: https://codesandbox.io/s/pedantic-kalam-o9z4n

[mfal]

Might also fix #773?

[atomiks]

The working structure is:

      <Tippy singleton={source} render={(attrs, content) => <div {...attrs}>{content}</div>} />

      <Tippy
        singleton={target}
        content="First tooltip"
      >
        <button>First</button>
      </Tippy>

      <Tippy
        singleton={target}
        content="Second tooltip"
      >
        <button>Second</button>
      </Tippy>

The one in the CodeSandbox isn't the way singletons are used (or were tested at least)

[mfal]

Error is gone, but tooltips are not disappearing anymore. Any ideas on that issue? (See updated CodeSandbox)

[atomiks]

If you're using the render function, you likely want to be using Headless Tippy instead:

import Tippy, { useSingleton } from "@tippyjs/react/headless";

That's due to animations not being implemented with the default import, therefore the tippy doesn't unmount. You need to set animation={false} on the source singleton otherwise.

[mfal]

Many THX @atomiks 👏