Тайм-аут подключения к firebase createUserWithEmailAndPassword

Я получаю следующую ошибку

A network error (such as timeout, interrupted connection or unreachable host) has occurred.

Эта демонстрация технически работает на stackblitz.com (новый пользователь появится на базе firebase). Не будет работать на локальном сервере.

Локальный хост внесен в белый список.

https://stackblitz.com/edit/react-gr9qck

actions.js

import { auth as firebaseAuth } from '../firebaseConfig'

export const EMAIL_SIGN_UP_CHANGE = 'EMAIL_SIGN_UP_CHANGE';
export const PASSWORD_SIGN_UP_CHANGE = 'PASSWORD_SIGN_UP_CHANGE';

export const onEmailSignUpChangeAction = value => ({
    type: EMAIL_SIGN_UP_CHANGE,
    email: value
})

export const onPasswordSignUpChangeAction = value => ({
    type: PASSWORD_SIGN_UP_CHANGE,
    password: value
})



export const onEmptySignUpEmailClick = () => ({
    type: 'EMPTY_SIGN_UP_EMAIL'
})

export const onEmptySignUpPasswordClick = () => ({
    type: 'EMPTY_SIGN_UP_PASSWORD'
})

export const signUp = () => (dispatch, getState) => {
    const {signUpAuth} = getState();
    if (signUpAuth.emailSignUp === '') {
        dispatch(onEmptySignUpEmailClick())
    }
    if (signUpAuth.passwordSignUp === '') { dispatch(onEmptySignUpPasswordClick()) }
    else {

        firebaseAuth.createUserWithEmailAndPassword(signUpAuth.emailSignUp, signUpAuth.passwordSignUp)
            .catch( function (error) {
                let errorCode = error.code;
                let errorMessage = error.message;
                alert(errorMessage)
            })
    }

}

firebaseConfig (помечено звездочкой для защиты)

import firebase from 'firebase'

const config = {
    apiKey: "******",
    authDomain: "*****",
    databaseURL: "****",
    projectId: "******",
    storageBucket: "******",
    messagingSenderId: "*******"
};

firebase.initializeApp(config);

export const database = firebase.database()
export const auth = firebase.auth()
export const googleProvider = new firebase.auth.GoogleAuthProvider()

SignUp.js

import React, {Component} from 'react';
import { withRouter } from "react-router-dom";
import { connect } from "react-redux";
import {signUp ,onEmailSignUpChangeAction,onPasswordSignUpChangeAction} from '../actions/';
class SignUp extends Component {
    state = {
        email: "",
        password: ""
    }

    // onChange = (e) =>{
    //   this.setState({
    //       [e.target.name] : e.target.value
    //   })
    // }
    // handleSubmit = (e) =>{
    //     e.preventDefault();
    //     this.props.signUp(this.state);
    //     // (register === true) && this.props.history.push('/');
    //     // console.info(this.state);
    // }
    render() {
        return (
            <div className = "container">
                <div className = "row">
                    <div className = "col-md-6">
                        <h1>Sign Up</h1>
                        <form onSubmit = {this.props.signUp}>
                            <div className = "form-group">
                                <label for = "exampleInputEmail1">Email address</label>
                                <input
                                    type = "email"
                                    className = "form-control"
                                    id = "email"
                                    onChange = {this.props.onEmailSignUpChangeAction}
                                    aria-describedby = "emailHelp"
                                    value = {this.props.emailSignUp}
                                    placeholder = "Enter email"/>
                                <small id = "emailHelp" className = "form-text text-muted">We'll never share your email with anyone else.</small>
                            </div>
                            <div className = "form-group">
                                <label for = "exampleInputPassword1">Password</label>
                                <input
                                    type = "password"
                                    className = "form-control"
                                    id = "password"
                                    value = {this.props.passwordSignUp}
                                    onChange = {this.props.onPasswordSignUpChangeAction}
                                    placeholder = "Password"/>
                            </div>

                            <button type = "submit" className = "btn btn-primary">Submit</button>
                        </form>
                    </div>

                </div>
            </div>

        );
    }

}

const mapStateToProps = (state) => ({
    user: state.auth.user,
    emailSignUp:state.signUpAuth.emailSignUp,
    passwordSignUp:state.signUpAuth.passwordSignUp

})

const mapDispatchToProps = (dispatch) => ({
    signUp: () => dispatch(signUp()),
    onEmailSignUpChangeAction: (event) => dispatch(onEmailSignUpChangeAction(event.target.value)),
    onPasswordSignUpChangeAction: (event) => dispatch(onPasswordSignUpChangeAction(event.target.value)),
}); 


export default withRouter(connect(mapStateToProps, mapDispatchToProps)(SignUp));

signUpReducer

import { PASSWORD_SIGN_UP_CHANGE, EMAIL_SIGN_UP_CHANGE} from '../actions';

const initialState = {
    emailSignUp: '',
    passwordSignUp: ''

}

export default (state = initialState, action) => {
    switch (action.type) {
        case EMAIL_SIGN_UP_CHANGE:
            return {
                ...state,
                emailSignUp: action.email
            }
        case PASSWORD_SIGN_UP_CHANGE:
            return {
                ...state,
                passwordSignUp: action.password
            }
        default:
            return state
    }
}