Thursday, March 27, 2014

SELENIUM GRID


Grid allows you to 

  • scale by distributing tests on several machines ( parallel execution )
  • manage multiple environments from a central point, making it easy to run the tests against a vast combination of browsers / OS.
  • minimize the maintenance time for the grid by allowing you to implement custom hooks to leverage virtual infrastructure for instance.
This example will show you how to start the Selenium 2 Hub, and register both a WebDriver node and a Selenium 1 RC legacy node. We’ll also show you how to call the grid from Java. The hub and nodes are shown here running on the same machine, but of course you can copy the selenium-server-standalone to multiple machines.
Step 1: Start the hub
The Hub is the central point that will receive all the test request and distribute them the the right nodes.
Open a command prompt and navigate to the directory where you copied the selenium-server-standalone file. Type the following command:
java -jar selenium-server-standalone-2.14.0.jar -role hub
The hub will automatically start-up using port 4444 by default. To change the default port, you can add the optional parameter -port when you run the command. You can view the status of the hub by opening a browser window and navigating to:
Step 2: Start the nodes
Regardless on whether you want to run a grid with new WebDriver functionality, or a grid with Selenium 1 RC functionality, or both at the same time, you use the same selenium-server-standalone jar file to start the nodes.
java -jar selenium-server-standalone-2.14.0.jar -role node  -hub http://localhost:4444/grid/register
Note: The port defaults to 5555 if not specified whenever the "-role" option is provided and is not hub.
For backwards compatibility "wd" and "rc" roles are still a valid subset of the "node" role. But those roles limit the types of remote connections to their corresponding API, while "node" allows both RC and WebDriver remote connections.

Using grid to run tests

( using java as an example ) Now that the grid is in-place, we need to access the grid from our test cases. For the Selenium 1 RC nodes, you can continue to use the DefaultSelenium object and pass in the hub information:
Selenium selenium = new DefaultSelenium(“localhost”, 4444, “*firefox”, http://www.google.com”);
For WebDriver nodes, you will need to use the RemoteWebDriver and the DesiredCapabilities object to define which browser, version and platform you wish to use. Create the target browser capabilities you want to run the tests against:
DesiredCapabilities capability = DesiredCapabilities.firefox();
Pass that into the RemoteWebDriver object:
WebDriver driver = new RemoteWebDriver(new URL("http://localhost:4444/wd/hub"), capability);
The hub will then assign the test to a matching node.
A node matches if all the requested capabilities are met. To request specific capabilities on the grid, specify them before passing it into the WebDriver object.
capability.setBrowserName();
capability.setPlatform();
capability.setVersion()
capability.setCapability(,);
Example: A node registered with the setting:
 -browser  browserName=firefox,version=3.6,platform=LINUX
will be a match for:
capability.setBrowserName(“firefox ); 
capability.setPlatform(“LINUX”);  
capability.setVersion(“3.6”);
and would also be a match for
capability.setBrowserName(“firefox ); 
capability.setVersion(“3.6”);
The capabilities that are not specified will be ignored. If you specify capabilities that do not exist on your grid (for example, your test specifies Firefox version 4.0, but have no Firefox 4 instance) then there will be no match and the test will fail to run.

Configuring the nodes

The node can be configured in 2 different ways; one is by specifying command line parameters, the other is by specifying a json file.

Configuring the nodes by command line

By default, this starts 11 browsers : 5 Firefox, 5 Chrome, 1 Internet Explorer. The maximum number of concurrent tests is set to 5 by default. To change this and other browser settings, you can pass in parameters to each -browser switch (each switch represents a node based on your parameters). If you use the -browser parameter, the default browsers will be ignored and only what you specify command line will be used.
-browser browserName=firefox,version=3.6,maxInstances=5,platform=LINUX
This setting starts 5 Firefox 3.6 nodes on a linux machine.
If your remote machine has multiple versions of Firefox you’d like to use, you can map the location of each binary to a particular version on the same machine:
-browser browserName=firefox,version=3.6,firefox_binary=/home/myhomedir/firefox36/firefox,maxInstances=3,platform=LINUX -browser browserName=firefox,version=4,firefox_binary=/home/myhomedir/firefox4/firefox,maxInstances=4,platform=LINUX
Tip: If you need to provide a space somewhere in your browser parameters, then surround the parameters with quotation marks:
-browser browserName=firefox,version=3.6,firefox_binary=c:\Program Files\firefox ,maxInstances=3, platform=WINDOWS

Optional parameters

  • -port 4444 (4444 is default)
  • -timeout 30 (30 is default) The timeout in seconds before the hub automatically releases a node that hasn't received any requests for more than the specified number of seconds. After this time, the node will be released for another test in the queue. This helps to clear client crashes without manual intervention. To remove the timeout completely, specify -timeout 0 and the hub will never release the node.
Note: This is NOT the WebDriver timeout for all ”wait for WebElement” type of commands.
  • -maxSession 5 (5 is default) The maximum number of browsers that can run in parallel on the node. This is different from the maxInstance of supported browsers (Example: For a node that supports Firefox 3.6, Firefox 4.0  and Internet Explorer 8, maxSession=1 will ensure that you never have more than 1 browser running. With maxSession=2 you can have 2 Firefox tests at the same time, or 1 Internet Explorer and 1 Firefox test).
  • -browser < params > If -browser is not set, a node will start with 5 firefox, 1 chrome, and 1 internet explorer instance (assuming it’s on a windows box). This parameter can be set multiple times on the same line to define multiple types of browsers.
Parameters allowed for -browser: browserName={android, chrome, firefox, htmlunit, internet explorer, iphone, opera} version={browser version} firefox_binary={path to executable binary} chrome_binary={path to executable binary} maxInstances={maximum number of browsers of this type} platform={WINDOWS, LINUX, MAC}
  • -registerCycle = how often in ms the node will try to register itself again.Allow to restart the hub without having to restart the nodes.
  • Relly large (>50 node) Hub installations may need to increase the jetty threads by setting -DPOOL_MAX=512 (or larger) on the java command line.

Configuring timeouts (Version 2.21 required)

Timeouts in the grid should normally be handled through webDriver.manage().timeouts(), which will control how the different operations time out.
To preserve run-time integrity of a grid with selenium-servers, there are two other timeout values that can be set.
On the hub, setting the -timeout command line option to "30" seconds will ensure all resources are reclaimed 30 seconds after a client crashes. On the hub you can also set -browserTimeout 60 to make the maximum time a node is willing to hang inside the browser 60 seconds. This will ensure all resources are reclaimed slightly after 60 seconds. All the nodes use these two values from the hub if they are set. Locally set parameters on a single node has precedence, it is generally recommended not to set these timeouts on the node.
The browserTimeout should be:
  • Higher than the socket lock timeout (45 seconds)
  • Generally higher than values used in webDriver.manage().timeouts(), since this mechanism is a "last line of defense".

Configuring the nodes by JSON

java -jar selenium-server-standalone.jar -role node -nodeConfig nodeconfig.json
A sample nodeconfig file can be seen athttps://code.google.com/p/selenium/source/browse/java/server/src/org/openqa/grid/common/defaults/DefaultNode.json

Configuring the hub by JSON


Hub diagnostic messages

Upon detecting anomalious usage patterns, the hub can give the following message:
Client requested session XYZ that was terminated due to REASON
ReasonCause/fix
TIMEOUTThe session timed out because the client did not access it within the timeout. If the client has been somehow suspended, this may happen when it wakes up
BROWSER_TIMEOUTThe node timed out the browser because it was hanging for too long (parameter browserTimeout)
ORPHANA client waiting in queue has given up once it was offered a new session
CLIENT_STOPPED_SESSIONThe session was stopped using an ordinary call to stop/quit on the client. Why are you using it again??
CLIENT_GONEThe client process (your code) appears to have died or otherwise not responded to our requests, intermittent network issues may also cause
FORWARDING_TO_NODE_FAILEDThe hub was unable to forward to the node. Out of memory errors/node stability issues or network problems
CREATIONFAILEDThe node failed to create the browser. This can typically happen when there are environmental/configuration problems on the node. Try using the node directly to track problem.
PROXY_REREGISTRATIONThe session has been discarded because the node has re-registered on the grid (in mid-test)

Wednesday, March 26, 2014

Selenium Help for Handling Advanced Scripts

Selenium Help for Handling Advanced Scripts


Pause Command:

Thread.Sleep(60000);

(60000 is the time to wait for in milliseconds.)
=============================
Popup Handling:



selenium.WindowFocus();
selenium.WaitForFrameToLoad("aspForm", "10000");


//place this code in place of code:

selenium.SelectFrame("sb-player");

===================================

Order id Store and Use Command:



string ProPrice = "";
string PID = "";
string OrderID = "";
OrderID = selenium.GetEval("this.browserbot.getUserWindow().ya_tid");
PID = selenium.GetEval("this.browserbot.getUserWindow().ya_pid");
ProPrice=selenium.GetEval("this.browserbot.getCurrentWindow().ya_dv");
Assert.IsTrue(selenium.IsTextPresent(OrderID));


=========================================

To open Advanced script in IE:

replace "*chrome" by "*iexplore" in

selenium = new DefaultSelenium("localhost", 4444, "*chrome", "http://ecp.fd2009.dev.fdwork.com/");


To maximize browser automatically:



selenium.Open("/");
selenium.WindowMaximize();


=================================
Random No. generation code:



Random ra = new Random();
int iRandom = ra.Next();
string sScheduleName = "test" + iRandom;


in place of parameter name , use "sScheduleName"

i.e.
selenium.Type("ctl00_ContentPlaceHolderBody_txtScheduleName", "test");

will be changed to


selenium.Type("ctl00_ContentPlaceHolderBody_txtScheduleName", sScheduleName);


e.g-2:

selenium.Click("link=test");

will be changed to

selenium.Click("link=" + sScheduleName);

e.g-3:

selenium.Type("ctl00_ContentPlaceHolderBody_txtAddListName", "rough");

will be changed to


string sNewList = "New_List" + iRandom;
selenium.Type("ctl00_ContentPlaceHolderBody_txtAddListName", sNewList);



e.g-4

selenium.Type("ctl00_ContentPlaceHolderBody_txtNewList", "shweta");

will be changed to

string sMergeList = "Merge_List" + iRandom;
selenium.Type("ctl00_ContentPlaceHolderBody_txtNewList", sMergeList);


Executing a block of code for n no of times:


int i;
for (i = 1; i < 3; i++)
{
//selenium.Click("//table[@id='ctl00_ContentPlaceHolderBody_gvWebsite']/tbody/tr[17]/td[11]/a");
selenium.Click("//table[@id='ctl00_ContentPlaceHolderBody_gvWebsite']/tbody/tr['" + i + "'+1]/td[11]/a");
// the value of 17 is changed to ('" + i + "'+1), Note the use of single quotes, double quotes and +1.
}

===============================================================

Executing a block of code if a condition is satisfied and exit the loop if condition is false:


{
if (!Convert.ToBoolean(selenium.IsTextPresent("Preview"))) //if the condition will true then it will exit the loop, else will continue the rest code in the loop
{
continue;
}
//rest code
-----
-----
}

===============================================================

Selenium RC

SELENIUM 1 (SELENIUM RC)
(http://seleniumhq.org/docs/05_selenium_rc.html)

Introduction
As you can read in Brief History of The Selenium Project, Selenium RC was the main Selenium project for a long time, before the WebDriver/Selenium merge brought up Selenium 2, the newest and more powerful tool.
Selenium 1 is still actively supported (mostly in maintenance mode) and provides some features that may not be available in Selenium 2 for a while, including support for several languages (Java, Javascript, PRuby, HP, Python, Perl and C#) and support for almost every browser out there.


How Selenium RC Works
First, we will describe how the components of Selenium RC operate and the role each plays in running your test scripts.

RC Components
Selenium RC components are:
The Selenium Server which launches and kills browsers, interprets and runs the Selenese commands passed from the test program, and acts as an HTTP proxy, intercepting and verifying HTTP messages passed between the browser and the AUT.
Client libraries which provide the interface between each programming language and the Selenium RC Server.
Here is a simplified architecture diagram....
for execution. Then the server passes the Selenium command to the browser using Selenium-Core JavaScript commands. The browser, using its JavaScript interpreter, executes the Selenium command. This runs the Selenese action or verification you specified in your test script.

Selenium Server
Selenium Server receives Selenium commands from your test program, interprets them, and reports back to your program the results of running those tests. The RC server bundles Selenium Core and automatically injects it into the browser. This occurs when
your test program opens the browser (using a client library API function). Selenium-Core is a JavaScript program, actually a set of JavaScript functions which interprets and executes Selenese commands using the browser’s built-in JavaScript interpreter.
The Server receives the Selenese commands from your test program using simple HTTP GET/POST requests. This means you can use any programming language that can send HTTP requests to automate Selenium tests on the browser.

Client Libraries
The client libraries provide the programming support that allows you to run Selenium commands from a program of your own design. There is a different client library for each supported language. A Selenium client library provides a programming interface (API), i.e., a set of functions, which run Selenium commands from your own program. Within each interface, there is a programming function that supports each Selenese command.
The client library takes a Selenese command and passes it to the Selenium Server for processing a specific action or test against the application under test (AUT). The client library also receives the result of that command and passes it back to your program. Your program can receive the result and store it into a program variable and report it as a success or failure, or possibly take corrective action if it was an unexpected error.
So to create a test program, you simply write a program that runs a set of Selenium commands using a client library API. And, optionally, if you already have a Selenese test script created in the Selenium- IDE, you can generate the Selenium RC code. The Selenium-IDE can translate (using its Export menu item) its Selenium commands into a client-driver’s API function calls. See the Selenium-IDE chapter for specifics on exporting RC code from Selenium-IDE.


Installation
After downloading the Selenium RC zip file from the downloads page, you’ll notice it has several subfolders. These folders have all the components you need for using Selenium RC with the programming language of your choice. Once you’ve chosen a language to work with, you simply need to:
Install the Selenium RC Server.
Set up a programming project using a language specific client driver.

 Installing Selenium Server
The Selenium RC server is simply a Java jar file (selenium-server.jar), which doesn’t require any special installation. Just downloading the zip file and extracting the server in the desired directory is sufficient.

Running Selenium Server
Before starting any tests you must start the server. Go to the directory where Selenium RC’s server is located and run the following from a command-line console.
java -jar selenium-server.jar
This can be simplified by creating a batch or shell executable file (.bat on Windows and .sh on Linux) containing the command above. Then make a shortcut to that executable on your desktop and simply double-click the icon to start the server. For the server to run you’ll need Java installed and the PATH environment variable correctly configured
to run it from the console. You can check that you have Java correctly installed by running the following on a console:
java -version
If you get a version number (which needs to be 1.5 or later), you’re ready to start using Selenium RC.

Using the .NET Client Driver
Download Selenium RC from the SeleniumHQ downloads page
Extract the folder
Download and install NUnit ( Note: You can use NUnit as your test engine. If you’re not familiar yet with NUnit, you can also write a simple main() function to run your tests; however NUnit is very useful as a test engine.)
Open your desired .Net IDE (Visual Studio, SharpDevelop, MonoDevelop)
Create a class library (.dll)
Add references to the following DLLs: nmock.dll, nunit.core.dll, nunit. framework.dll,
ThoughtWorks.Selenium.Core.dll, ThoughtWorks.Selenium.IntegrationTests.dll and Thought-Works.Selenium.UnitTests.dll
Write your Selenium test in a .Net language (C#, VB.Net), or export a script from Selenium-IDE to a C# file and copy this code into the class file you just created.
Write your own simple main() program or you can include NUnit in your project for running your test. These concepts are explained later in this chapter.
Run Selenium server from console
Run your test either from the IDE, from the NUnit GUI or from the command line
For specific details on .NET client driver configuration with Visual Studio, see the appendix .NET client driver configuration.

Selenese as Programming Code
Here is the test script exported (via Selenium-IDE) to each of the supported programming languages. If you have at least basic knowledge of an object- oriented programming language, you will understand how Selenium runs Selenese commands by reading one of these examples. To see an example in a specific language, select one of these buttons.
In C#:
using System;
using System.Text;
using System.Text.RegularExpressions;
using System.Threading;
using NUnit.Framework;
using Selenium;
namespace SeleniumTests
{
[TestFixture]
public class NewTest
{
private ISelenium selenium;
private StringBuilder verificationErrors;
[SetUp]
public void SetupTest()
{
selenium = new DefaultSelenium( "localhost" , 4444, "*firefox" , "http://www.selenium.Start();
verificationErrors = new StringBuilder();
}
[TearDown]
public void TeardownTest()
{
try
{
selenium.Stop();
}
catch (Exception)
{
// Ignore errors if unable to close the browser
}
Assert.AreEqual( "" , verificationErrors.ToString());
}
[Test]
public void TheNewTest()
{
selenium.Open( "/" );
selenium.Type( "q" , "selenium rc" );
selenium.Click( "btnG" );
selenium.WaitForPageToLoad( "30000" );
Assert.AreEqual( "selenium rc - Google Search" , selenium.GetTitle());
}
}
}

Programming Your Test
Now we’ll illustrate how to program your own tests using examples in programming language. There are essentially two tasks:
Generate your script into a programming language from Selenium-IDE, optionally modifying the result.
Write a very simple main program that executes the generated code. Optionally, you can adopt a test engine platform NUnit for .NET.

C#
The .NET Client Driver works with Microsoft.NET. It can be used with any .NET testing framework
like NUnit or the Visual Studio 2005 Team System.
Selenium-IDE assumes you will use NUnit as your testing framework. You can see this in the generated
code below. It includes the using statement for NUnit along with corresponding NUnit attributes
identifying the role for each member function of the test class.
You will probably have to rename the test class from “NewTest” to something of your own choosing.
Also, you will need to change the browser-open parameters in the statement:
selenium = new DefaultSelenium("localhost", 4444, "*iehta", "http://www.google.com/");
The generated code will look similar to this.
using System;
using System.Text;
using System.Text.RegularExpressions;
using System.Threading;
using NUnit.Framework;
using Selenium;
namespace SeleniumTests
{
[TestFixture]
public class NewTest
{
private ISelenium selenium;
private StringBuilder verificationErrors;
[SetUp]
public void SetupTest()
{
selenium = new DefaultSelenium( "localhost" , 4444, "*iehta" ,
"http://www.google.com/" );
selenium.Start();
verificationErrors = new StringBuilder();
}
[TearDown]
public void TeardownTest()
{
try
{
selenium.Stop();
}
catch (Exception)
{
// Ignore errors if unable to close the browser
}
Assert.AreEqual( "" , verificationErrors.ToString());
}
[Test]
public void TheNewTest()
{
// Open Google search engine.
selenium.Open( "http://www.google.com/" );
// Assert Title of page.
Assert.AreEqual( "Google" , selenium.GetTitle());
// Provide search term as "Selenium OpenQA"
selenium.Type( "q" , "Selenium OpenQA" );
// Read the keyed search term and assert it.
Assert.AreEqual( "Selenium OpenQA" , selenium.GetValue( "q" ));
// Click on Search button.
selenium.Click( "btnG" );
// Wait for page to load.
selenium.WaitForPageToLoad( "5000" );
// Assert that "www.openqa.org" is available in search results.
Assert.IsTrue(selenium.IsTextPresent( "www.openqa.org" ));
// Assert that page title is - "Selenium OpenQA - Google Search"
Assert.AreEqual( "Selenium OpenQA - Google Search" ,
selenium.GetTitle());
}
}
}
You can allow NUnit to manage the execution of your tests. Or alternatively, you can write a simple main() program that instantiates the test object and runs each of the three methods, SetupTest(), The- NewTest(), and TeardownTest() in turn.

Learning the API
The Selenium RC API uses naming conventions that, assuming you understand Selenese, much of the interface will be self-explanatory. Here, however, we explain the most critical and possibly less obvious aspects.

Starting the Browser
In C#:
selenium = new DefaultSelenium( "localhost" , 4444, "*firefox" , "http://www.google.com/" selenium.Start();

This example opens the browser and represents that browser by assigning a “browser instance” to a program variable. This program variable is then used to call methods from the browser. These methods execute the Selenium commands, i.e. like open or type or the verify commands. The parameters required when creating the browser instance are:
host Specifies the IP address of the computer where the server is located. Usually, this is the same machine as where the client is running, so in this case localhost is passed. In some clients this is an optional parameter.

port Specifies the TCP/IP socket where the server is listening waiting for the client to establish a connection. This also is optional in some client drivers.

browser The browser in which you want to run the tests. This is a required parameter.

url The base url of the application under test. This is required by all the client libs and is integral information for starting up the browser-proxy-AUT communication.

Note that some of the client libraries require the browser to be started explicitly by calling its start() method.



Selenium IDE

Selenium IDE

Selenium IDE is an integrated development environment for Selenium tests. It is implemented as a Firefox extension simply we can say like selenium via FF plugin and allows you to record, edit, and debug tests. Selenium IDE includes the entire Selenium Core, allowing you to easily and quickly record and play back tests in the actual environment that they will run. Selenium IDE is the easiest way to use Selenium and most of the time it also serves as a starting point for your automation. As compared to most of the test automation tools it is very simple and lightweight.


Advantages: Selenium IDE is the only flavor of Selenium, which allows you to record user action on browser window. It can also record user actions in most of the popular languages like Java, C#, Perl, Ruby etc. This eliminates the need of learning new vendor scripting language. For executing scripts created in these languages, you will need to use Selenium Remote Control. If you do not want to use Remote Control than you will need to create your test scripts in HTML format.


Disadvantages: Biggest drawback of Selenium IDE is its limitation in terms of browser support. Though Selenium scripts can be used for most of the browser and operating system, Scripts written using Selenium IDE can be used for only Firefox browser if it is not used with Selenium RC or Selenium Core.

Features:

1. Easy record and playback.
2. Intelligent field selection will use IDs, names, or XPath as needed.
3. Autocomplete for all common Selenium commands.
4. Walk through tests.
5. Debug and set breakpoints.
6. Save tests as HTML, Ruby scripts, or any other format.
7. Support for Selenium user-extensions.js file.
8. Option to automatically assert the title of every page.

Advantages of Selenium:

1. It is an Open source
2. Simple, Easy to learn, install, Easy to work
3. Selenium IDE is the only flavor of Selenium which allows you to record user action on browser window
4. Can also record user actions in most of the popular languages like Java, C#, Perl, Ruby
5. It will not record any operation that you do on your computer apart from the events on Firefox browser window.
6. During recording if you right click on any element it will show all the selenium commands available
7. We can also edit existing command, by selecting it and editing on the boxes available
8. We can also insert/delete commands by choosing appropriate option after right clicking Choose appropriate run option – i.e walk, run or test runner and review your results
9.You can convert my script to html,java,perl ....and more .To convert into your favourite language , use Options->Format->"favourite language" in Selenium IDE

Disadvantages of Selenium:

1. Limitation in terms of browser support (It runs only in Firefox).Scripts written using Selenium IDE can be used for other browsers only if it is used with Selenium RC or Selenium Core.
2. We can’t run recorded script if it is converted to Java, C#, Ruby etc.
3. Not allowed to write manual scripts like conditions and Loops for Data Driven Testing
4. There is no option to verify images.


Selenium commands come in three “flavors”:

Actions are commands that generally manipulate the state of the application. They do things like “click this link” and “select that option”. If an Action fails, or has an error, the execution of the current test is stopped.
Many Actions can be called with the “AndWait” suffix, e.g. “clickAndWait”. This suffix tells
Selenium that the action will cause the browser to make a call to the server, and that Selenium should wait for a new page to load.

Accessors examine the state of the application and store the results in variables, e.g. “storeTitle”. They are also used to automatically generate Assertions.

Assertions are like Accessors, but they verify that the state of the application conforms to what is expected. Examples include “make sure the page title is X” and “verify that this checkbox is checked”. All Selenium Assertions can be used in 3 modes: “assert”, “verify”, and ” waitFor”.
For example, you can “assertText”, “verifyText” and “waitForText”. When an “assert” fails, the test is aborted. When a “verify” fails, the test will continue execution, logging the failure. This allows a single “assert” to ensure that the application is on the correct page, followed by a bunch of “verify” assertions to test form field values, labels, etc.






Commonly Used Selenium Commands:

To conclude our introduction of Selenium, we’ll show you a few typical Selenium commands. These are probably the most commonly used commands for building tests.

open opens a page using a URL.
click/clickAndWait performs a click operation, and optionally waits for a new page to load.
verifyTitle/assertTitle verifies an expected page title.
verifyTextPresent verifies expected text is somewhere on the page.
verifyElementPresent verifies an expected UI element, as defined by its HTML tag, is present on the page.
verifyText verifies expected text and it’s corresponding HTML tag are present on the page.
verifyTable verifies a table’s expected contents.
waitForPageToLoad pauses execution until an expected new page loads. Called automatically when clickAndWait is used.
waitForElementPresent pauses execution until an expected UI element, as defined by its HTML tag, is present on the page.