Testing a Facebook chatbot with Nightmare.js [pt. 1]

On this tutorial we will see how to create an end-to-end test with Nightmare.js to test a Facebook chatbot.

It is assumed that you already have a Facebook chatbot running, because we will not see how to build one here.

On this article, the first part, we will focus on creating a test user and a test page on Facebook. This test user will have the capabilities to login into Facebook and chat with our BOT. For that, we will use a test page, so that our chatbot can send and receive messages through it.

Optionally, on the end of this tutorial, we will see how to configure the Azure Bot Service to connect the BOT with the the test page.

When i finish writing the second part, i will post the link here. It will be the last part, where we will write a simple question & answer api on Nightmare.js to test the chatbot.

Index:

Create a Test User
Create a Test Page
Link the Test Page with the BOT application
(Optional) Connect the BOT with the Test Page on Azure

Lets get started…

Create a Test User

According to the Facebook, a Test User is described as:

Test Users are special Users you can use to test your app. They are hidden from real User accounts, and any data you generate with a Test User will only be visible to other Test Users on that app, or to real Users who have a Admin, Developer, or Tester role on the app. Test Users are also exempt from our spam and fake account detection systems, so they won’t be disabled when you use them to test your app.

To know more about Test Users you can access this link.

Since we are trying to test our BOT, it is very likely that we had to set up a Facebook Application so the BOT could trade messages with Messenger.

We can create Test Users on the Facebook application page, which can be accessed on the apps dashboard.

On the App Page, click on Functions to open a submenu, and next on Test Users. This will open the page that allow us to create test users, as shown on Figure 1.

Figure 1 —Test Users page

Click on Add to open a modal, as shown at Figure 2. Them, select “Yes” for “Authorize Test Users for This App”.

It is necessary to give the Test User the right permissions to create and send messages to the Test Page that we will be creating. The Login Permissions are: manage_pages, pages_show_list and pages_messaging.

We can leave the other options with their default values.

Figure 2 — Creating the Test User

Next we need to set a password. Otherwise we can’t login on Facebook (or Messenger) with the Test User. It is important to set the password before getting the token because every time the password is changed we need to generate a new token.

Click on Edit to open a little menu, then click on “Change the name or password for this test user”, as shown on Figure 3.

Figure 3 — Setting the test user password

After changing the user’s password, click again on Edit. This time, click on “Get an access token for this test user” as shown on Figure 4. Don’t forget to save the generated token for later.

Figure 4— Getting an access token for the test user

Now that the Test User is set up. We can now login on Facebook Messenger with his Email and Password. Try it out, because that is how we will be logging in with the Nightmare.js application.

Notice that this user can’t send messages yet. We also cannot send messages to the BOT with him. This is the reason we will be creating a Test Page on the next step.

The BOT needs to be configured to send and receive messages from the Test Page too. On the end, we will have two (or maybe more) pages connected with our BOT application.

Create a Test Page

Test pages allow us to test the BOT’s application without using our production page. Creating a Test Page is very straightforward, we just need to send a POST request using the Facebook Graph API.

POST /v3.1/:testUserId/accounts

Application: Select your BOT application name

Access Token: Paste the Test User access token you got on the previous step.

Query Params (required):

name: The page name.
category_enum: The page category.
about: The page’s about.
picture: Some valid picture for the page.
cover_photo: Some valid cover foto

You can check on the Links section for more information about this API. Now, we will use the following query parameters to create the Test Page.

name: Jackson Albiejejcdjhd Liescu Personal Blog
category_enum: PERSONAL_BLOG
about: Jackson Albiejejcdjhd Liescu test page
picture: https://avatars1.githubusercontent.com/u/149531?v=3&s=460
cover_photo:{“url”:”https://orig00.deviantart.net/7db9/f/2016/303/7/5/nature_beautiful_wheat_field___facebook_cover_by_tweakertea-damsgob.jpg”}

POST /v3.1/100470524281527/accounts?name=Jackson Albiejejcdjhd Liescu Personal Blog&category_enum=PERSONAL_BLOG&about=Jackson Albiejejcdjhd Liescu test page&picture=https://avatars1.githubusercontent.com/u/149531?v=3&s=460&cover_photo={"url":"https://orig00.deviantart.net/7db9/f/2016/303/7/5/nature_beautiful_wheat_field___facebook_cover_by_tweakertea-damsgob.jpg"}

The Figure 5 shows the result after we send the POST request to the Facebook Graph API. If it was successful, the Test Page ID will be returned. Save it for later.

Figure 5 — Creating a Test Page

Link the Test Page with the BOT application

To make the chatbot receive and send messages through the Test Page, we need to get an access token for the page. However, the access token registered to the page by default is a short-term access token, meaning that it expires in a very brief period of time.

What we will do next is to “transform” this access token into a long-term access token, which has a lifetime of 60 days. We can always use the default (short-term) access term to refresh our long-term access token.

Retrieving the Test Page’s short-term Page Access Token

GET /v3.1/me/accounts

Application: Select your BOT application name

Access Token: The test user access token

Figure 6

To subscribe the page we just need to send another POST request. But first, change the Access Token with the Test Page access token. This will subscribe the app on the current selected application. If all permissions was defined correctly, we should receive a success message.

POST /me/subscribed_apps

Figure 7

Get a long-term Page Access Token for the Test Page

We can retrieve our long-term access token with another API call. However, this time we will use the CURL command, because this API cannot be accessed on the Graph API Explorer.

If you don’t have CURL, you can choose whatever application you wish other that can send POST requests.

The following curl command query params:

client_id: Facebook Application Id
client_secret: Facebook Application Secret
fb_exchange_token: The Page token

curl -X GET "https://graph.facebook.com/oauth/access_token?grant_type=fb_exchange_token&client_id=&client_secret=&fb_exchange_token="

----------------------------------------

Response:{"access_token": "EAAcJ5P3IBycBAEencptoDloIKrAfDP0WZCTl3zMKCSCUiZBD14hja7DhGczPWdDDXVYKesZABugggCrg0AkUYHiySb1dm3VzHRuwURxHIHM1373KFFiPPW7U6Xse3tAGOYYAecaaHjiKl0XmR5NxfE3v40vrZCKFtby253wvcotO8QueTLuEZBVVl38ZD","token_type": "bearer","expires_in": 5184000}

Now, if we try to login into Facebook Messenger we can see that it is possible to send messages to Test Page we’ve just created.

For that, just search for the Test Page name on the Search bar and the Page should appear on the results. Figure 8 shows the final result of this tutorial.

Figure 8 — Chatting with the Test Page

(Optional) Connect the BOT with the Test Page on Azure

This step assumes that you are using Azure Bot Service to create chatbots.

On the Bot Channels Registration resource, click on Channels > Facebook Messenger. This page is where you might have linked your BOT application to the Facebook Messenger.

To connect the BOT with the Test Page, click on “+ Add a new page” and insert the Test Page ID and the Test Page long-term Access Token. Now you should have two pages linked with your bot: the original and the test page.

The chatbot should be linked to your Test Page now. To check that, login on Messenger with the Test User credentials and try to send a message to the Test Page. If everything went correctly, the bot will send an answer back. An example is presented on Figure 9.

Figure 9 — BOT chatting with the Test Page

We have successfully created a Test User and a Test Page. Now we have in hands all we need to create the end-to-end test for our chatbot: the Test User’s email and password, and a Test Page where the BOT can chat with the user.

On the second part of this tutorial we will see how to use what we’ve done here to test our chatbot integration.

See you later!