Using Web Mode

Automation of a web application using the WEB MODE highlights the area that you can capture for configuration. Once the area is captured, perform the relevant action using the out-of-box interactions available. Scenarios where the WEB MODE does not work as expected, you can even switch between WINDOWS MODE and IMAGE MODE to configure the field. Following are the instructions to perform field configuration using the WEB MODE:

Use the (Settings) icon of the required Application activity to launch Multimodal Interface and the configured application. By default WEB MODE is set. See Web Application automation to know how to use the activity.
Click the (Play) button to capture the steps that you want to perform within the web application. The application opens and the Play button changes to the (Recording) button.

Hover over the field that you want to capture. The field gets highlighted with red box.

Click the highlighted area. The Field Properties panel of the Web Mode appears. The fields that are mandatory are highlighted with red box.

In the Action list, select the action that you want to perform on the captured area. Other mandatory fields change depending on your selection from the drop down list. Enter the required details. Refer Field Properties table to know more about the available fields and their respective properties.
Click the (Save) icon to configure the actions and other related fields.
Repeat step 2 through 6 to capture all the steps involved in the process. The fields configured and saved appears in the Saved pane of the Field Properties panel. You can edit or delete these steps in the Saved pane.
Click the (Save configured field and return to studio) icon to save the field that you configured and return to the Studio menu.
The fields related to Web MODE are configured.

Web Mode Control Behavior and Field Descriptions

The properties of Web Mode fields are listed in the following table:

Property Name	Usage
Control Behavior
Action	It is the action or the interaction that can be performed on a web based application depending on the type of UI element as per the requirement. Available options are: Control Exists- Checks if the UI element exists at the specified area. It is useful when working with dynamics controls. Wait Until Exists- Waits until the UI element is found. You can use this to avoid any delay in the page loading time. This interaction returns a Boolean value of true or false (on success or failure respectively) on finding the image. The Boolean value can be set to a variable and checked in a conditional statement to perform an appropriate action after finding the web element. Click- Allows to left click the selected UI element. Open Context Menu - Opens the context menu that appears on an interaction such as a right-click. Double Click- Performs double click on the selected UI element. Get Value- Extracts the current value of the selected UI element such as, value of an input field , text box or selected area. Get Attribute- Extracts the attribute's value of the selected UI element. Get Text- Retrieves text from the selected UI element. MouseOver- Hovers the mouse over the selected UI element. Scroll By- Scrolls to particular section of the web page horizontally or vertically. Scroll Into View- Scrolls to bring the application area viewable on screen of the web browser. Set Value- Sets the user provided value of the UI element attribute and stores it as the value of the parameter. You must define the parameter in the Parameter bar before you start capturing the element. Set Attribute- Sets the user provided attribute for the specified UI element and stores the provided value of the attribute into a parameter. You must define the parameter in the Parameter bar before you start capturing the element. Click NoWait- Allows to click the selected UI element and move to the next activity without waiting for the page to load. SendKeys- Captures input of the selected UI element from the keyboard. The input can be a combination of keys or text input from the keyboard. Use this option when a keystroke needs to be automated on a specific web element and not on the overall application. Shift Click- It appears only when you want to capture action on a button or a link. this interaction opens the URL associated with the selected link or the button, in a new window.
Interaction	The corresponding interaction set against the selected action.
Appears if Action selected is SendKeys.
Keys	The key sent as input from the keyboard. It can be a combination of keys or a text. To configure the keys: Once Action selected is SendKeys, click the (Configure) icon. The SendKey Configuration dialog box appears. In the Select Function Keys(Max 3) list, select the keys from the keyboard to create the key combination. You can select upto maximum of three keys. In the Input Key(optional) filed, enter an alphabetical or a numeric key to create the combination. This is an optional field. Click CONFIRM. The configuration for SendKeys action is done.
Appears if Action selected is Get Attribute and Set Attribute.
Attribute	Sub attributes or the properties of the html attribute selected.
Appears if Action selected is Set Value, Set Attribute.
Input Source	The input value that must be provided. You must define a parameter in the Parameter bar to use this option. Select the checkbox beside Input Source, and enter the input value, if you want to set a default value.
Appears if Action selected is Scroll By.
XAxis	Vertical scroll on the web page. The value must be entered in pixels.
YAxis	Horizontal scroll on the web page. The value must be entered in pixels.
Appears if Action selected is Scroll Into View.
Scroll To	Determines the area till where the scroll must be done. Available options are: Start Center End Note: Internet Explorer does not support Centre option, so configuring center for ScrollTo displays exception at runtime.
Dock Window This section appears only when Action selected is Shift Click.
Dock Action	When a link or button on the web page is opened in a new browser window, the Dock Action button enables the new window listed in the multimodal UI. You can select one of the windows in the multimodal UI to configure controls on the intended window.
Interaction Attributes This section appears only when Action selected is Shift Click.
Tab Name	Name of the new window when it is docked in Engage application.
Target Url	URL of the new window that opens when Shift Click is selected in Action.
Use Mouse	Performs left click of the mouse on the link or the button to open in the new browser window.
Field Properties
Control Tag	User specified identifier of the selected UI element.
Control Type	Control type of the UI element as defined by the developer.
Display Name	User specified display name of the action configured.
Find By	Locator of the UI element on a web application. Identifying the correct element forms one of the first step towards creating an automation workflow. Available options are: id- identifier of the UI element. It is useful for locating elements that has a unique id associated with it. name- field name of the UI element. Each element on the web page has a name assigned to it that can be used to select the intended element. css3selector- part of the CSS rule that uses selectors such as tags, class, pseudo-element, pseudo-class, combination of selectors and other wide range of selectors to identify the UI element. manual- provides manual way of identifying the UI element. innertext - Depending on the html tagging, css3xpath can also be available in this list. It returns the text content of the UI element and its descendants. It can be used with the elements that have a dynamic Id, name, or selector but its property value remains deterministic. Some of the examples of innerext values are, Search, Search, Search* and Search* that is equivalent to equals, starts with, contains and, ends with respectively. sclocator - This option is available if an application is automated having Smart Google Web Toolkit (GWT) platform. Support for sclocator is available in Selenium based plugins viz. InternetExplorerSelenium, Chrome, and Firefox. shadow-path - This options is available if an application is automated having a Shadow DOM. You can configure backup selectors to avoid situations where the automation process is unable to find the primary selector. This is not a mandatory step. Follow the instructions to configure the backup selectors: Click the (Configure) icon. The Configure Selectors dialog page opens. Select the additional selectors. If the selector is manual: Click the (pencil) icon to configure the manual selector. The Configure Selector dialog box appears. In the Select Attribute list, select the attribute of the manual selector, Available options are- class, offset and loopselectorgenerated. In the Value list, either select a parameter containing the value of the Attribute selected or select the check box to set a default value. In the Condition list, select the condition of the selector. Available options are- Equals, Contains, Starts With and Ends With. The Generated Selector field displays the default value generated, if any. You can click Add to add this value in the Selector field. In the Selector list. Click CONFIRM. In the Value field enter the required query. Drag the selector and drop to change the sequence to rearrange the default order. Click CONFIRM to save the configuration.
Appears if Action selected is Control Exists, Get Attribute.
Is C-View	Is applicable only for AssistEdge Engage. If selected, the field configuration captured in Automation Studio is visible in the Engage C-View tab.
Tab Number	The window tab on which you want to perform automation.
Appears if Action selected is Control Exists, Get Attribute.
Variable Name	User defined name of the variable that stores the captured value. You can define the variable name here itself or predefine it in the Parameter bar.
Appears if Action selected is Control Exists, Get Attribute
Variable Type	Type of the variable defined. Available options are: Text - A sequence of character, either as a constant or a variable. Numeric - An integer type that range from negative through positive. Decimal - An exact numeric value defined by its precision and scale. Boolean - A data type used for making decision. Can have only two values- true or false. Data Table - A data type that stores tabular data.
Misc
FrameNo	Number of the frame of the web page where you want to perform the action. Automation Studio automatically detects the frame number based on the area selected during configuration.
Item Index	Index number of the selected item on the web page.
Item Offset	The distance between the target item and the anchor.