histogram doesn't appear in responsive views when collapse: false

[ebenenglish]

When the date range facet is defined in CatalogController with the collapse: false option, as in...

config.add_facet_field 'date_facet_yearly_ssim', label: 'Date', range: true, collapse: false

And the facets on the search results page are "collapsed" due to a responsive view based on the user's viewport (iPhone portrait, iPad portrait, etc.)...

And the user clicks the button to expand the facets...

The histogram visualization is not displayed in div.chart_js.

However, if the user collapses the date range facet and then re-expands it, the histogram is displayed.

See the screen recording below for an example:

[jrochkind]

That's too bad. I know this used to work at one point, I recall manually testing this exact scenario. But the code has changed since then, and this is a sort of thing it's very difficult to make automated tests for.

This stuff has been VERY hard to maintain the chart rendering has seemed to break frequently with many releases. :(

[jrochkind]

I can not reproduce this one in our own (real, production) app, on Blacklight 7.7.0 and blacklight_range_limit 7.9.1. In single-column collapsed mode, when clicking to reveal facets and then date facet specifically, the chart is there as expected for me. (See https://digital.sciencehistory.org/catalog?q= )

I haven't tried to reproduce on "empty" apps, so I don't know if the difference is gem versions, something else in our app, or something else -- I have previously run into chart rendering errors that could even differ depending on browser, or even in the same browser relevant to timing of DOM rendering such that adding or removing things from the page could effect ability to reproduce. :(

It might make sense to add blacklight version, blacklight_range_limit version, and browser(s) reproducing to the report.

[ebenenglish]

Thanks for testing, @jrochkind. What about if you were to set collapse: false for the year_facet_isim facet here:
https://github.com/sciencehistory/scihist_digicoll/blob/master/app/controllers/catalog_controller.rb#L203

I think it's the collapse: false setting in add_facet_field in conjunction with the collapsed responsive facet view that's the issue.

FWIW, we're running:

• blacklight-7.13.2
• blacklight_range_limit-7.9.1
• bootstrap-4.5.3
• rails-6.0.3.4

I haven't tried to reproduce this in a vanilla app yet.

With our app (not yet in full production, but running on our QA server here), I'm seeing this behavior with the following device/browser combos:

• iPhone 8: Chrome, Safari, Firefox
• iPad: Safari
• Mac (Mojave): Firefox, Chrome, Safari, Opera

[jrochkind]

Ah, I see, I missed the collapse: false part of the reproduction. Haven't had time to try to reproduce yet. What is "collapse: false" supposed to do, make it not collapsible, always open?

There is some tricky and possibly problematic JS involved in the blacklight_range_limit that tries to calculate the height/width of the chart and pre-render it even when it's off-screen, which gets tricky. I wonder if it's somehow going wrong. I think there is some way to tell it explicit height/width instead of it trying to calculate it, and I wonder if that would effect the repro, but it doesn't seem to be documented how you do that and I am not sure. How frustrating.

[ebenenglish]

What is "collapse: false" supposed to do, make it not collapsible, always open?

Yes, exactly. Makes it open by default, the user can choose to collapse/re-open if desired.