Setup the Firebase authentication emulator

Jorge Vergara
InstructorJorge Vergara

Share this video with your friends

Send Tweet
Published a year ago
Updated 11 months ago

In this lesson you'll learn how to use the connectAuthEmulator function from Firebase's authentication emulator and the Firebase Emulator Suite to test out auth in development.

Jorge Vergara: We're going to initialize the Firebase Authentication emulator. For that, we're going to go wherever we initialized Firebase in our application. Since I'm running this demo on Angular, it means that I need to go to the app.module.ts file. In here, we're look for the line where we're importing from the Firebase Authentication package. We'll add the function, connectAuthEmulator.

Next, we'll go to auth initialization, and we'll add the connect function here. This function takes two parameters. First, it takes the authentication instance. We can get it here with the getAuth method. Then it takes the URL it's going to connect. In our case, it's going to be localhost, followed by the port.

If you don't remember what port does the authentication emulator use, we're going to go into the firebase.json file. In here, you can see that the emulator is using port 9099 for authentication. We can go back to the initialization and add that port here.

As you can see, I have a little typo here, it's HTTP. Then I save again. You can see now, Firebase is letting us know that we are running in emulator mode. This is a nice way to know that we are not using the production environment.

To test this, we are going to go into our CLI and we are going to run the command, firebase emulators start. Once the emulators are running, we are going to check in the console, what's the URL that we are using for the emulator's UI. We're going to copy that URL, and we're going to navigate to that.

Now, we can go to the authentication emulator. We can see that we don't have anything here at the moment. We can go back to our application. We click on Create a New Account. I want to create a new account with the credentials, jorge/jorgevergara.co, and some random password. When I click Create Account, they are moved.

You're going to be able to see that, if I go back to the emulator suite and I refresh here, now I have the new user that I just created. Now, if we log our user out, we can see that we can log in with the same user and same credentials. Here, we have jorge@jorgevergara.co. When I add that same user here, I click Sign in, and it logged into our application.

All of this is talking to the Local Emulator Suite, so none of this is talking to our deployed Firebase application.