回答編集履歴

3

誤字修正

2022/10/02 15:43

投稿

t-n
t-n

スコア136

test CHANGED
@@ -46,7 +46,7 @@
46
46
  <script src="hot-reload.js"></script>
47
47
  </head>
48
48
  <body>
49
- <p>Do not close fo hot reload!!</p>
49
+ <p>Do not close for hot reload!!</p>
50
50
  </body>
51
51
  </html>
52
52
  ```

2

不要なconsole.logを削除

2022/09/30 15:41

投稿

t-n
t-n

スコア136

test CHANGED
@@ -23,11 +23,9 @@
23
23
  ```js
24
24
  chrome.management.getSelf(self => {
25
25
  if (self.installType === 'development') {
26
- console.log(chrome.runtime.getURL('hot-reload.html'));
27
26
  chrome.tabs.query({
28
27
  url: chrome.runtime.getURL('hot-reload.html')
29
28
  }, tabs => {
30
- console.log(tabs);
31
29
  tabs.length || chrome.windows.create({
32
30
  url: 'hot-reload.html',
33
31
  type: 'popup',

1

コードを追記

2022/09/30 15:35

投稿

t-n
t-n

スコア136

test CHANGED
@@ -3,4 +3,52 @@
3
3
 
4
4
  必要な処理はこちらのページで行い、結果のみを[`sendMessage`](https://developer.chrome.com/docs/extensions/reference/runtime/#method-sendMessage)で返す実装に変更するのはいかがでしょうか。
5
5
 
6
- ※ シリアライズ不可のオブジェクトを共有したい場合は[`IndexedDB`](https://developer.mozilla.org/ja/docs/Web/API/IndexedDB_API/Using_IndexedDB)が利用可能です。
6
+ ~~※ シリアライズ不可のオブジェクトを共有したい場合は[`IndexedDB`](https://developer.mozilla.org/ja/docs/Web/API/IndexedDB_API/Using_IndexedDB)が利用可能です。~~
7
+ → 検証の結果`DirectoryEntry`は格納不可でした
8
+
9
+ ## 追記
10
+ ポップアップ画面を開いたままにしておくという制約はありますが、動作はしたので実装内容を記載します。
11
+ ファイル配置は以下の想定です。
12
+ ```ここに言語を入力
13
+ extension-root
14
+ ├─background.js
15
+ ├─hot-reload.js
16
+ └─hot-reload.html
17
+ ```
18
+
19
+ ### backgrond.js
20
+ 下記内容を追記
21
+ ※ ポップアップが複数開くのを防ぐためには`manifest.json`の`permissions`に`tabs`を追加してください
22
+ ※ ポップアップを自動的に開くためのコードなので、手動で開く場合は不要です
23
+ ```js
24
+ chrome.management.getSelf(self => {
25
+ if (self.installType === 'development') {
26
+ console.log(chrome.runtime.getURL('hot-reload.html'));
27
+ chrome.tabs.query({
28
+ url: chrome.runtime.getURL('hot-reload.html')
29
+ }, tabs => {
30
+ console.log(tabs);
31
+ tabs.length || chrome.windows.create({
32
+ url: 'hot-reload.html',
33
+ type: 'popup',
34
+ width: 200,
35
+ height: 200,
36
+ focused: false
37
+ });
38
+ });
39
+ }
40
+ });
41
+ ```
42
+ ### hot-reload.html
43
+ 新規作成
44
+ ```html
45
+ <!DOCTYPE html>
46
+ <html>
47
+ <head>
48
+ <script src="hot-reload.js"></script>
49
+ </head>
50
+ <body>
51
+ <p>Do not close fo hot reload!!</p>
52
+ </body>
53
+ </html>
54
+ ```