Tooltips Do Not Work on Child Elements

[isteiger]

When upgrading, I noticed my tooltips on anything other than text (such as a Font Awesome icon) did not work. On Bootstrap 4 it works. I know it is a Bootstrap problem and not a Popper.js problem as it worked in Bootstrap 4.

My Info:
macOS Catalina 10.15.5, Chrome 83.0.4103.97

Here is a CodePen

[XhmikosR]

Not sure it's JS-related after all. It seems Font Awesome related. Changing z-index to -1 works:

.fas {
  z-index: -1;
}

Note that you don't need jQuery nor popper.js; you can just use our bundle dist file.

[isteiger]

That fixes it, but I wonder why it works in v4 and is broken in v5.

[isteiger]

I checked the HTML and it doesn't even appear there on the bottom of it unless the z-index is set to -1.

[XhmikosR]

Yeah, I hadn't have the chance to look closer, maybe someone else from the team will.

[isteiger]

I found something. Let me update my codepen.

[isteiger]

Check the codepen.

[XhmikosR]

Could be #30928

[isteiger]

After testing that, the issue went away. Could you link the pull request to this issue?