Repository: prometheus/prometheus (language: go)

Issue:
UI: Scrape interval and duration tooltip not showing
<!--

    Please do *NOT* ask support questions in Github issues.

    If your issue is not a feature request or bug report use our
    community support.

    https://prometheus.io/community/

    There is also commercial support available.

    https://prometheus.io/support-training/

-->

**What did you do?**

I hovered over the scrape duration for a target on the targets page.

**What did you expect to see?**

A tooltip with the current scrape interval and timeout.

**What did you see instead? Under which circumstances?**

While in full screen, the tooltip did not show, instead the cursor just flickered between the pointer mode and the text selection mode:

<img width="1512" alt="Screen Shot 2022-03-20 at 4 59 26 PM" src="https://user-images.githubusercontent.com/54278938/159185778-cfcee247-52df-4c1f-8c42-e48978c0603c.png">

But, when the width of the window was reduced, the tooltip did show as it should:

<img width="658" alt="Screen Shot 2022-03-20 at 4 58 18 PM" src="https://user-images.githubusercontent.com/54278938/159185858-9ac3d279-7731-4545-bcd7-7336e6b71f7a.png">

The code for the tooltip is here: 

https://github.com/prometheus/prometheus/blob/c901ebaf8dd1273de415f8a32617d708c4256683/web/ui/react-app/src/pages/targets/TargetScrapeDuration.tsx#L29-L35

**Environment**

Tested in Chrome and Safari.

* Prometheus version:
```
prometheus, version 2.34.0 (branch: main, revision: c901ebaf8dd1273de415f8a32617d708c4256683)
  build user:       levi@Levis-MBP.home
  build date:       20220320-20:19:28
  go version:       go1.17.2
  platform:         darwin/arm64
```


Discussion / hints:
ah yeah indeed. I'm wondering if it's the right place to put this kind of info.
I tried with the prometheus demo (v2.27) and it doesn't work there as well. But I don't know when it has been added.
I don't think it's in v2.27. To your first point, we were discussing this in #10432 as we want to add additional values and we're not sure the tooltip is the right place.

Fix patch:
diff --git a/web/ui/react-app/src/pages/targets/TargetScrapeDuration.tsx b/web/ui/react-app/src/pages/targets/TargetScrapeDuration.tsx
index 66fac4e087c..4506b36ab74 100644
--- a/web/ui/react-app/src/pages/targets/TargetScrapeDuration.tsx
+++ b/web/ui/react-app/src/pages/targets/TargetScrapeDuration.tsx
@@ -24,6 +24,7 @@ const TargetScrapeDuration: FC<TargetScrapeDurationProps> = ({ duration, interva
         isOpen={scrapeTooltipOpen}
         toggle={() => setScrapeTooltipOpen(!scrapeTooltipOpen)}
         target={CSS.escape(id)}
+        placement={'right-end'}
         style={{ maxWidth: 'none', textAlign: 'left' }}
       >
         <Fragment>


Test patch: