search

andrewdavey / immutable-devtools

Chrome Dev Tools custom formatter for Immutable-js values
BSD 3-Clause "New" or "Revised" License
661 stars 29 forks source link

Address aggressive truncation in Scope panel #38

Closed dbassett17 closed 4 years ago

dbassett17 commented 4 years ago

@andrewdavey

At some point in the last few months an update to Chrome has made the extension start to truncate anything in the Scope panel that's larger than the panel. I'm not really sure what this change was and after spending a few hours looking for it I found nothing obvious in the Chrome changelogs.

I was able to fix this issue by adding position: relative to the top level span elements which effectively just ignores the wrapping elements truncation rules. The ellipsis still appears on top of the carrot but it's a minor issue compared to the data not showing up at all. I tried a bunch of other solutions and couldn't get anything to work quite as well as the position: relative so if anyone else has any suggestions I'd be happy to look into them

I think it used to cut off the record at the end of the line instead of wrapping it around to the next line which could be slightly concerning for larger records so if you think that's an issue I can look into ways to fix it.

I ran the test page and didn't see any regressions in my testing

Example

Before After
image image
nbperry commented 4 years ago

@andrewdavey can you take a quick look at this? This issue has been becoming more and more annoying and this seems to fix it locally. This should also fix the issue in https://github.com/mattzeunert/immutable-object-formatter-extension which then @mattzeunert could probably do a new release to the chrome store.

andrewdavey commented 4 years ago

Thanks for the contribution!

Merged and published v0.1.5 to npm