[Tip] 参照/ブラウザ ステップをうま～く使うための隠し味。

## はじめに

PCにインストールされたデスクトップブラウザを操作する場合と異なり、BizRobo! の組み込みブラウザ（Chromium）を使用する場合、PCにインストールされたアプリケーションを操作するよりも高速で同期の安定性が高い反面、デスクトップブラウザの設定情報は引き継がれないため、必要によって個別に設定することになります。

今回はその `個別の設定` のうち、注意すべきものや便利なものの紹介を中心に、ひいては `参照/ブラウザ` ステップ自体の便利な使い方について紹介していこうと思います。

:::note
本記事は、BizRobo! v11.3.0.2 時点の情報を基に記述しています。
:::

## ページ読込編

### `画面サイズ` を広げてスクロールを抑制

ロボットの処理で面倒なのが画面のスクロールです。例えばあらかじめ縦や横に長いページを読み込む場合にはサイズを大きく設定[^1]することでロボットによる画面スクロールの手間を極小化できます！
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3090491/176b8b28-49fb-8f04-8102-454f29de37d7.png)

[^1]: 幅は 320 ~ 3,000、高さは 360 ～ 5,000 の範囲で設定することが可能です。

:::note
一方で、横幅を小さめに設定することで、レスポンシブ対応しているサイトの場合、画面の表示自体を携帯向けに単純化することもできるため、場合によってはロボットによる自動化も単純化できるかもしれませんね。
:::

---
### `言語リストを承認` を設定してローカル言語のページを表示

デフォルトでは `en-US` が設定されているため、読みこむページによっては英語のページが表示されます。読みこんだページが英語で表記されてしまう場合には `ja-JP` を設定して日本語仕様のサイトを表示しましょう！
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3090491/e827987b-a650-41d4-0218-ad46524cf0c2.png)

:::note warn
ほとんどの場合は単に表記が `英語` になるだけなので気にせずそのままにしてしまうケースもありますが、具体的な例でいうと **Kintone** の画面操作を行う場合には注意が必要です。

日付型の形式が日英で異なるため、フォームのバリデーションチェックで以下の様にエラーになってしまいます。（こうなってしまうと非エンジニアにとっては「？？？？」でしかありません。）

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3090491/c3fb9977-d7f4-5e5b-2f65-11f4c7613c87.png)
:::

---
### `ロード状態を無視` で、ホワイトリスト設定、高速化

業務アプリケーションの処理で使うことはないと思いますが、外部のサイトをクローリングする時には使えるかもしれません。

[オンラインヘルプ](https://docshield.kofax.com/RPA/ja_JA/11.3.0_5cdzhlgb3t/help/rpa_help/help_main/designstudio/c_das_browsestep.html)に配下のような記述があります。
> [ロード状態を無視]
ブラウザでこのオプションを選択すると、広告バナーの読み込みなどのバックグラウンドで行われる読み込み要求が無視されます。
> 
> デフォルトでは、CEF ブラウザはそのロード状態を分析し、ブラウザが Web ページをアクティブにロードしている場合、または別の場所にリダイレクトしている場合は、ロケーション ベースのガードの実行を許可しません。ブラウザは、Web ページがロードされ、ブラウザが非ロード状態に切り替わるまで待機します。
> 
> [ロード状態を無視] プロパティの設定により、ユーザーは、ブラウザが使用する URL または部分文字列を指定して、ブラウザが Web ページを完全にロードする前に、ロケーションが見つかった場合のガード、ロケーションが見つからなかった場合のガード、ロケーションが消失した場合のガード、およびツリーの変更停止のガードが実行可能かどうかを決定できます。
> 
> ユーザーは、コンマ区切りの URL 部分を指定できます。Web ページのロード中にブラウザが Web ページの URL とユーザーが指定した文字列との一致を検出したときに、開くアクションまたはロード中の状態を変更するアクション (ボタンをクリックする、またはマウスを動かすといったアクション) の後にいずれかのガードを実行する必要がある場合は、ロケーション ベースのガードを実行できます。

日本語が分かりづらいですね。英語でもまぁまぁ説明が難しそうな感じですが、要は

- このプロパティを有効化すると、ガードチョイスの待機条件をURL文字列ベースで指定できますよ。
- 対象のガードチョイスは `ロケーションが見つかった場合` `ロケーションが見つからなかった場合` `ロケーションが削除されました` `ツリーの変更停止` です。
- 条件設定は `URL` もしくはその `部分文字列`です。
- 条件を設定[^2]することにより、これまでページ全体の読みこみ完了がガードチョイス発動のタイミングであったものを、指定した条件を満たすデータの読みこみが完了した時点に絞ることができるため、結果的にページ読込後の処理が高速化されます。

ということですね。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3090491/f0af5980-e8c5-46c0-b1a6-f63dd019648b.png)
[^2]:部分文字列の設定はワイルドカードなどの考慮は不要で、例えば `bizrobo.com/hoge` 配下のURLにアクセスする通信全てを指定したい場合には、`.*bizrobo.com/hoge.*` などとする **必要はなく**、単純に `bizrobo.com/hoge` と指定すればOK。複数指定する場合にはコンマで区切って指定。

:::note warn
`ベーシックエンジンロボット` のURLブロックとは異なり、指定した値によって読みこむページの量が変わるわけではありません。
ただし、設定を誤ると動作スピードは上がるもののページ読込完了前に次の処理が動作（フライング）することにより、思わぬエラー（FinderIssue）の原因になる可能性もあるので乱用は止めましょう。
:::

---
### `証明書エラーを無視` で、社内の自己証明書運用サイトを読み込む

これももはや一般的ではありませんが、閉域環境などの限られた環境にて自己証明書を使って運用しているサイトをロボット化したい場合、以下のエラーによりページが読み込まれません。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3090491/9e828475-fef5-24e4-e41d-02f7a9f75b5f.png)
セキュリティを確保するために実施する際には細心の注意が必要ですが、以下の様に `セキュリティ` > `証明書エラーを無視` を選択することにより、自己証明書を使ったサイトも操作可能になります。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3090491/42030369-b82b-657b-2cef-6bbed51d2ba8.png)

:::note warn
セキュリティ確保の観点からこの設定はデフォルトで無効化されていることが正しいです。「以前はこんな設定しなくても表示できていたのに。不具合だ！改悪だ、直せ！」という意見に対しては、昨今のセキュリティを取り巻く状況変化の観点から、管理者がちゃんと説明して利用者にご理解いただくことを期待したいですね。
:::

---
### [Appendix] 参照/ブラウザ ステップ自体の配置方法の工夫

私自身はこの文脈でしか使ったことがないのですが、以下の様に `アプリケーションが見つかった場合` と `アプリケーションが見つからなかった場合` を組み合わせて `参照/ブラウザ` ステップを実行することで毎回アプリケーションウィンドウが開かれることがなくなり、ロボット作成時や保守・デバッグ時の繰り返し実行が劇的に効率的になります。[^3]
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3090491/6ba67db0-ab7c-3da9-559a-aae5516b1e6b.png)


[^3]: いちいち再実行のたびに ウィンドウ をクローズする必要はなくなるので。

:::note
今後改善をプッシュしていきたいと思いますが、ぱっと見ではブランチの条件が判別できないので、以下の様にコメントを添えることで見通しをよくすることをお勧めします。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3090491/6afdbbd6-5b5a-80ec-bf58-95d075b46466.png)
:::

## ページ生成編

あまり使う機会はないと思いますが、ロボット内で HTML を生成することができます。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3090491/af7f8ab8-6e0b-e531-74eb-992ca114ba03.png)
例えば下記のサンプルコードを `コンテンツ` 欄に貼り付けることで、ロボット内で JavaScript を実行する簡易ツールをロボット内に組み込むことができます。
<details><summary>サンプルコード</summary>

```javascript:ロボットの中でJavaScriptを実行するコード
<!DOCTYPE html>
<html>
<head>
  <title>BizRobo! JS playground</title>
  <style>
    body {
        margin:0;
    }
    div {
        width: 100%;
        margin:0;
        padding:0;
    }
    .input-area {
        display: flex;
        flex-direction: row;
    }
    button {
        border: none;
        background-color: rgba(9, 92, 74, 0.8);
        color: rgb(229, 243, 238);
        border-radius: 0;
    }
    #code {
        padding: 0.5rem;
        width: 100%;
        height: 10rem;
        border-radius: 0;
    }
    #result {
        padding:0.6rem;
        font-size:0.8rem;
    }
    #output {
        padding:0.5rem;
        border-top: none;
        background-color: rgba(243, 243, 243, 0.8);
        width:100%;
        min-height: 2rem;
    }
    .col {
        display: flex;
        flex-direction: column;
    }
  </style>
</head>
<body>
  <div class="input-area">
    <button onclick="runCode()">実行</button>
    <div class="col">
        <textarea id="code" placeholder="JavaScriptのコードを入力し、`実行`ボタンを押してください。"></textarea>
        <textarea id="output" placeholder="処理結果をロボットと共有したい場合には output.textContent = '値' で値を書き出してください。"></textarea>
    </div>
  </div>
  <div id="result"></div>

  <script>
    function runCode() {
      const code = document.getElementById("code").value;
      const result = document.getElementById("result");

      // コードを実行する
      try {
        eval(code);
        result.innerHTML = "Code executed successfully.";
      } catch(e) {
        result.innerHTML = "Error: " + e.toString();
      }
    }
  </script>
</body>
</html>
```
</details>

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3090491/afe25bd6-c6c0-381a-2a37-14e724476edb.png)

サンプルコードでは単に張り付けたJavaScriptを実行するだけのものですが、同じ発想で

- 入力した値のフォーマットチェック・変換をする画面機能
- 入力した値に特定の計算を実行する画面機能
- その他 JavaScript で実行できることを組み込んだ画面

を作って BizRobo! の機能を拡張できますね。

https://qiita.com/ParakeetOnTheHead/items/5f4b8828fa66ae113429

## ダウンロードを待機編

大きなファイルを Chromium でダウンロードする際に以下のように使用します。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3090491/0c4ad527-da44-bb64-cbf1-7fd533e666e1.png)

このステップの使い方がわからない場合、「ダウンロードボタン/リンクをクリック」「ダウンロードパスを設定」「Saveをクリック」した後はただただダウンロードが無事になされることを祈るのみ。。。かもしれませんが、
`秒` に設定した最大待機時間を基準にダウンロードをキャンセルしたり、待機を続けたりといった制御ができるようになるので、より確実な処理結果を得ることができるようになりますね。

:::note
実際に社内で動かしているバックアップロボットでは毎週30MB～800MB程度のサイズのファイルを複数ダウンロードしています。
サイズも変動し、5分ではダウンロードが終わらないこともあるので、待機時間`秒`と`アクティブなダウンロードの数`が確認できることで、柔軟かつ確実に処理を実行できています。
:::

## まとめ

「わからない」ということは自分に恐怖を与えますが、「わかろうとしない」ということは他人に恐怖を与えますよね。