JSFiddle - React, Tailwind, and code Playground

by Shashank Shekhar

HTML

<script src="https://www.gstatic.com/firebasejs/4.5.0/firebase.js"></script>

        <input type="submit" class="sign-in-button" id="sign-in-button" value="sign in with phone" />

JavaScript

// Initialize Firebase
          var config = {
    apiKey: "AIzaSyCxO_pX1VVnImzSA3_EX8BTymhXnOx65Ck",
    authDomain: "ltxapp-a87d3.firebaseapp.com",
    databaseURL: "https://ltxapp-a87d3.firebaseio.com",
    projectId: "ltxapp-a87d3",
    storageBucket: "ltxapp-a87d3.appspot.com",
    messagingSenderId: "580065380242"
  };
          firebase.initializeApp(config);
          
 window.recaptchaVerifier = new firebase.auth.RecaptchaVerifier('sign-in-button', {
              'size': 'invisible',
              'callback': function(response) {
                // reCAPTCHA solved, allow signInWithPhoneNumber.
                //onSignInSubmit();
                // phoneSignIn()
                phoneSignIn()

              }
            });
  function phoneSignIn(){
            var phoneNumber = '{{phone number here...}}';
            var appVerifier = window.recaptchaVerifier;
            firebase.auth().signInWithPhoneNumber(phoneNumber, appVerifier)
                .then(function (confirmationResult) {
                  // SMS sent. Prompt user to type the code from the message, then sign the
                  // user in with confirmationResult.confirm(code).
                  window.confirmationResult = confirmationResult;
                  console.log(window.confirmationResult)
                }).catch(function (error) {
                   console.log('ERROR:::')
                   console.log(error)
                  // Error; SMS not sent
                  // ...
                });
                }