Unexpected behavior with igvShiny in shinydashboard

[heimannch]

HI @paul-shannon, I've observed an unexpected behavior with igvShiny when it is placed in a shinydashboard page. The following gist reproduces the issue: https://gist.github.com/heimannch/58ebd235327dd34b90c764bd19e2a91c (that is the code in igvShinyDemo-withModules.R, with the UI using shinydashboard)

When this code is run at first (after startup or restarting R), the igv plot is not completely inside its box, and the behavior persists if I add/delete tracks:

Quite interestingly, if I close the app and start it again, everything is ok, and the box resizes when new tracks are added/deleted:

I've tried setting the height values in the igvShiny calls, but the problem persists. Do you have any idea of what might be happening?

[paul-shannon]

@heimannch - thanks for the bug report. Looking at this now.

[paul-shannon]

@heimannch - Carolina, this may miss your point, let me know. This github issue suggests adding a height parameter to the box function call, when facing a similar problem.

Since the problem you report is intermittent, I cannot be sure that this change helps.

(And I see that I need to support namespaces, since your gist uses them, and my version of igvShiny does not yet do so.) I will look at that next. Let me know if adding a height parameter to the box call is of any use to you.

[heimannch]

Thanks for your message, @paul-shannon . I've tried to set the box height (and/or also tried to change the height parameter in igvShiny): it does make the box bigger, but its size doesn't change when new tracks are included or excluded. It is my understanding that the box function, as default, adjust its size based on the plot - unless a height value is provided, so in this case the box will always have the specified height.

After taking a look at the javascript console, I noticed a difference in the id of the plot in the first time the app is run and when the app is reloaded:

(i) element id when I first run the app

<div id="germline-germline_gwas-module-igv_plot" style="width: 100%; height: 400px; visibility: inherit;" class="igvShiny html-widget html-widget-output shiny-bound-output" aria-live="polite">

(ii) element id when I refresh the app (results in plot box responsive to changes in the tracks in IGV)

<div id="germline-germline_gwas-module-igv_plot" class="igvShiny html-widget html-widget-output shiny-bound-output" aria-live="polite" style="visibility: inherit;">

I understand that the "400px" info as default comes from the igvShinyOutput function, and then, for some reason, when the app is reloaded (without restarting R) the height info is not sent to the app. So, I changed locally the default value of height in the igvShinyOutput function to NULL:

igvShinyOutput <- function(outputId, width = '100%', height = NULL)

This change had the desired effect to make the box responsive to the inclusion/exclusion of tracks in the igv plot in the first time the app is run - and the div id is the same as in (ii). But I wonder if this change may affect other uses cases - do you have any thoughts? Maybe there is another approach that I am not aware of? If you think this change is OK, I'd be glad to submit a PR with the edit.

[paul-shannon]

@heimannch - please submit that PR. I will test it out. And thank you!

[heimannch]

I am glad I can contribute! I just submitted the PR. I forgot to mention: setting height = NULL in the app UI call also works fine in solving this issue.