Open markwynter opened 8 years ago
I just spent over an hour trying to figure out the problem, but I still don't understand why FF is behaving differently. It seems like when FF doesn't recognize that the shinyjs global variable exists when it tried to add new functions. I'm very confused as to why it acts like this, it feels like a bug in FF. I spent almost two hours looking into this and it just doesn't make sense, I really feel like it's a bug in FF. I might try to come back to it later, but right now I don't know if that's fixable in the near future, sorry!
Many thanks Dean for looking into this. For now I'll use a MutationObserver function in index.html to watch for changes in a hidden RShiny output div - and apply a CSS property to multiple targetDiv's based on the value of the output div. It doesn't use your package, but it works well.
<!-- HIDDEN RSHINY OUTPUTS OBSERVED BY JAVASCRIPT FUNCTION BELOW FOR DYNAMIC STYLING OF ELEMENTS -->
<div id="shinyOutputColor" class="shiny-text-output" style="visibility: hidden"></div>
<script>
$(function() {
function observeDivChange(source, target, cssproperty) {
var sourceElement = document.querySelector(source);
var observer = new MutationObserver(function(mutations) {
mutations.forEach(function(mutation) {
if(mutation.addedNodes[0]){
$(target).css(cssproperty, mutation.addedNodes[0].nodeValue);
}
});
});
var config = { attributes: true, childList: true, characterData: true };
observer.observe(sourceElement, config);
}
observeDivChange("#shinyOutputColor", "#target-div1", "background-color");
observeDivChange("#shinyOutputColor", "#target-div2", "background-color");
observeDivChange("#shinyOutputColor", "#target-div3", "background-color");
});
</script>
We just ran into a similar problem in Firefox. We solved it by injecting the shiny event handlers after the script tag here: https://github.com/daattali/shinyjs/blob/master/R/utils.R#L39
@judas-christ can you share more details on what exactly you did to get it to work?
This is our fork where it works: https://github.com/Olink-Proteomics/shinyjs/commit/d4273fa6ebb244da220a7014e219d5ba036685f6
The issue seems to be that the shinyjs
object is called before being instantiated. It's unclear why this happens only in Firefox. Moving this line last (ie from line 38 to 41 as you can see in the commit above) fixed it:
shiny::tags$script(shiny::HTML(controllers)),
Note that while this works for us, we haven't tested it extensively so it might cause issues with other setups.
Thanks, that's helpful!
I actually made some changes to that setupJS()
function yesterday and it's no longer being used. The system for injecting javascript is now different. It's experimental for now but from my testing so far it seems to hold up. I'm curious if the latest github version fixes this issue.
As mentioned last night, I'm currently working on re-writing shinyjs to make it much easier for users. It should now be simpler to include it in an htmlTemplate, you don't need to use the inject script anymore, you don't even need to do anything in the html. All you need to do now is call useShinyjs()
and optionally extendShinyjs()
in the server, but in a special way. I added two examples showing this: using extendShinyjs() with a script and using extendShinyjs() with a string
I haven't documented it yet because this is still a work in progress so I'm hoping to simplify it even more. I would appreciate if you can try this method and let me know if it works or not.
Hi Dean I'm only a few hours in to learning your project. With your simple PageCol example, if I run the ui = fluidPage(... ) scenario, then everything works nicely across browsers, Firefox included.
However, if I use a www/index.html file for the UI (which I require for creating a custom Dashboard), and do the extra steps required, then the example code works nicely in RStudio and Chrome, but not Firefox. Please see attached screenshot for the Firefox console errors.
Have you come across this issue before in FF? Hopefully its reproducible. I would welcome any insights or suggestions.
My Shiny App file structure is: global.R server.R www/index.html
Best regards Mark