[graphiql] Info popups lose position on page scroll

[lesleydreyer]

Is there an existing issue for this?

• I have searched the existing issues

Current Behavior

If not using the editor as full page (have other divs above or below and scroll enabled by turning off the body css overflow: hidden), the info popups will lose their place on the page when you scroll. I think it's coming from codemirror-graphql > src > utils > info-addon > onMouseOver > info on line 104. I wasn't sure if there's a way to try re-calculating the info if it's not found based on where the editor has scrolled to.

initial position person tooltip works	scolled position person tooltip broke

Expected Behavior

Should be able to see the hover tooltips

Steps To Reproduce

1. Temporarily adjust grapiql > src > components > Graphiql.tsx to 
    <div>
       <div style={{height: '200px'}}/>
       ...GraphiQLProvider element that's there
       <div style={{height: '200px'}}/>
    </div>
2. graphiql > resources > index.html.ejs temporarily comment out the body css "overflow: hidden"

Module pattern

• graphiql-umd
• graphiql-esm
• graphiql-commonjs

Environment

- GraphiQL Version:
- OS:
- Browser:
- Bundler:
- `react` Version:
- `graphql` Version:

Anything else?

No response

[dimaMachina]

@lesleydreyer released in graphiql@3.0.0-alpha.0