firebase cloud firestoreへデータが追加できない

表題の件ですが、公式リファレンスなどをみて同じように記述したものの、cloud firestoreにデータが保存されません。

  const handleClick = () => {
    const docId = Math.random().toString(32).substring(2);
    const docRef = db.collection("test").doc(docId);
    docRef.set({
        title: "テスト",
        contents: "テスト",
    });

<Button colorScheme="pink" mr={4} onClick={handleClick}>

console.logで確認したところ、handleClick()は正常に実行されてました。

また、firestoreの認証キーを.envにて格納し参照しているのですが、
そちらもconsoleで確認したところ、正常に読み込まれています。

import firebase from "firebase/app";
import "firebase/auth";
import "firebase/firestore";
import "firebase/storage";

const firebaseConfig = {
  apiKey: process.env.REACT_APP_FIREBASE_APIKEY,
  authDomain: process.env.REACT_APP_FIREBASE_DOMAIN,
  databaseURL: process.env.REACT_APP_FIREBASE_DATABASE,
  projectId: process.env.REACT_APP_FIREBASE_PROJECT_ID,
  storageBucket: process.env.REACT_APP_FIREBASE_STORAGE_BUCKET,
  messagingSenderId: process.env.REACT_APP_FIREBASE_SENDER_ID,
  appId: process.env.REACT_APP_FIREBASE_APP_ID,
};

const firebaseApp = firebase.initializeApp(firebaseConfig);

export const db = firebaseApp.firestore();
export const auth = firebase.auth();
export const storage = firebase.storage();
export const provider = new firebase.auth.GoogleAuthProvider();

どなたかご教授いただけないでしょうか。
宜しくお願い致します。

行動規範の内容に同意します

回答1件

ベストアンサー

次のようにデータ追加後の結果を確認してみてはいかがでしょうか

tsx
1  const handleClick = async() => {
2    const docId = Math.random().toString(32).substring(2);
3    const docRef = db.collection("test").doc(docId);
4    const res = await docRef.set({
5        title: "テスト",
6        contents: "テスト",
7    });
8    console.log(res);
9  }