JavaScript and Web Context Management

JavaScript offers Web developers many options for doing things that can not be achieved through HTML techniques, and therefore can not be simulated using the Silk Performer replay engine by simply parsing HTML. This makes JavaScript a leading cause of context loss.

HTTP requests that result from JavaScript actions often can not be described in terms of WebPageLink or WebPageSubmit functions, therefore the recorder has to generate context-less functions.

This topic offers some examples, but is by no means a complete listing of all scenarios that may be encountered.

JavaScript Redirection and Reload

This example demonstrates how JavaScript can be used to redirect to another URL, thereby introducing state information (load balancing, session IDs, and more).

<html>
  <head>
    <title>Login</title>
  </head>
  <body
    onload="location='http://www4.company.com/usr/6543/login.asp'">
  </body>
</html>

Embedded Objects Loaded by JavaScript

This example shows how JavaScript can be used to load embedded objects. The Silk Performer HTML parser however does not view these URLs as embedded objects, so the recorder has to generate a script function, otherwise the images will not be downloaded by the replay engine.

Note also that the URLs of these embedded objects are specified relatively. The browser resolves these relative URLs to absolute URLs using the base URL of the HTML document that contains them. So resulting URLs may well contain dynamic information (for example, http://www4.company.com/usr/6543/right_arrow.gif.

<html>
  <head>
    <title>Login</title>
  </head>
  <body onload="PreLoadImages('right_arrow.gif', 'left_arrow.gif', 'up_arrow.gif', 'down_arrow.gif')">
  </body>
</html>

Dynamic HTML

The document.write(…) JavaScript function allows you to dynamically change HTML code on the client side. Ad servers commonly use this technique.

Here's an example:

document.write('<script language=javascript
  src="http://ads.com/ad/offer.asp?date=' +
       escape(date) + '"></scr'+'ipt>');

Form Submissions with JavaScript

JavaScript can modify HTML forms before submitting them by:

Modifying form field values (even hidden fields)
Adding form fields
Removing form fields
Renaming form fields (equivalent to removing a form field and adding another field in the same position)
Changing the action URL

Example HTML code (modified form field names):

<form name="tabform"
      action="/cgi-bin/tabgui.asp"
      method="POST"
      target=_self>
  <input type=hidden name="session" value="6543">
  <input type=hidden name="tabevent" value="">
  <input type=hidden name="tabeventparam" value="">
</form>
<a href="JavaScript:selectTab('3')">Stock Watch List</a>

function selectTab(tabIndex)
{
  // change value of field #2
  document.tabform.elements[1].value = "select";
  // change name of field #3, originally "tabeventparam"
  document.tabform.elements[2].name = "TabIndex";
  // change value of field #3, now "TabIndex"
  document.tabform.elements[2].value = tabIndex;
  document.tabform.submit();
}

The above example demonstrates how JavaScript can submit a form. The form definition in HTML is just a template that is manipulated by JavaScript before it is submitted. The value of the second field ("tabevent", index 1) is changed to "select", the name of the third field ("tabeventparam", index 2) is changed to "TabIndex", and the value is changed to "3".

The following example demonstrates how JavaScript can be used to change the action URL of a form:

function SubmitSearch(linkUrl)
{
  document.searchForm.action = linkUrl;
  document.searchForm.submit();
}
..
<form name="searchForm"
      method="POST"
      target=_self>
  <input type=input name="searchString" value="">
  <input type=hidden name="BV_SessionID"
                     value="@@@@1245417051.1003814911@@@@">
</form>
<a href="JavaScript:SubmitSearch('http://my.server.com/search.asp')">
   Search this site</a>
<a href="JavaScript:SubmitSearch('http://my.mirror.com/search.asp')">
   Search mirror site</a>