選択範囲をiframeでGoogle検索する

拡張機能そのものよりは、テストしていてわかったことのメモ書き。

ページ内の文言でふと気になったもの。
chromeなら選択して右クリックから「Googleで検索」を選べばすぐです。
本来はこれだけでよいのですが、
・新規タブを増やしたくない
・AI Overviewが出ないで欲しい

といったことを思うときはあります。
特にAI Overview。
なんで企業のコーポレートサイトを調べる時に出てくるのか。

故に作ってみました。
Altキーを押しながら選択範囲を作成するとiframeでGoogle検索する機能。
そこで問題点が複数。


1.cross-originの関係でiframe表示できないサイトは多い

当然ですが、サイト側が許可していなければiframeでの表示はできません。
Google検索結果もその1つですが、これは何故か「igu=1」とつけると設定が消えます。
参考はこちら「Google.comがiframeに埋め込めるようになるパラメータの謎」

Googleさんが自社のゲーム(サ終)のために作ったパラメータのよう。
そのためいつ使えなくなるかはわかりませんね。

またこれで許可されるのはGoogle検索結果だけであるため、
当然検索結果のリンク先は不許可ということもあります。
故に目的のサイトを閲覧するときは新しいタブで開く必要があります。
Google検索結果だけで用が済む場合もありますが。


2.mouseupとselectionchange

選択範囲を検出するjsを作る際、よくmouseupかselectionchangeを使うと見かけます。
どちらが良いのかというお話。

mouseupは文字通りマウスでドラッグして離した瞬間を検知します。
なので選択範囲の検出をするには最適ですが、
ドラッグしてなくても反応するためクリックイベント等への対策も必要です。

selectionchangeは選択範囲の変更をすべて検出するため
選択の終了時ではなく選択中(範囲が増えていくとき)も対象になります。
こちらはその対策をしておかないとイベント発火回数が増えすぎます。

ただしキーボードでの選択範囲の変更も検出できるので
マウス以外もターゲットにするならこちらの方が適任。


3.拡張機能にwindowオブジェクトはないよ

これは前々から使っているのですが指摘してなかったので書いておきます。
拡張機能はcontents-script以外でwindowオブジェクトを使えません。
undefinedです。

ではどうするかというと「document.defaultView」でOK。