Tableau elements display error if displayed in hidden section of page
When Tableau elements are embedded in a page, and the section of the page that contains the Tableau elements is hidden at page load, an error message is displayed. The same page loads properly in Chrome and IE. Tableau is aware of this problem and has declined to fix it. See http://kb.tableau.com/articles/issue/error-attempted-to-use-commandcontroller-before-creating-it-embedded-view for more information.
A sample page with embedded Tableau elements is available here: http://dev.headwaterseconomics.org/economic-development/local-studies/tableau-firefox-error-example
An image of how the page is displayed in Firefox is attached.
Wšykne wótegrona (2)
You will have to reload the page via F5 or right-click e frame and use "This Frame > Reload Frame" to make the content appear.
Some JavaScript doesn't seems to be executed in the correct order causing XHR requests to be made before other code has finished initializing.
Could I suggest serving the page with the content expanded, and then at a relevant point during the page load, sending a click to the button to close it.
I do not use jQuery so apologies for syntax errors but perhaps you could add something like this:
$(".showhide-link a").click();
to your jQuery(document).ready() handler in
http://dev.headwaterseconomics.org/wphw/wp-content/plugins/he-interactives/js/he-inter-common.js
Hopefully this approach would put all the objects needed by Tableau in place before the content is hidden. Fingers crossed.