당근마켓 클론코딩 질문

(강의에 '저장할꺼'는 animal로 이름설정하였습니다)

var animal = {
                                    이름: $('#name').val(),
                                    종: $('#species').val(),
                                    성별: $('#gender').val(),
                                    생년: $('#birth').val(),

                                    이미지: url,
                                };
                                db.collection('product')
                                    .add(animal)
                                    .then((result) => {
                                        console.log(result.id); //성공
                                        console.log(animal);
                                        window.location.href = 'index.html';
                                    })
                                    .catch((error) => {
                                        //실패
                                        console.log(error);
                                    });
구문을 animal 안 이미지 url을 넣기  위해서 아래 구문 안에다가 붙이는

storageUpload.snapshot.ref
                            .getDownloadURL()
                            .then((url) => {

부분을 똑같이 실행하였는데 그렇게되면 firestore 와 storage에 아무것도 저장이 되지 않는 것같습니다

이 과정 전에는 잘 저장이 되었습니다. 
혹시 코드오류가 있을 수 있으니 script부분 보냅니다.

        <script>
            const db = firebase.firestore();
            const storage = firebase.storage();

            console.log(new Date());
            $('#send').click(function () {
                var file = document.querySelector('#image').files[0];
                var storageRef = storage.ref();
                var storageSavePath = storageRef.child('image/' + file.name);
                var storageUpload = storageSavePath.put(file);
                storageUpload.on(
                    'state_changed',
                    // 변화시 동작하는 함수
                    null,
                    //에러시 동작하는 함수
                    (error) => {
                        console.error('실패사유는', error);
                    },
                    // 성공시 동작하는 함수
                    () => {
                        storageUpload.snapshot.ref
                            .getDownloadURL()
                            .then((url) => {
                                console.log('업로드된 경로는', url);
                                var animal = {
                                    이름: $('#name').val(),
                                    종: $('#species').val(),
                                    성별: $('#gender').val(),
                                    생년: $('#birth').val(),

                                    이미지: url,
                                };
                                db.collection('product')
                                    .add(animal)
                                    .then((result) => {
                                        console.log(result.id); //성공
                                        console.log(animal);
                                        window.location.href = 'index.html';
                                    })
                                    .catch((error) => {
                                        //실패
                                        console.log(error);
                                    });
                            });
                    }
                );

                // $(`input`).val('');
            });

     
        </script>

console에도 아무런 error가 없네요ㅠㅠㅠ