Operate a Page

Japanese may be displayed on some pages.

 Home > User guide > BOT > How to use the BOT editor > Operate a page

This page explains how to operate an element in the Page.

Click an element

Click and Select the element. The operation menu appears by clicking again while the element is selected. Click "Click" on the operation menu.

Watch in HD

Get a value in the element

Click and select the element. The operation menu appears by clicking again while the element is selected. Click "Copy" on the operation menu, and then click "copy the text". Input the data name, and then click "Copy".

Watch in HD

Get a URL of the link

Click and select the element. The operation menu appears by clicking again while the element is selected. Click "Copy" on the operation menu, and then click "Copy the link URL". Input the data name, and then click "Copy".

Watch in HD

Get an attribute value in the element

Click and select the element. The operation menu appears by clicking again while the element is selected. Click "Copy" on the operation menu, and then click "Copy the attribute value", the list of attribute values will appear. Select an attribute value out of them. Input the data name, and then click "Copy".

Watch in HD

Get the overview of the selection range

Click and select the element. The operation menu appears by clicking again while the element is selected. Click "Copy" on the operation menu, and then click "Copy the selection range". Input the data name, and then click "Copy".

Watch in HD

Extend a selection and Undo a selection

The range of the selected elements can be adjusted.

1. Click to select an element.
2. Click again to display the action menu.
3. Select "Selection menu" from the action menu.
4. Adjust using "Extend a selection" or "Undo a selection."

Input a value in the text box

Input any string

Click and select the element. The operation menu appears by clicking again while the element is selected. Click "Input" on the operation menu. Input characters, and then press the button.

Watch in HD

Pasting data

Pasting the value stored as data within the BOT into the text box.

1. Select "Paste data" from the operation menu.
2. Select the desired data for pasting.

Differences by data type

Input a value in the select box

Input any string

Click and select the element. The operation menu appears by clicking again while the element is selected. Click "Input" on the operation menu. Click the select box, then the pull-down menu appears. Select a value.

Watch in HD

Select by pasting data

Values stored as data within the BOT can be pasted into the select box to make a selection.
If there is data that matches the value attribute of an option within the select box, that option will be selected.

Differences by data type

選択方法を切り替える

【Valueが一致する項目を選択する】入力した値がセレクトボックスのoptionのvalue属性と一致する項目が選択されます。

【ラベルが一致する項目を選択する】入力した値がセレクトボックスの表示テキストと一致する項目が選択されます。

Input a value in the checkbox

Input any string

Click and select the element. The operation menu appears by clicking again while the element is selected. Click "Input" on the operation menu. Confirm that the checkbox is checked, and then press the button.

Watch in HD

Select by pasting data

Values stored as data within the BOT can be pasted into the checkboxes to make a selection.
If there is data that matches the value attribute of a checkbox, that checkbox will be selected.

Differences by data type

選択方法を切り替える

【Valueが一致する項目を選択する】入力した値がチェックボックスのvalue属性と一致する項目が選択されます。

【ラベルが一致する項目を選択する】入力した値がチェックボックスの表示テキストと一致する項目が選択されます。

Input a value in the radio button

Input any string

Click and select the element. The operation menu appears by clicking again while the element is selected. Click "Input" on the operation menu. Confirm that the radio button is checked, and then press the button.

Watch in HD

Select by pasting data

Values stored as data within the BOT can be pasted into the radio buttons to make a selection.
If there is data that matches the value attribute of a radio button, that radio button will be selected.

Differences by data type

選択方法を切り替える

【Valueが一致する項目を選択する】入力した値がラジオボタンのvalue属性と一致する項目が選択されます。

【ラベルが一致する項目を選択する】入力した値がラジオボタンの表示テキストと一致する項目が選択されます。

Specifying an element selector

The currently selected element is confirmed. The element selector for the selected element will be shown in the "Specify an element selector" field.
* For adjusting the range of the selected element, refer to "Extend a selection and Undo a selection."

1. Select "Selection menu" from the action menu.
2. Choose "Specify an element selector."

* This can also be selected from the menu at the top right of the screen.

How to Specify an element selector

In "Specify an element selector," the element selector for the selected element is checked.
It is also possible to input any element selector to reselect an element.

Specify by HTML structure
Express the element selector using the hierarchical structure of HTML leading to the element.
Example: html > body > div > section:nth-of-type(2) > div > div > div > div > div > h2

Specify by ID attribute
Express the element selector starting from an element with a specified ID attribute.
Example: div#app > section:nth-of-type(2) > div > div > div > div > div > h2

Specify by any selector
Input any element selector to specify an element.
When specifying with any selector, it is also possible to reference data stored in Cloud BOT.

Record the operation by specifying the ID

Select the operation you want to record (click, copy, etc.). Click "How to specify an element" at the bottom left of the confirmation dialog. Click "Convert to ID attribute specification".

Watch in HD

Other functions

Download

Download the linked file or image file.

• For instructions on how to download linked files, click here.
• For instructions on how to download image files, click here.

Right-click

Right-click an element.

1. Click "Other functions" from the operation menu.
2. Click "Right-click."

ダブルクリック

要素をダブルクリックします。

1.操作メニューから「その他の機能」をクリックします。
2.「ダブルクリック」をクリックします。

ドラッグする/ドロップする

要素をドラッグ&ドロップします。

1.ドラッグしたい要素に対し、操作メニューから「その他の機能」をクリックします。
2.「ドラッグする」をクリックします。ドラッグ状態になり、ドロップするまで継続します。

※ページ遷移が発生した場合、ドロップ状態は解除されます。

3.ドロップしたい要素に対し、操作メニューから「ドロップする」をクリックします。
　マウスカーソルが移動し、ドロップされます。

マウスボタンを押す/マウスボタンを離す

要素に対し、マウスボタンを押す/離す操作をします。

1.マウスボタンを押したい要素に対し、操作メニューから「その他の機能」をクリックします。
2.「マウスボタンを押す」をクリックします。マウス押下状態になり、離すまで継続します。

※ページ遷移が発生した場合、押下状態は解除されます。

3.マウスボタンを離したい場所で操作メニューから「マウスボタンを離す」をクリックします。
　マウスカーソルが移動し、マウスボタンが離されます。

マウスを移動する

要素にマウスカーソルを移動します。
マウスオーバーする場合などに使用します。

1.操作メニューから「その他の機能」をクリックします。
2.「マウスを移動する」をクリックします。

※マウス移動後も、「ドラッグする」「マウスボタンを押す」は維持されます。

キーボード入力する

キーボードの任意のキーを入力します。
ショートカットキーの入力が必要な場合などに使用します。

1.操作メニューから「その他の機能」をクリックします。
2.「キーボード入力する」をクリックします。
3.「ここにフォーカスしてキーを入力してください。」をクリックし、キーボードからキーを入力します。

修飾キーについて

修飾キーを同時に入力できます。

※「Ctrl」はWindowsではCtrlキー、macOSではcontrolキーを指します。
※「Alt」はWindowsではAltキー、macOSではoptionキーを指します。
※「Meta」はWindowsではwindowsキー、macOSではcommandキーを指します。

Wait until the element is displayed

Wait until the element is displayed.
This is used when there are images displayed after the page loads or buttons that are displayed later by JavaScript, and waiting until they are displayed is necessary.

1. Click "Other functions" from the operation menu.
2. Click "Wait until the element is displayed."

* The waiting time until the selected element is displayed can be adjusted with the "Timeout" setting. For more information about task timeouts, click here.

Create a condition with the element

Create a condition expression using the target element as a template.

Verify element existence

Verify the existence of the selected element.

1. Click the element to verify its existence.
2. Click "Other functions."
3. Click "Create a condition with the element."
4. Click "Verify element existence."
5. Click "OK." A conditional branch for the existence of the element will be inserted into the tasks in the side menu.

このフレームでScript実行

選択した要素が存在するフレームでScriptを実行します。
詳しくはこちら。

Export/Import cookie

Cookie from the virtual browser can be exported and imported. Exporting and importing can be recorded as tasks.
Additionally, cookie information can be checked and copied to the clipboard.

• Click the "Cookie" button in the side menu or click "Cookie" in the top-right corner of the screen to open the cookie modal window.

About cookie information

Checking cookie information

Cookie information of the virtual browser can be checked.
* Cookie is displayed as data in JSON format.

Copying cookie

Cookie from the virtual browser can be copied to the clipboard.

• Click the copy icon to copy the cookie values.

Exporting cookie

Export the currently displayed virtual browser cookie and store it as data.

1. Select "Destination data".
   * Choose either "New data" or the name of the destination data.
2. Click the "Export" button. The task of exporting the cookie will be added.

Importing cookie

Import JSON data stored in the data as a cookie.
* If the imported cookie is not valid JSON data, an error will occur.

1. Select the data name from "Data to be imported".
2. Click the "Import" button. The task of importing the cookie will be added.