【Chrome Extension】Manifest V3だとFirebase AuthenticationのgetAuth()がService Worker上ではできない

解決策としては、popup.htmlとかで認証処理する。

1
"action": {    "default_popup": "popup.html"  }

以下エラーとなったコード。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
const app = initializeApp(firebaseConfig);
 
chrome.action.onClicked.addListener(async (tab) => {
  const auth = getAuth(app);
  const email: string = "test@hoge.com";
  const password: string = "testPass";
  createUserWithEmailAndPassword(auth, email, password)
    .then((userCredential) => {
      // Signed in
      const user = userCredential.user;
      // ...
    })
    .catch((error) => {
      const errorCode = error.code;
      const errorMessage = error.message;
      // ..
    });
});

const auth = getAuth(app); のタイミングでエラーが出る。

原因はService Workerでwindowオブジェクトが使えないから。

念のため確認(どこでやっても同じだろうけど)

ちなみに、 Manifest v2までだと Service Workerではなかったのでwindowオブジェクトが使えていた。なのでいけてた。