Tippyjs: Tooltip Will Not Show Up When .show() Is Called

[faroukcharkas]

Hello,

For reference, I am using Tippy.js v2 (beta). I am also using the _tippy.all.min.js_ file.

What is happening:
Everything is being set (data-tippy is implemented, etc.) No tooltip is visible. No errors outputted. After some browsing, I also checked the object and it points towards _div#tippy-1_ which is null in the document. This means that Tippy probably is not making the popper.

What should be happening:
The tooltip is supposed to show when I call _target._tippy.show()._

This might be an error on my side. Anyhoo, it'd be great if you could check the code and see if for some reason Tippy ignores something I am using?

_Variables "id" and "message" are both strings. "target" is (in this case) an input (button, password, email, text)._

document.getElementById(id).title = message;
var target = document.getElementById(id);
tippy(target, {
     placement: "right",
     arrow: true,
     flip: true,
     theme: "error"
});
target._tippy
target._tippy.show()

[faroukcharkas]

UPDATE: To fix this, I made a DIV and gave it an ID of _"tippy-1"_ and a class of _"tippy-popper"_

[atomiks]

The popper isn't appended to the DOM until it's shown so that's why it's null, but the other steps are correct. Can you reproduce it in a CodePen?

Here is a starter pen: https://codepen.io/anon/pen/EbrEqd?editors=1010

[atomiks]

I will reopen if a valid reproduction case can be made.

[zanzlanz]

I had a similar issue, and my fix was to make the call asynchronous:
setTimeout(function(){ element._tippy.show() }, 0);

I wasn't able to figure out why the issue was happening, as everything existed and seemed ready to be called. But I hope this ugly hack helps anyone who might also be having the issue!