BizRobo! CAMPUS!!第7回～Chromium編～に参加しました！
こんにちは！
RPA新人開発者の戸波です。
先日、RPAテクノロジーズ株式会社主催のBizRobo!初心者向けセミナー、「BizRobo! CAMPUS!!」のChromium編に参加しました。
今回は、BizRobo! CAMPUS!!Chromium編に参加した感想をお話しします。
Chromiumを使ってページを見ることができるようになると、DSでうまく見ることができなかったWebページも見ることができるため、ロボット作成の幅がぐっと広がります。
みなさまのロボット開発のお役に立つとうれしいです！
BizRobo! CAMPUS!!のアジェンダ
今回のBizRobo!CAMPUS!!は、以下のような流れで進行していきました。
（出典：RPAテクノロジーズ社 BizRobo! CAMPUS!!のスライド）
Chromiumとは
Chromiumとは、オープンソースとして公開されているブラウザレンダリングエンジンで、Google Chromeに搭載されています。
（ブラウザレンダリングエンジン：ブラウザの見た目を整えて表示してくれる機能）
（出典：RPAテクノロジーズ社 BizRobo! CAMPUS!!のスライド）
基本的に、BizRobo!上ではDSの「Load Page（ページ読込）」ステップを使ってWebページを表示することが多いと思います。
DSの「Load Page（ページ読込）」ステップでは、WebKitやClassicといったブラウザレンダリングエンジンでページを表示しています。
しかし、WebkitやClassicといったブラウザレンダリングエンジンはJavaScriptなどの非同期処理（あるタスクの進行中に、そのタスクの完了を待たずに別の処理を実行できるやり方）が苦手であるため、BizRobo!上ではWebページの一部が表示されていない状態でロードが完了することがあります。
例えば、以下のような場合です。
次の画像では、BizRobo!の「Load Page（ページ読込）」ステップを利用してマイナポータルのホームページを表示しています。
本来であれば赤枠内にログインボタンやメッセージが表示されますですが、「Load Page（ページ読込）」ステップを利用した画面には表示されておらず、ページが正しく表示されていないことがわかります。
次の画像では、DAのChromiumを利用してマイナポータルのホームページを表示しています。
Chromiumを利用したときは、ログインボタンやメッセージも含めてしっかり表示されています。
BizRobo!で「Load Page（ページ読込）」ステップを利用してうまく表示されないページを正しく表示するためには、JavaScript等の非同期処理が得意なDAのChromiumというブラウザレンダリングエンジンを利用して、ページを読み込みます。
しかし、最初からすべてDAのChromiumを使って解決してしまうよりも、まずはDSで表示することができないかを試してみてからにした方がよいというお話がありました。
それは、DSの方が使える機能やステップが多い、常に全体を見ながら操作ができる、など利点が多くあるためです。
まずはDSのWebKitやClassicを利用し、どうしてもページを正しく表示できない場合はChromiumを利用する、という手順が適しているとのことでした。
（出典：RPAテクノロジーズ社 BizRobo! CAMPUS!!のスライド）
今回取り組んだ2つの演習
演習のポイント
演習1では、DSで画面を表示しようとすると一部分がうまく表示されないため、その原因を探る方法がポイントになります。
演習2は、演習1の結果DSの設定を操作しない限りは画面をうまく表示できないため、DAのChromiumを利用します。
DAロボットを使って、どのような手順で表示させるかがポイントです。
（出典：RPAテクノロジーズ社 BizRobo! CAMPUS!!のスライド）
（出典：RPAテクノロジーズ社 BizRobo! CAMPUS!!のスライド）
演習1（解答）
まず、プロジェクトを右クリックし、「新規作成」から「Webオートメーションロボット」を作成します。
ロボットの名前を入力します。
表示するマイナポータルのURLと、実行モード「最小実行（ダイレクト）」を選択・入力します。
ここまで設定してページ読込のステップを実行したところ、以下のようなページが表示されました。
本来であれば、赤枠の部分にログインボタンやメッセージが表示されるのですがうまく表示されていません。
うまく表示されない原因を調査するためには、「ブラウザトレーサ」という機能を使います。
DSの画面左上のメニューバーより「ツール」を選択し、「ブラウザトレーサを開く」をクリックします。
ブラウザトレーサは、ロボットを動かしてトラブルが起きた際のブラウザの通信内容にエラーがないかを確認する機能です。
ブラウザトレーサの画面を開くと、左上に赤い丸印があります。
ここをクリックして、トレース記録を開始します。
このとき、ロボットを更新してからトラブルがあったステップの一つ手前までロボットを実行した状態で、トレースを開始する必要があります。
ロボットを更新し、トレースを記録すると以下のようなトレース記録がありました。
JavaScriptタグを開くと、何かしらのエラーが出ているということがわかります。
エラーを解決するために、DSの左上にあるツールバーからロボット設定を開きます。
開いたロボット設定の画面で、デフォルトオプションの「設定」をクリックします。
デフォルトオプションの設定から「JavaScript実行」タブを選択し、JavaScript変更の「＋」マークから「テキストフォーマット」＞「テキストの置き換え」の順に選択します。
テキストの置き換えで、「let 」を「var 」に置き換えます。
このとき、「let」の後ろにも「var」の後ろにも必ず半角スペースを入れます。
次に、「JavaScriptポリフィル」で「すべて」を選択します。
「OK」ボタンをクリックして設定を終了します。
ロボットを実行すると、設定前に正しく表示されなかったマイナポータルのログインボタンやメッセージも含めて、ページが正しく表示されるようになりました。
演習2（解答）
先ほど演習1の最初で作成したロボットの実行モードを、「スマート再実行（フル）」に変更します。
この設定を行わないと、DAでChromiumを利用することができないため、忘れずに設定してください。
ロボット作成時の画面からも設定することができますが、ロボット作成後に実行モードを変更する際はメニューバーのロボット設定から「デザインモード」を選択し、設定します。
プロジェクトを右クリックし「新規作成」で、「Desktop Automationロボット」を作成します。
演習1で利用したロボットのエンドステップを右クリックし、「Desktop Automationロボットの呼び出しステップ」を選択します。
先ほど新規作成したDesktop Automationロボットを利用するために、Desktop Automationロボットの項目で名前を選択します。
Chromiumを利用する時には、「必要なデバイス」のところでデバイス名は設定しません。
DS左上のツールバーから、「ステップイントゥー」をクリックし、DAロボットのステップ設定に移ります。
右クリックで「参照ステップ」を挿入します。
参照するURLとしてマイナポータルのページのURLを入力します。
参照ステップを実行すると、ページが表示されます。
ログインボタン等も含めて、マイナポータルのページがきちんと表示されました。
感想
私は今までロボット開発をしている中で、すでに何度かChromiumを使っていたので今回はおさらいをするつもりで参加しました。
改めてChromiumの使い方を学習することができて、とてもよかったです。
また、私は今までDSで画面を表示しようとしてできなかったときに、何も考えずにChromiumを使うことばかりを考えていました。
しかし、今回のセミナーではChromium利用時のポイントだけでなく、演習1で紹介したようにDSの設定を操作することでページを正しく表示する方法も学習することができたので、ページ表示における不具合の解決策も学ぶことができました。
これからは無意識にChromiumを使うことでページの表示問題を解決しようとせずに、一度立ち止まってどのやり方や解決策が最も適しているのかを考えながら、ロボット開発をしていきたいと思いました。
第7回のBizRobo! CAMPUS!!は少し先の7/8（金）で、DSのファインダー編が開催予定です。
また感想を共有いたしますので、ぜひお読みいただけますと幸いです。
今回も、最後までお読みいただきありがとうございました！
