You can start recording using any of the following ways:

1. Click the CREATE & RECORD button for a New Web Application in Configurations tab.
2. Click the RECORD button for an Existing Web Application in Configurations tab.
3. Click the Start Recording button in Actions tab.

Ensure that Developer Bot is running before starting to record the Application. To know more about how to start Developer Bot, click here.

Jiffy UILearn Application

A floating window of the Jiffy UILearn application opens to record the controls and actions performed on them in the application.

Ensure that the Application to be recorded is open before you start recording.

1. Click the RECORD button, a floating window of Jiffy UILearn opens.
2. Type the name of the screen in the Screens field and press Enter.
3. Hover mouse cursor on the UI element to be recorded and press Ctrl key on keyboard to capture the element. The selected UI element gets highlighted in red color.
   The recorded controls are listed under the selected Screen of the Jiffy UILearn window. Edit and give meaningful names to the controls so that it is intuitive for other designers.
4. Click the Other Recording button to record different types of UI elements like image, text, or table.
5. Click the Next Screen button to record the web actions from the next screen, if required.
6. Click the Stop Recording button to stop recording and save the UI controls to Jiffy server.
   The recorded UI controls are listed under the Actions tab of the Web UI node.

   For the Flight Booking application, click on Flights, One way, Leaving from, Going to, Date of Departure, and Search options to record them.

   

Rerecord

If any of the UI controls are missed to capture, you can rerecord them.

1. Drag the green line cursor above the UI Control to be captured.
2. Click the Start Recording button.
3. Capture the UI element and click Stop Recording button.

Rerecorded UI controls get listed below the green line cursor.

Record Image, Text, and Table

You can record UI elements of Table, Text, and Image formats.

Use Text and Image recording only if you are unable to capture UI Controls correctly, using Control based recording and Dynamic control based automation.

Table

This is applicable in scenarios where you need to record data in tabular format.

1. Click the Other Recording button.
2. Click the icon to record UI elements as Table.

3. For the first column, select two elements from the same column:

   1. Press the Ctrl key and select the first-row element in the column. The element gets highlighted in red color.
      
   2. Press the Ctrl key and select the second-row element in the column so that UI learn captures the coordinates of the table.
      All the row elements of the first column are automatically displayed under the first column.

4. For the other columns, press the Ctrl key and select the first-row element of the columns to be populated.
   The element gets highlighted in red and all the row elements of the recorded column are automatically displayed under the respective columns.

   Ensure that the previously recorded column is recorded and loaded in UI Learn dialog box, before proceeding to record.

5. If tables exist across multiple pages in the website, click the ADD NEXT LINK button to record them.

6. Click the Add SCROLL LINKS button and select the scroll to be recorded if any scrolls to be recorded.

7. Rename the columns in UI learn floating window with intuitive names.

8. Click the DONE button to stop the learning process.

Text

This is applicable in scenarios where you need to record a text field as Anchor and an image field as Target.

In a form where you need to enter text in a couple of user entry fields based on the labels, Text recording is used to record the label as Anchor and the user entry fields as Target entered in image format.

1. Click the Other Recording button.
2. Click the icon to record UI elements as Text.
3. Click the Anchor button. Press Ctrl key and select the text that needs to be identified. The selected text is the anchor and is displayed in the Element text box.
4. Click the Target button, select the area to be recorded.
5. Click the End Capture button to stop the learning process.
6. To clear the capture and start a new selection, click the Clear Capture button.

All the recorded controls are displayed in Jiffy UILearn floating window.

Image

This is applicable in scenarios where you need to record the Anchor and Target fields as images.

In a form, where both the label and user entry fields are images, image recording is used to record both Anchor and Target as image.

1. Click the Other Recording button.
2. Click the icon to record the image UI element.
3. Click the Anchor button and select the area to be recorded. The selected image is the anchor and is displayed in the Anchor field.
4. Click the Target button and select the area to be recorded. The selected image is the target and is displayed in the Target field.
5. Click the End Capture button to stop the learning process.
6. To clear the capture and start a new selection, click the Clear Capture button.
   All the recorded controls are displayed in Jiffy UILearn floating window.

Click the Stop Recording button to stop the recording and save the UI controls.

All the recorded UI controls are listed under UI Controls tab.