<Dropdown /> doesn't render title tooltip on hover in firefox

[SwapnilAhire]

BUG -

[Firefox 88.0.1] Tool tip is not rendered when I hover over any of the option in drop down .
[Chrome/Firefox] There's a blue bottom line shows when I select any option from the drop down, instead it should show blue rectangle outline.

Description -

I am on Firefox 88.0.1 and @carbon/ibm-security is at 1.41.0
Attached screenshots that explains the issues.

Actual implementation:

Expected behavior -

Tool tip should render while hovering over any of the options in the drop down on Firefox browser
On Chrome/Firefox, the blue outline rectangle should display for the selected option in the drop down

Actual behavior -

Tool tip does not render on Firefox version 88.0.1, for Chrome browser it works as expected.
On Chrome/Firefox, it shows just blue bottom outline below the selected option in the drop down

Steps for reproducing -

(TRY it in both Chrome and Firefox and hover over ellipsised text option)
Sandbox URL - https://codesandbox.io/s/stupefied-bush-ntvn0?file=/src/index.js

Browsers

Firefox 88.0.1
Chrome 90.0.4430.212

Optional information

• none

[joshblack]

Hi @SwapnilAhire! 👋 Thanks so much for taking the time to make this issue. Can confirm the text truncation browser tooltip issue, having a hard time re-creating the focus border issue though. Could you share more steps to reproduce?

[SwapnilAhire]

@joshblack Thanks for you valuable feedback. After global css fix for dropdown, I can confirm that the focus border issue has been resolved and its not related to component at all but the tooltip issue still exists.

[SwapnilAhire]

@joshblack @tay1orjones Could anyone of you please help me with the list of packages that need to be updated to fix this issue?

[tay1orjones]

@SwapnilAhire A fix for this hasn't been delivered yet.

I looked into this a bit, it doesn't look like there is a way to control the browser based title tooltips. I'm not sure why they're not being shown in Firefox. We may need to lump this in with moving all browser-based title tooltips to use the Carbon tooltip, #9208

[toeikmei]

Hi @tay1orjones @joshblack has there been some progress? We are still facing the issue with the tooltip.

[dakahn]

Im looking at this issue now. It seems like title is being unset in Firefox 😕
Firefox

Chrome

But the prop is showing up like we'd expect

[dakahn]

Seems to be a rounding issue unique to Firefox, commented on a closed issue here
https://bugzilla.mozilla.org/show_bug.cgi?id=1250824

[tay1orjones]

Leaving this open as it's outstanding, just blocked by firefox.

The intent is still to more broadly fix/avoid this issue by implementing #9208. It's an accepted proposal but is not yet planned for the core team to implement. Contributions definitely welcome! 🙏

[guidari]

I just tested on Firefox and now we have the tooltip working as expected.

The tooltip

The code with title showing up