シナリオ実行中にブラウザのズームを変更したい
現状
WebDriver制御のシナリオです。
Chromeのズームは100%で運用してきました。
新たなニーズ
こんな声があります。
- シナリオ動作中にズームを変更しても(ユーザー視点でいじり倒しても)動き続けるようにしてほしい
- 運用者が自由にズームアウト(全体を見渡せるように) or ズームイン(文字が読めるように)したい
- シナリオの動作を手助けしたい
ホンネ
- 満たされると更なる高みを求めがち
- 贅沢(ワガママ)の域
- 黙殺したい
- 「却下」で通したい
- 手助け不要な精度を目指したい
理想
- シナリオ動作中にCtrl+マウススクロールでいつ誰がどのズームレベルにしても、たとえ25%でも500%でも動き続ける
妥協案(ニーズ×スキル×コストを踏まえた現時点でのバランスポイント)
- 通常動作は100%
- 人が見る/助ける場面に「待機ボックス」を置いておく
- ズームレベルを自由にいじってもらう
- [OK]で動作を再開する1パーツ目でズームレベルを100%に戻す
- 「待機ボックス(タイムアウト付き)」で、助けがなくても回り続けようとするしくみにしておきたい
かなり深く考えたものの、理想に辿り着けずにいます。
膨らませようがある部分があるでしょうか。
良いアイデアやヒントがあれば教えてください。
目的ベースで逆転の発想、ゼロベースの提案とかもウェルカムです。
安心材料
「画像マッチング」系、座標操作系の「エミュレーション」等は不使用のシナリオです。
このシナリオでは今後もなるべくこれらは使わないつもりです。
把握済みのハードル
WebDriver制御のシナリオでは、ボタンAをクリックすると決めた後で、その座標にボタンAがなければエラーになる。
そこに別の物体があればエラーになるか想定外の挙動になる。
困ってるスレッドにいくつか絡んできました。
「100%が無難」「おとなしく100%で運用しとけ」な論調が優勢だったと思います。
https://winactor.com/questions/question/表示倍率を80に変更したら、クリックされなくなっ/
Selenium - ブラウザのズーム機能のせいで Click がうまくいかない : @jsakamoto
https://devadjust.exblog.jp/20033086/
【Python】Chromeの拡大率のせいかも!Seleniumでボタンクリックしても動作しないとき - しらすのStudy blog
https://teshi-learn.com/2021-06/python_selenium_noerror_click/
Seleniumの動作(入力時例外/2:Chrome) | Seleniumワールド
https://selenium-world.net/selenium-tips/2216/
JavaScriptを使えば/(JavaScriptで作られてる)拡張機能制御なら、ズーム等の影響を受けにくいことを把握済みです。
https://winactor.com/questions/question/クリックに失敗する箇所がjavascriptで乗り越えられた/
スタンス
今回はあえてタブーを犯す検討です。
どうしたら安全に踏み込めるでしょうか。
ズームを自在に制御してるかたのコツを参考にしたいです。
仮説1
- ページ読み込み前にズームを変更しておけば、描画時に要素の座標が決まり、座標にある要素を安定的にクリックできる
フローイメージ
ズーム変更 ← この位置がポイントのはず
ページ表示
クリック
考慮ポイント
- 画面遷移毎、ページ表示毎に手前でズーム変更が要るのかどうか
- 一度変えたら踏襲され続けるならラク
パーツ候補
ブラウザのズームを100%にするライブラリ
https://winactor.biz/library/2018/11/09_429.html
- 67%と150%に加工してテスト予定
リファレンス
Webページの拡大表示方法(Chrome):BIGLOBE会員サポート
https://support.biglobe.ne.jp/settei/browser/chrome/chrome-003.html
- JavaScriptでズーム変更
https://winactor.com/questions/question/クリックに失敗する箇所がjavascriptで乗り越えられた/
ページ全体を任意倍率で拡大縮小
http://www.openspc2.org/reibun/javascript/bookmarklet/004/
- サンプルスクリプトが今のChrome等でも使える
Edge/Chromeでブラウザのウィンドウ表示倍率を変更する【Selenium】【ExcelVBA】 | VBA Create
https://vba-create.jp/vba-selenium-window-zoom/document.body.style.zoom= \'60%\';
メリット
- 最初の「ブラウザ起動」後の「ページ表示」前の1回だけ、あるいは「ページ表示」毎だけ加味すれば良い
不安材料
SeleniumとPlaywrightでブラウザのズーム拡大率を操作するうまいやり方 - Qiita
https://qiita.com/yk109/items/bb54a1b54f9470eae9c53. javascriptによる拡大率変更
document.body.style.zoom = \'110%\';ブラウザ機能による拡大率変更時とは異なる結果が得られた
- ▲ ネガティブ情報があると二の足を踏みがち
- ◆ 諦め見送るのは試して異なる点と影響を実感してからでも良さそう
◆ ノウハウを持ってるかたからおこぼれをいただいてショートカットできれば嬉しい
仮説2
- 「クリック」等を全部JavaScriptスタイルに差し替えれば、タイミングを問わずズームを変更できちゃうはず
考慮ポイント
- 「クリック」以外のアクション(リスト選択」とか)を含め、JavaScriptが万能なのかどうか
- 仮にすべてのアクションに有効だったとして、弱点もあるのかどうか
イマイチポイント
- 「ページ表示」より「クリック」のほうが使用数多め
- 要素の取得方法に慣れる必要がある
【JavaScript】要素の取得方法(getElement、querySelector) - Qiita
https://qiita.com/tomokichi_ruby/items/c3ed6f6edbd5078ddf70
要素の取得方法まとめ - Qiita
https://qiita.com/amamamaou/items/25e8b4e1b41c8d3211f4
救いポイント
- IE時代に培ったノウハウがある程度活かせる
id属性要素を取得するGetElementById | IE操作の自動化
https://www.vba-ie.net/element/getelementbyid.php
- ◎ 時間をかければゴールできそうではある
- ◆ 仕様/万能かどうか/弱点等は、ノウハウを持ってるかたからおこぼれをいただいてショートカットできれば嬉しい
仮説3
- [特定のサイトのズームレベルを管理]は活用の余地があるかどうか
テキスト、画像、動画のサイズを変更する(拡大、縮小) - パソコン - Google Chrome ヘルプ
https://support.google.com/chrome/answer/96810?co=GENIE.Platform=Desktop
【Google Chrome】拡大(ズームイン)されたWebページを素早く元に戻す:Google Chrome完全ガイド - @IT
https://atmarkit.itmedia.co.jp/ait/articles/2003/11/news019.html
ChromeとEdgeブラウザーでズーム(倍率)設定になっているページをまとめて元に戻す方法 | パソコンりかばり堂本舗
https://ikt-s.com/chrome-edge-zoomlevel/
- 「ブラウザ起動」後「ページ表示」前までに[特定のサイトのズームレベルを管理]にズームレベルを反映させられればベターかも
chrome://settings/content/zoomLevels
- JavaScriptアプローチ(document.body.style.zoom)の不安材料を拭えるかも
- 幸い1つのウィンドウでは1つのWebシステムのみ扱っている
- それらしき起動オプションは見つけられず
- ▲ 実行者が好きなズームレベルにしたまま使い、途中では変更しない前提になる
妄想
Ctrl+マウススクロールでいつ誰がどのズームレベルにしても、25%でも500%でも動き続けさせるには、、
- やはり仮設1の「ページ表示」前の考慮が必要なのかも
- 「ページ表示」後はアクションが期待するズームレベルを維持する
- 「ページ表示」後のズームレベル変更を拒否する
- 「ページ表示」時のズームレベルを記憶し「クリック」等の前で矯正する
- パーツをちりばめれば成り立つのかも
- サブルーチン化したほうがスマートなのかどうか
- 「ページ表示」にズームレベルの記憶を、「クリック」等にズームレベルの矯正を機能として盛り込めたら、「クリック」等から「ページ表示」までの変更のみが有効で、その間がズームレベル変更の猶予になるはず
- 記憶先を[特定のサイトのズームレベルを管理]にする
- ある程度のバランスポイント案になった印象
- ここまでに前提とした数々がホントに前提なのかどうか
- レジストリでいじれるのは3点リーダーメニューのズームのほうみたい(Edgeの情報)
【2020年版】Edgeの各種設定に対応したレジストリ | エンジニアの技術グログ
https://gyoumu-kouritsuka-pro.site/edge-reg/5. それ以外の設定
1. 拡大
1. ページ表示の拡大縮小の設定
- Chromeならもっと奥まで届くのかどうなのか
悲報
Google Chrome 設定 ズームレベル サイト毎の保管管理場所 - Windows & IT
https://abhp.net/it/IT_Google_Chrome_750000.htmlGoogle Chrome では、このページにて、記録されたズームレベルを、右側の「×」印をクリックすることによって削除はできますが、設定 ・変更等はできません
- ▲ ある程度のバランスポイント案になった印象は妄想だった、、
- ▲ ズームレベルの変更/リセットは、ライブラリと同じ「エミュレーション」式のアプローチが無難みたい、、
- ◎ ズームレベル変更の猶予ポイント、矯正の考えかたは活かせそう