Applies to: TestComplete 8

Introduction

All recent versions of web browsers allow opening web pages in separate tabs. In general, there can be several browser instances launched, each having several tabs opened. So, you have to keep this in mind when web testing with TestComplete.

This article describes how the page tabs are implemented in most popular browsers (Internet Explorer 7-8, Firefox 2-3), and provides code snippets that demonstrate how to perform the following typical tab-related tasks:

• Open new tab.
• Close the specified tab.
• Activate the tab that contains the desired web page.
• List pages opened in all tabs of all browser copies.
• Search for a specified URL in any of the opened browsers.

Understanding Tabbed Browsers for Web Testing

All browsers implement the “tab” functionality differently based on the manufacturer. The following sub sections below describe how each browser implements this functionality:

• Mozilla Firefox ver. 2 and later
• Internet Explorer ver. 7
• Internet Explorer ver. 8

Mozilla Firefox ver. 2 and later.

Mozilla browsers always have one instance of the firefox.exe process running. When you launch another copy of a browser, another executable is not started. Instead, Mozilla creates a new instance of the MozillaUIWindowClass window that contains the UI elements of a browser’s main window and hosts the pages opened in that copy of a browser.

In TestComplete the pages opened in Mozilla Firefox are represented as child Page objects of the firefox.exe process. And the browser’s UI elements are represented by UIPage objects. These objects reside as grandchildren of the MozillaUIWindowClass window. When the “Make Page object a child of the browser process” project property is enabled, the Page and UIPage objects also become available as immediate children of the firefox process.

For example, suppose we have launched two copies of Firefox and opened 2 tabs in the first one and 3 tabs in the second one. Exploring the object hierarchy in TestComplete’s Object Browser we will see one instance of firefox.exe that hosts 5 Page objects that relate to pages opened in tabs and 2 UIPage objects that relate to the browser copy’s main windows.

Internet Explorer ver. 7

This version of Internet Explorer creates a separate iexplore.exe process instance for each of the launched copies, and each copy hosts its own set of opened pages. The browser’s main window is represented as IEFrame object and contains the Page objects that correspond to opened tabs. When the “Make Page object a child of the browser process” project property is enabled, the Page objects become available as immediate children of the iexplore process.

Getting back to the same example, if you launch two copies of IE7 and open 2 tabs in the first one and 3 tabs in the second one, then there will be two instances of iexplore.exe which have, 2 and 3 Page objects, and two instances of the IEFrame object.

Internet Explorer ver. 8

This browser has the most peculiar behavior of all. The reason for this behavior is Microsoft’s Loosely Coupled IE (LCIE) concept. According to it, each tab should have its own process so that the rest of the tabs and the browser’s main window would not be affected when a single tab-process crashes. So, upon start, IE8 launches two instances of iexplore.exe, the first one for the main application’s window, I will call this the master-process, and the second one for the opened tab, which I will call the tab-process. Opening of any subsequent tab typically launches a new instance of a tab-process.

The word “typically” is emphasized because the actual algorithm is more sophisticated and depends on a number of factors and parameters. Therefore, a tab-process may eventually hold more than one web page. The following blog contains more information about this: http://blogs.msdn.com/askie/archive/2009/03/09/opening-a-new-tab-may-launch-a-new-process-with-internet-explorer-8-0.aspx.

Another “tricky” aspect of the Loosely Coupled IE concept, is the manner the popup windows and dialogs are treated. Typically the popup windows and dialogs are created in the same instance of the tab-process that hosts the page which invoked the popup or dialog. However, if the popup or dialog affects the entire browser, for example, a warning shown in the Internet Explorer Information bar, then the corresponding object is created in the master-process.

Tip: The abovementioned blog entry also tells how you can disable the LCIE through the registry key. To disable LCIE:

1. Open registry editor.
2. Go to the HKEY_CURRENT_USER\Software\Microsoft\Internet Explorer\Main section and locate the TabProcGrowth key. If the key does not exist, create a new DWORD (32-bit) Value or String Value and name it as TabProcGrowth accordingly.
3. Set the value of the TabProcGrowth key to 0. This will instruct IE to open all the tabs within the same iexplore.exe process.

That is, by switching the LCIE off, you can force Internet Explorer 8 to behave just like Internet Explorer 7. However all the benefits of Loosely-Coupled IE will be disabled as well.

TestComplete reflects the structure of IE8 processes in the following way:

The master-processes are represented as iexplore processes that contain the IEFrame object, which, in turn, contain the Page objects that correspond to all pages opened in the browser copy. When the “Make Page object a child of the browser process” project property is enabled, the Page objects become available as children of the master-process. The iexplore instances that correspond to tab-processes do not have the IEFrame object, but contain one or more Page objects as immediate children (no matter whether the “Make Page object a child of the browser process” property is enabled or not).

That is, the very same web page displayed in IE8 may have up to three duplicate Page objects that describe it – one belonging to a tab-process, and one or two (depending on “Make Page object a child of the browser process” project property) belonging to the master-process. These duplicates are equivalent and you can use whichever copy you like when you need to address the elements of the web page.

However, when you need to address the browser’s UI, dialogs, popup windows and other elements that do not belong to a web page, then you should refer to the appropriate iexplore process:

1. To simulate actions over the browser’s main window, you should refer to the master-process.
2. To simulate actions over the browser-related popup windows and dialogs (Information bar and the like), you also should refer to the master-process.
3. To simulate actions over the page-related popup windows and dialogs, you should refer to the tab-process.

Returning to the same example, if you launch two copies of IE8 and open 2 tabs in the first one and 3 tabs in the second one, then there would be several (minimum 4, maximum 7) instances of iexplore.exe, two instances of IEFrame object and at least 10 instances of Page objects. Now, this may sound scary, but don’t be afraid, it’s just the LCIE from Microsoft.

Two instances of iexplore.exe are master-processes that contain IEFrame objects. The first master-process hosts 2 Page objects, whereas the second one hosts 3 Page objects. The other iexplore copies are tab-processes; they contain another 5 instances of the Page object.

Using Tabbed Browsers in Web Testing

Now that you understand how the tab functionality and the hierarchy of browsers, we can move on to the code examples for web testing. The code samples are in JScript, but this can be implemented in any other scripting language supported by TestComplete.

To store information about a tabbed page we will use a custom TabbedPage object, which will hold references to a web page, to the browser instance that hosts the web page (for IE 8 both the master-process and the tab-process) and some other properties and methods. In JScript custom objects are created by special constructor functions.

The TabbedPage object constructor accepts two parameters – browserInstance and pageObj. The first one is a reference to a browser instance and can be either a window object (for Firefoxes), or a process object (for both Internet Explorer versions). For IE8 the browserInstance parameter should correspond to the master-process. The second one is a reference to a web page, the Page object. The object constructor code is as follows:

Getting master-processes and tab-processes of Internet Explorer 8

To differentiate between master-processes and tab-processes, the following criteria can be used:

1. The master-process has the IEFrame object as a child, whereas the tab-process does not.
2. The command line of the master-process does not contain arguments other than the parameters specified by you.
3. The command line of a tab-process always contains additional SCODEF and CREDAT arguments. For example, "C:\Program Files\Internet Explorer\iexplore.exe" SCODEF:2636 CREDAT:14348.
   The four-digit number after the SCODEF argument in the tab-process’s command-line is the Process Identifier (PID) of the parent master-process.

The following IE developer blog contains more information about this: http://blogs.msdn.com/askie/archive/2009/03/20/how-to-i-determine-which-ie-tabs-go-to-which-iexplore-exe-process-when-using-internet-explorer-8.aspx

The FindMasterProcesses routine returns an array of master-processes. It iterates through all iexplore processes and verifies whether they contain the IEFrame window.

The FindTabProcess routine searches for the process object that corresponds to a tab-process displaying the page, and returns this object as a routine result. The routine uses the FindChild method to find the copy of a desired page among the child tab-process of the given master-process.

Displaying information about the tabbed page

Navigating to another location

Activating the tabbed page

To simulate user actions over page controls, you need to activate the tab that contains the desired web page. Otherwise TestComplete won’t be able to interact with the controls because of another overlapping tab.

To activate a certain tab we need to perform a click over the corresponding tab button in the browser’s main window. The names of the tab buttons represent the titles of the web pages.

Closing the tabbed page

To close a tabbed page, you also need to interact with the tab buttons in the browser’s main window. Calling the Close() method for an object that represents a tab button, closes the related tab.

Now let me demonstrate how to perform the following typical tab-related tasks:

• Open a new tab.
• List all tabbed pages.
• Retrieve a tabbed page with the specified URL.
• Handle dialogs and notification messages.

Opening a new tabbed page

There are several ways to open a new tab from the browser’s user interface: select the respective command from the main menu, press Ctrl+T, press the “New Tab” button on the tab bar or simply double-click the tab bar. Any of these actions can easily be simulated from TestComplete.

The OpenNewTab function accepts a browserInstance as input parameter and on success returns the TabbedPage object that holds a newly opened tab. As mentioned above, the browserInstance is a reference to a browser copy and can be either a window object (for Firefoxes), or a process object (for Internet Explorers). For IE8 the browserInstance parameter should correspond to the master-process.

Listing pages opened in all tabs of all browser copies

The routines provided below iterate through all running browser instances and return an array of TabbedPage objects that contain data about every opened tabbed page. Since the object hierarchy differs for Firefox and Internet Explorer browsers, there are separate versions of the routine – GetFFTabs() and GetIETabs(). To list the pages opened in both of the browsers, we need to concatenate the resulting arrays.

Retrieving a tabbed page with the specified URL

Sometimes it may be convenient to check whether a browser displays a page with the specified URL, and get this tab on success. The routine below iterates through all running processes, finds Firefox and IE and searches for the Page object with the given URL. Once the page is found, the routine returns a TabbedPage object holding references to the found page and browser. If the page was not found, then the routine returns null.

Handling dialogs and notification messages

The code below demonstrates the specifics of handling dialogs and popup windows displayed in Internet Explorer 8. The routine searches for the notification message that appears in the Information bar when a page contains active content and permits the browser to use it. The routine works both for Internet Explorer 7 and for Internet Explorer 8.

//Enables the active content which is blocked by default 
function AllowBlockedContent(TabbedPageObj)
{
  var  InfoBar, ConfirmDlg;
  //Search for the Internet Explorer Information bar
  //(It always belongs to the master instance of IE)
  InfoBar=TabbedPageObj.browserInstance.FindChild("WndCaption","To help protect your security*",15,true);
  if (InfoBar.Exists)
    if (InfoBar.Visible) 
    {
    InfoBar.Click();
    InfoBar.PopupMenu.Click("Allow Blocked Content...");
    //Search for the confirmation dialog
    //(It belongs to the IE instance displaying the blocked page)
    if (TabbedPageObj.browserID=="IE8")
      // In IE8 it is child tab-process
      ConfirmDlg=TabbedPageObj.tabInstance.FindChild("WndCaption","Security Warning",15);
    else
      // In IE7 it is the same process instance 
      ConfirmDlg=TabbedPageObj.browserInstance.FindChild("WndCaption","Security Warning",15);
    ConfirmDlg.Window("Button", "&Yes").ClickButton();
    }
}

Demo

The code snippet below, demonstrates how to use all of the given methods and routines. Yuo can find this and the other routines in the supplied TestComplete project.

function TabsDemo()
{
var firefox, iexplore, Tab1, Tab2;  
  // Launch Internet Explorer browser
  iexplore = TestedApps.iexplore.Run(1, true);
  iexplore.ToUrl("http://smartbear.com/");
  // Search for the tab where the Smart Bear page was opened
  Tab1 = GetTabbedPage("http://smartbear.com/");
  // Display tab information
  Tab1.PostInfo();
  
  // Open empty tab in Internet Explorer 
  Tab2=OpenNewTab(iexplore);
  Tab2.PostInfo();
  // Navigate to another URL  
  Tab2.ToUrl("http://www.microsoft.com");
  Tab2.PostInfo();
  
  // Launch Firefox browser
  firefox = TestedApps.firefox.Run(1, true);
  // Open empty tab in Firefox
  Tab3=OpenNewTab(firefox.Window("MozillaUIWindowClass", "*", 1));
  Tab3.PostInfo();
  // Navigate to another URL  
  Tab3.ToUrl("http://www.automatedqa.com");
  Tab3.PostInfo(); 
  
  // Activate first tab
  Tab1.Activate();  
  // List tabs opened in all browsers
  ListAllTabs();  
  // Close first tab
  Tab1.Close();
}

Conclusion

Tabbed browsing is a lot more convenient for users, that is why all leading browsers implemented page tab technology. If you have tried the recent versions of Firefox or Internet Explorer, then you already know what page tabs are and have seen their advantages.

When creating automated web tests to be executed in these browsers, you should take into account the tab specifics. This article demonstrated how to work with page tabs in automated tests created with TestComplete. We hope this information will help you create reliable and flexible web tests. If you are interested in testing your site, server or web application with TestComplete, download and try it today.