.CodeMirror-sizer min-width exceeds by far the screen width

[markusd1984]

Not sure what's going on but min-width generated by codemirror.js is causing me issues:

<div class="CodeMirror-sizer" style="margin-left: 31px;min-height: 5279.5px;min-width: 2437.61px;"><div style="position: relative; top: 525px;">

How best can I check why it's using such big oversized dimensions?

Thanks for any help, this plugin really rocks for reading css code!

[acao]

it could be an issue with CodeMirrorSizer. are you able to reproduce this issue? was it from importing the library or using the CDN bundle?

[benjie]

@markusd1984, @ryanquinn3, @markrebec - are you still facing this issue? If so, please provide detailed reproduction steps.

[MrJoy]

I seem to have suddenly developed this problem. I'm trying to narrow things down to see what I changed to induce it and will see if that yields some useful diagnostic info.

[MrJoy]

Welp. I have no idea what's going on now, but it works when deployed to our staging environment and isn't usable when local. Same git commit of our project. I.E. I don't have anything useful to add, unfortunately.

[MrJoy]

I can confirm that it doesn't have to do with browser state: I've tried in current versions of Safari, Chrome, and Firefox (all on macOS), and am seeing the same behavior everywhere. Since I don't use Firefox typically, I can be confident I didn't accidentally cache something broken in every browser.

I have determined that it doesn't happen if I run our stack in Docker. So it's either some quirky issue on macOS, or I've got some sort of poisoned webpack/node cache.

[thomasheyenbrock]

Hey @MrJoy 👋 the GraphiQL UI and its CSS have been completely reworked in graphiql@2. Is this still an issue for you in the latest version?

[MrJoy]

@thomasheyenbrock I will try things out today, and let you know!

[MrJoy]

Works perfectly. Thank you!