Working With Text Edit Controls in Web Applications

Applies to TestComplete 15.40, last modified on July 05, 2022

In web applications, TestComplete recognizes text edit controls implemented with <input> elements of the text, password, number, and url types as text box objects. It can also recognize text box controls implemented with third-party libraries and frameworks. In your tests, you can work with these elements using methods and properties of the text box object. In addition, you can access native attributes, properties, and methods of the underlying web element.

Getting text

To get the text that an edit control contains, you can use the Text property of the text box object that TestComplete assigns to the control.

In keyword tests

To get the edit control’s text and compare it against an expected string value, you can use property checkpoints. For detailed information, see Creating Property Checkpoints.

To get the control’s text and store it to a variable for later use, you can use the Set Variable Value operation. For example:

  1. Create a variable that will store the text that the edit control contains. It can be either a keyword variable or a project or project suite variable. See Using Variables.

  2. In your keyword test, add the Set Variable Value operation. TestComplete will open the Operation Parameter wizard.

  3. On the first page of the wizard, select the created variable.

  4. On the next page of the wizard, in the Mode drop-down list, select Object Property, and then click the ellipsis button in the Value edit box.

  5. In the resulting dialog, click Onscreen Object and then point to the text edit control on the web page.

  6. On the next page of the wizard, select the Text property.

  7. Click Finish to complete adding the operation.

Getting text from an edit control

Click the image to enlarge it.

When you run the test, it will get the text that the edit control contains and save it to a variable.

In script tests

To get the control’s text, use the WebTestBoxObj.Text property. For example, the sample script below shows how to get the text and post it to the test log:

Web (Cross-Platform)

JavaScript, JScript

function Sample_Get_Text()
{
  var url = "https://services.smartbear.com/samples/TestComplete15/smartstore";
  Browsers.Item(btChrome).Run(url);

  var txt_edit = Sys.Browser().Page(url).FindElement("#instasearch");

  // Enter "ball" in the Search text box
  txt_edit.SetText("ball");

  // Post the text that the Search text box contains to the test log
  Log.Message(txt_edit.Text);

}

Python

def Sample_Get_Text():
  url = "https://services.smartbear.com/samples/TestComplete15/smartstore"
  Browsers.Item[btChrome].Run(url)

  txt_edit = Sys.Browser().Page(url).FindElement("#instasearch")

  # Enter "ball" in the Search text box
  txt_edit.SetText("ball")

  # Post the text that the Search text box contains to the test log
  Log.Message(txt_edit.Text)

VBScript

Sub Sample_Get_Text()
  url = "https://services.smartbear.com/samples/TestComplete15/smartstore"
  Browsers.Item(btChrome).Run(url)

  Set txt_edit = Sys.Browser().Page(url).FindElement("#instasearch")

  ' Enter "ball" in the Search text box
  txt_edit.SetText("ball")

  ' Post the text that the Search text box contains to the test log
  Log.Message(txt_edit.Text)

End Sub

DelphiScript

procedure Sample_Get_Text();
var url, txt_edit;
begin
  url := 'https://services.smartbear.com/samples/TestComplete15/smartstore';
  Browsers.Item(btChrome).Run(url);

  txt_edit := Sys.Browser().Page(url).FindElement('#instasearch');

  // Enter "ball" in the Search text box
  txt_edit.SetText('ball');

  // Post the text that the Search text box contains to the test log
  Log.Message(txt_edit.Text);

end;

C++Script, C#Script

function Sample_Get_Text()
{
  var url = "https://services.smartbear.com/samples/TestComplete15/smartstore";
  Browsers["Item"](btChrome)["Run"](url);

  var txt_edit = Sys["Browser"]()["Page"](url)["FindElement"]("#instasearch");

  // Enter "ball" in the Search text box
  txt_edit["SetText"]("ball");

  // Post the text that the Search text box contains to the test log
  Log["Message"](txt_edit["Text"]);

}

Web (Classic)

JavaScript, JScript

function Sample_Get_Text()
{
  var url = "https://services.smartbear.com/samples/TestComplete15/smartstore";
  Browsers.Item(btChrome).Run(url);

  var propNames = new Array("ObjectType", "ObjectIdentifier");
  var propValues = new Array("textbox", "instasearch");
  var txt_edit = Sys.Browser().Page(url).FindChildEx(propNames, propValues, 15, true);

  // Enter "ball" in the Search text box
  txt_edit.SetText("ball");

  // Post the text that the Search text box contains to the test log
  Log.Message(txt_edit.Text);

}

Python

def Sample_Get_Text():
  url = "https://services.smartbear.com/samples/TestComplete15/smartstore"
  Browsers.Item[btChrome].Run(url)

  propNames = ["ObjectType", "ObjectIdentifier"]
  propValues = ["textbox", "instasearch"]
  txt_edit = Sys.Browser().Page(url).FindChildEx(propNames, propValues, 15, True)

  # Enter "ball" in the Search text box
  txt_edit.SetText("ball")

  # Post the text that the Search text box contains to the test log
  Log.Message(txt_edit.Text)

VBScript

Sub Sample_Get_Text()
  url = "https://services.smartbear.com/samples/TestComplete15/smartstore"
  Browsers.Item(btChrome).Run(url)

  propNames = Array("ObjectType", "ObjectIdentifier")
  propValues = Array("textbox", "instasearch")
  Set txt_edit = Sys.Browser().Page(url).FindChildEx(propNames, propValues, 15, True)

  ' Enter "ball" in the Search text box
  txt_edit.SetText("ball")

  ' Post the text that the Search text box contains to the test log
  Log.Message(txt_edit.Text)

End Sub

DelphiScript

procedure Sample_Get_Text();
var url, propNames, propValues, txt_edit;
begin
  url := 'https://services.smartbear.com/samples/TestComplete15/smartstore';
  Browsers.Item(btChrome).Run(url);

  propNames := ['ObjectType', 'ObjectIdentifier'];
  propValues := ['textbox', 'instasearch'];
  txt_edit := Sys.Browser().Page(url).FindChildEx(propNames, propValues, 15, true);

  // Enter "ball" in the Search text box
  txt_edit.SetText('ball');

  // Post the text that the Search text box contains to the test log
  Log.Message(txt_edit.Text);

end;

C++Script, C#Script

function Sample_Get_Text()
{
  var url = "https://services.smartbear.com/samples/TestComplete15/smartstore";
  Browsers["Item"](btChrome)["Run"](url);

  var propNames = new Array("ObjectType", "ObjectIdentifier");
  var propValues = new Array("textbox", "instasearch");
  var txt_edit = Sys["Browser"]()["Page"](url)["FindChildEx"](propNames, propValues, 15, true);

  // Enter "ball" in the Search text box
  txt_edit["SetText"]("ball");

  // Post the text that the Search text box contains to the test log
  Log["Message"](txt_edit["Text"]);

}

Entering text

There are several ways you can simulate entering text into the web text edit controls:

  • By using the SetText method or by modifying the Text property of the text box control.

  • By “typing” text with the Keys method.

In keyword tests

To simulate entering text, you can use the On-Screen Action operation. For example:

  1. Add the On-Screen Action operation to your test. TestComplete will open the Operation Parameters wizard.

  2. Point to the text edit control into which you want to enter the text.

  3. On the next page of the wizard, select the method you want to use. It can be the SetText, Keys, or Text [Set] method.

  4. On the next page of the wizard, specify the text to enter in the web text edit control.

  5. Click Finish to complete adding the operation.

Entering text in a text edit

Click the image to enlarge it.

When you run the test, it will simulate entering the specified text.

In script test

To simulate entering text, use the SetText or Keys method. For example, the code snippet below shows how to use the SetText method:

Web (Cross-Platform)

JavaScript, JScript

function Sample_Set_Text()
{
  var url = "https://services.smartbear.com/samples/TestComplete15/smartstore";
  Browsers.Item(btChrome).Run(url);

  var txt_edit = Sys.Browser().Page(url).FindElement("#instasearch");

  // Enter "ball" in the Search text box
  txt_edit.SetText("ball");

}

Python

def Sample_Set_Text():
  url = "https://services.smartbear.com/samples/TestComplete15/smartstore"
  Browsers.Item[btChrome].Run(url)

  txt_edit = Sys.Browser().Page(url).FindElement("#instasearch")

  # Enter "ball" in the Search text box
  txt_edit.SetText("ball")

VBScript

Sub Sample_Set_Text()
  url = "https://services.smartbear.com/samples/TestComplete15/smartstore"
  Browsers.Item(btChrome).Run(url)

  Set txt_edit = Sys.Browser().Page(url).FindElement("#instasearch")

  ' Enter "ball" in the Search text box
  txt_edit.SetText("ball")

End Sub

DelphiScript

procedure Sample_Set_Text();
var url, txt_edit;
begin
  url := 'https://services.smartbear.com/samples/TestComplete15/smartstore';
  Browsers.Item(btChrome).Run(url);

  txt_edit := Sys.Browser().Page(url).FindElement('#instasearch');

  // Enter "ball" in the Search text box
  txt_edit.SetText('ball');

end;

C++Script, C#Script

function Sample_Set_Text()
{
  var url = "https://services.smartbear.com/samples/TestComplete15/smartstore";
  Browsers["Item"](btChrome)["Run"](url);

  var txt_edit = Sys["Browser"]()["Page"](url)["FindElement"]("#instasearch");

  // Enter "ball" in the Search text box
  txt_edit["SetText"]("ball");

}

Web (Classic)

JavaScript, JScript

function Sample_Set_Text()
{
  var url = "https://services.smartbear.com/samples/TestComplete15/smartstore";
  Browsers.Item(btChrome).Run(url);

  var propNames = new Array("ObjectType", "ObjectIdentifier");
  var propValues = new Array("textbox", "instasearch");
  var txt_edit = Sys.Browser().Page(url).FindChildEx(propNames, propValues, 15, true);

  // Enter "ball" in the Search text box
  txt_edit.SetText("ball");

}

Python

def Sample_Set_Text():
  url = "https://services.smartbear.com/samples/TestComplete15/smartstore"
  Browsers.Item[btChrome].Run(url)

  propNames = ["ObjectType", "ObjectIdentifier"]
  propValues = ["textbox", "instasearch"]
  txt_edit = Sys.Browser().Page(url).FindChildEx(propNames, propValues, 15, True)

  # Enter "ball" in the Search text box
  txt_edit.SetText("ball")

VBScript

Sub Sample_Set_Text()
  url = "https://services.smartbear.com/samples/TestComplete15/smartstore"
  Browsers.Item(btChrome).Run(url)

  propNames = Array("ObjectType", "ObjectIdentifier")
  propValues = Array("textbox", "instasearch")
  Set txt_edit = Sys.Browser().Page(url).FindChildEx(propNames, propValues, 15, True)

  ' Enter "ball" in the Search text box
  txt_edit.SetText("ball")

End Sub

DelphiScript

procedure Sample_Set_Text();
var url, propNames, propValues, txt_edit;
begin
  url := 'https://services.smartbear.com/samples/TestComplete15/smartstore';
  Browsers.Item(btChrome).Run(url);

  propNames := ['ObjectType', 'ObjectIdentifier'];
  propValues := ['textbox', 'instasearch'];
  txt_edit := Sys.Browser().Page(url).FindChildEx(propNames, propValues, 15, true);

  // Enter "ball" in the Search text box
  txt_edit.SetText('ball');

end;

C++Script, C#Script

function Sample_Set_Text()
{
  var url = "https://services.smartbear.com/samples/TestComplete15/smartstore";
  Browsers["Item"](btChrome)["Run"](url);

  var propNames = new Array("ObjectType", "ObjectIdentifier");
  var propValues = new Array("textbox", "instasearch");
  var txt_edit = Sys["Browser"]()["Page"](url)["FindChildEx"](propNames, propValues, 15, true);

  // Enter "ball" in the Search text box
  txt_edit["SetText"]("ball");

}

Entering text into password edit boxes

If the web <input> element has the password type, it masks its text with placeholder characters. You cannot get the text of such controls. However, you can simulate entering the text into them.

Instead of storing the password in plain text directly in your tests, you can use Password variables. Values of these variables are encrypted.

In keyword tests

  1. Add the On-Screen Action operation to your test. TestComplete will open the Operation Parameters wizard.

  2. Point to the text edit control into which you want to enter the text.

  3. On the next page of the wizard, select the method you want to use. It can be the SetText, Keys, or Text [Set] method.

  4. On the next page of the wizard, click the ellipsis button in the Value column.

  5. In the resulting dialog, set the Mode to Variable. From the Value drop-down list, select the password variable that stores the value to enter.

  6. Click Finish to complete adding the operation.

Entering a password in a password edit box

Click the image to enlarge it.

When you run the test, it will simulate entering the value that the password variable stores. The entered text will be masked.

In script tests

To access project or project suite variables from script tests, use the Project.Variables and ProjectSuite.Variables objects. The code sample below shows how to use the password variables to simulate entering masked text in the password edit controls:

Web (Cross-Platform)

JavaScript, JScript

function Sample_Enter_Password()
{
  var url = "https://services.smartbear.com/samples/TestComplete15/smartstore/login";
  Browsers.Item(btChrome).Run(url);

  var txt_edit = Sys.Browser().Page(url).FindElement("#Password");

  // Enter the value of the password_var project variable in the Password text box
  txt_edit.SetText(Project.Variables.password_var);

}

Python

def Sample_Enter_Password():
  url = "https://services.smartbear.com/samples/TestComplete15/smartstore/login"
  Browsers.Item[btChrome].Run(url)

  txt_edit = Sys.Browser().Page(url).FindElement("#Password")

  # Enter the value of the password_var project variable in the Password text box
  txt_edit.SetText(Project.Variables.password_var)

VBScript

Sub Sample_Enter_Password()
  url = "https://services.smartbear.com/samples/TestComplete15/smartstore/login"
  Browsers.Item(btChrome).Run(url)

  Set txt_edit = Sys.Browser().Page(url).FindElement("#Password")

  ' Enter the value of the password_var project variable in the Password text box
  txt_edit.SetText(Project.Variables.password_var)

End Sub

DelphiScript

procedure Sample_Enter_Password();
var url, txt_edit;
begin
  url := 'https://services.smartbear.com/samples/TestComplete15/smartstore/login';
  Browsers.Item(btChrome).Run(url);

  txt_edit := Sys.Browser().Page(url).FindElement('#Password');

  // Enter the value of the password_var project variable in the Password text box
  txt_edit.SetText(Project.Variables.password_var);

end;

C++Script, C#Script

function Sample_Enter_Password()
{
  var url = "https://services.smartbear.com/samples/TestComplete15/smartstore/login";
  Browsers["Item"](btChrome)["Run"](url);

  var txt_edit = Sys["Browser"]()["Page"](url)["FindElement"]("#Password");

  // Enter the value of the password_var project variable in the Password text box
  txt_edit["SetText"](Project.Variables.password_var);

}

Web (Classic)

JavaScript, JScript

function Sample_Enter_Password()
{
  var url = "https://services.smartbear.com/samples/TestComplete15/smartstore/login";
  Browsers.Item(btChrome).Run(url);

  var propNames = new Array("ObjectType", "ObjectIdentifier");
  var propValues = new Array("passwordbox", "password");
  var txt_edit = Sys.Browser().Page(url).FindChildEx(propNames, propValues, 15, true);

  // Enter the value of the password_var project variable in the Password text box
  txt_edit.SetText(Project.Variables.password_var);

}

Python

def Sample_Enter_Password():
  url = "https://services.smartbear.com/samples/TestComplete15/smartstore/login"
  Browsers.Item[btChrome].Run(url)

  propNames = ["ObjectType", "ObjectIdentifier"]
  propValues = ["passwordbox", "password"]
  txt_edit = Sys.Browser().Page(url).FindChildEx(propNames, propValues, 15, True)

  # Enter the value of the password_var project variable in the Password text box
  txt_edit.SetText(Project.Variables.password_var)

VBScript

Sub Sample_Enter_Password()
  url = "https://services.smartbear.com/samples/TestComplete15/smartstore/login"
  Browsers.Item(btChrome).Run(url)

  propNames = Array("ObjectType", "ObjectIdentifier")
  propValues = Array("passwordbox", "password")
  Set txt_edit = Sys.Browser().Page(url).FindChildEx(propNames, propValues, 15, True)

  ' Enter the value of the password_var project variable in the Password text box
  txt_edit.SetText(Project.Variables.password_var)

End Sub

DelphiScript

procedure Sample_Enter_Password();
var url, propNames, propValues, txt_edit;
begin
  url := 'https://services.smartbear.com/samples/TestComplete15/smartstore/login';
  Browsers.Item(btChrome).Run(url);

  propNames := ['ObjectType', 'ObjectIdentifier'];
  propValues := ['passwordbox', 'password'];
  txt_edit := Sys.Browser().Page(url).FindChildEx(propNames, propValues, 15, true);

  // Enter the value of the password_var project variable in the Password text box
  txt_edit.SetText(Project.Variables.password_var);

end;

C++Script, C#Script

function Sample_Enter_Password()
{
  var url = "https://services.smartbear.com/samples/TestComplete15/smartstore/login";
  Browsers["Item"](btChrome)["Run"](url);

  var propNames = new Array("ObjectType", "ObjectIdentifier");
  var propValues = new Array("passwordbox", "password");
  var txt_edit = Sys["Browser"]()["Page"](url)["FindChildEx"](propNames, propValues, 15, true);

  // Enter the value of the password_var project variable in the Password text box
  txt_edit["SetText"](Project.Variables.password_var);

}

See Also

Working With Application Objects and Controls
Web and RIA Testing

Highlight search results