Date Posted:
Product: TIBCO Spotfire®
Product: TIBCO Spotfire®
Problem:
Troubleshooting JavaScript added to an HTML Text Area.
Solution:
If you are experiencing an HTML rendering issue, it is possible to further test JavaScript code that is added in HTML Text Areas via the JavaScript feature.
Spotfire WebPlayer:For Web Player clients, use the browser Web Developer tools that can be accessed via F12 on your keyboard. See the reference links below for further information on using such browser tools.
Spotfire Analyst clients:
Version 7.5 and Higher:
1). Open Spotfire Analyst Client and goto Tools
2). Select Options and select "Application"
3). Check the "Show Development menu" option and select OK
4). Goto Tools and select Development
5). Select Developer Tools to launch a developer tools windows similar to that of a browser to inspect the HTML rendered
Version 7.0 and Lower:
1). Launch the Spotfire Analyst/Professional/Desktop client.
2). Open the DXP analysis where you are having the issue.
3). Close any other panel, such as the Filter panel, Data panel, Details-on-Demand, etc.
4). Determine the local browser version and mode that the HTML Text Area uses to render its content. To do so,
Edit the HTML of the text area.
Add an empty div element as:
<div id= "navigatorVersion"></div>Save the modified HTML.
Add a new JavaScript to the text area with the following code:
$(document).ready(function(){
$("#navigatorVersion").text(navigator.userAgent);
});
Once the text area renders, it should display the browser version and mode. You will use that information to test your issue. Note that rendering of HTML Text Area Visualizations in the Spotfire desktop client uses a third party component from Microsoft, .NET WebBrowser control, which runs Internet Explorer (IE) in compatibility view. This means that Internet Explorer might report itself as the application version number "Mozilla/4.0" and version token MSIE7.0. The Trident token will always be different and allows applications to distinguish the running IE version. For example, IE9 will be Trident/5.0, IE10 will be Trident/6.0 and IE11 will be Trident/7.0 .See the reference links below for a complete list of user agent strings.
5). Launch the Fiddler Web debugger. You can download and install Fiddler2 from http://www.fiddler2.com/fiddler2/version.asp.
6). In the Spotfire desktop client, toggle between editing the HTML and not editing, which will force the text area to render. This will generate entries in Fiddler.
7). Leave the Spotfire desktop client and the analysis file running. In Fiddler, stop the network capture, using File > un-check Capture Traffic.
8). Look for Fiddler entries whose host is localhost:8000, or another port number that is above 8000. This is the local web server that communicates with the Spotfire client to render web-based views of visualizations. In order to find the port number, search the Spotfire Diagnostics Log file.
9). Copy the request's URL address. For example, http://localhost:8000/?view=2e9360d4-9b52-479b-80c2-f7d9b86353de&seed=2 .
10). Launch your local Internet Explorer browser.
11). Paste and navigate to the copied URL address.
12). Press F12 on your keyboard to bring up the browser developer tools.
13). Change the browser and document mode to the one identified previously. For information on how to simulate a different IE version, see https://msdn.microsoft.com/library/bg182326%28v=vs.85%29; https://msdn.microsoft.com/en-us/library/dd565628%28v=vs.85%29.aspx.
14). Test the HTML and JavaScript using the browser Web Developer tools.
External: Using the browser developer tools in Internet Explorer.
Wiki: Best Practices for Writing Custom JavaScript Code in Text Areas
User Agent strings List: