Automatic Validation of Web pages With TestComplete 4
Most modern sites are very dynamic. They contain a lot of content, which is constantly updated. Of course, no one is perfect and Web developers may make mistakes while changing web pages. It is a good practice to validate the web pages markup and check the pages for broken links before publishing the site.
To perform these tasks, you can use various tools. For instance, you can use the tools mentioned in the Website Checklist article:
The W3C Markup Validation Service and WDG HTML Validator are used to validate the HTML code. The W3C CSS Validation Service is used to validate the CSS and Link Valet is used to check for broken links.
All of these tools are similar:
- You open a web page corresponding to the desired tool.
- On the page, specify the web site to be checked and initiate the process.
- After the check is over, you can save the results to a file and explore them to determine whether the check was successful.
You can easily check your web site for errors using the above-mentioned tools once or twice, but if you are going to check your site regularly, its better to automate this process. Below, we will create a TestComplete script that will use the above-mentioned tools for checking web pages.
Installing the Web Testing Plug-In
In order to check and validate web pages, we need the Web Testing plug-in to be installed in TestComplete. You can check whether the plug-in is installed in the Extensions dialog (click File | Install Extensions on TestCompletes main menu):
Fig. 1. The Extensions dialog.
If the plug-in is not listed in this dialog, please run TestCompletes installation program and install the plug-in.
Validating the HTML Markup
To validate your web pages markup, you can use the W3C Markup Validation Service. To use this service:
The service will analyze the specified page and generate a report. You can save this report to a file and examine it.
Note that you can use the http://validator.w3.org/detailed.html page rather than the http://validator.w3.org page. This page lets you specify extended validation settings such as encoding type and validating standards. In our example we use the http://validator.w3.org page.
To create a validation procedure:
- Launch Internet Explorer and open the following page: http://validator.w3.org/.
- Launch TestComplete.
- Create a new JScript project.
- Start recording in TestComplete.
- Switch to the Internet Explorer window containing the validator.
- Enter the address of the page you are going to test (for example, www.yourwebsite.com) into the Validate by URL | Address edit box that is displayed on the http://validator.w3.org page.
- Click Check.
- Wait until Internet Explorer displays the check results.
- Select File | Save As from Internet Explorers menu and save the result page to an .mht file (for instance, HTML_Result.mht).
- Stop recording in TestComplete.
After recording you get the following script:
The procedure code can be divided into three parts:
- Obtaining Internet Explorer objects (the Internet Explorer process, IEFrame window, Internet Explorer_Server window).
- Performing user actions within the Markup Validation Service Web page.
- Saving results.
In this connection, its better to organize the recorded script into three routines that will correspond to these tasks.
One of the procedures will simulate user actions within the validator web page:
Another procedure will save the page displaying checked results to a file:
The third procedure is the main procedure. It will perform initialization actions and call two other routines:
You can download the sample TestComplete project containing this code from here.
Validating CSS and Checking for Broken Links
Validating CSS and checking for broken links is similar to validating web page markup. The main difference is that you should open another web page (the web page of the desired validator). Also, you have to use specific methods and properties for simulating user actions over the validator page, since different validators have different settings.
You can download the TestComplete project that contains routines for validating CSS and checking for broken links from here.