chrome拡張機能 code: "~" で書くと可読性が落ちてしまう。

Question

質問失礼します。

クロームの拡張機能の勉強をしています。
https://toranoana-lab.hatenablog.com/entry/2020/04/23/174421
のサンプルコードを複製し改造していたのですが、コードが長くなるにつれて非常に見辛くて困っています。

hrome.tabs.executeScript(
          tabs[0].id,
          {code: "someCode as here"})

調べたところeval()の関数に似ているのですが、あまりいい評判を聞かないです。
もしあまり推奨されてないようであれば普通のコードと同じように書く方法や、可読性を上げる方法を教えていただけたら幸いです。

Answer 1

質問者様がおっしゃっている

hrome.tabs.executeScript()

chrome拡張機能ではどうしても必要となります。
これは現在表示れれているWebページと拡張機能が動いている空間が違うからです。(空間を分けないと変数や関数が被ったりする可能性がある)

拡張機能側からはWebページを直接見る事操作する事ができない。
よってWebページに特定の処理を送り込んで実行し結果を取得する方法しか取れないんですね。(逆に.executeScript()しかアクセスできる方法が無い)
ちなみに

	var param = 'test.js内の関数実行';
	chrome.tabs.executeScript({
		code: param
	},function(){
		chrome.tabs.executeScript({
			file: 'background_scripts/test.js'
		});
	});

とかにすれば少しは読みやすくなるかな？

Comments

[Alice_p_h]

なるほど！！空間が違うのですね！！とりあえずコードを書いて空白を消して頑張ってみます。
ありがとうございました。