image
Blog Post • development

Understanding Selenium -- our first problem

December 17, 2015by Alfonso Joven 3 min read
Blog Post • development
Understanding Selenium -- our first problem
Back to top

Hello again! Now that we have setup selenium on your machine, let's talk about what value it actually gives us. If you think about it, or if you decide to look up their website, all that Selenium does is it just automates your browser. The tests, the functionality, and the code hookups are entirely up to you. This is structured this way to cater to people who are new to the product, as well as go all the way to the seasoned veteran. You can use and configure selenium to personalize your needs and wants for your projects.

So enough of the chit-chat, we all want to get into it, so let's dive in!

In light of the new drupal 8 release, i have decided to use their latest iteration for the project. If you're not familiar with drupal8 or how the setup works, here's a good post to get your environment up.

Got your site running? Great. Let's start automating.

Our First Problem

Drupal 8 Basic Screen

Here we have a simple drupal setup. Nothing fancy, nothing new. This is, basically, the bare basics of Drupal 8. Initially, there is no content posted on the site. The basic theme is preloaded and basic administrator commands are present on the site. This is all we need to write a fully functional test.

The first case we want to examine and automate would be a simple one:

To confirm that content creation works on the project
As an administrator of the project
I should be able to create content and post it on the front page.

Simple enough, let's break it down to parts we can actually manipulate using selenium.

  • We want to be logged in as an administrator of the site. That means, someone who has administrator privilages. This also entails, running through the login process "automatically".

  • We want to make sure we are able to access the content creation menu. This can be achieved by just hitting the hard URL and starting from there, but for this post, we will go through it manually.

  • We want to simulate a content creation workflow. This includes, entering values on the field, and submitting them through the UI.

  • Finally, we need to confirm that everything that we did is present on the front page.

One of many ways to do it

Once we've determined what we need, it's just a matter of answering the question of how you want to do it. Most programmers would write mountains of code to get their expected results. Starting off on a simple project like this, we can assume that we can just use the IDE to do everything for us.

First, let's get the Selenium IDE running, and set the URL to pointing to our localhost, and specify which port you are using. If you followed the tutorial on the link above, the port would be 8000, so your URL will look like http://localhost:8000.

Setting Localhost

We need to make sure that we are logged out. This is our starting point. If you can still see your admin credentials and menu, make sure you log out of it. The easiest way is just to append "/user/logout" on the URL bar and that will magically solve that step for you.

Once you are logged out, hit the record button and work through the site like normal.

  • Login through /user/login
  • Enter your credentials
  • Click the content menu
  • Click Add Content
  • Click Basic Page
  • Fill in the fields
  • Click Promoted on the front page
  • Click Save and Publish

Pitfall: notice that the commands adding text to an iframe doesn't really record properly. That is because iframe are special elements that require special manipulations.

The finale

So once you are done with that, take off the recording on the session. This is where it becomes a tad bit trickier. We want to verify that the content is actually present on the front page. So, two things; First, we have to go to the home page and Second, we have to assert that the content is present on the home page. Here's how we do it.

  • Direct your IDE to go to the front
  • On the next blank line, set the command to 'assertText'. This looks for the text on the page. Set the value to whatever you placed in the title
  • Repeat the previous two steps but replace the value to whatever your placed in the body.

Always remember, green means it passed and red means there is something wrong with it.

Once you're done with that, you want to make sure that your automated steps works as intended. Go ahead and delete the previous entry that you made. Once you've done that, run the test and you should be able to recreate whatever you have made two minutes ago.

Presto! Your first automated test. This solves the problem given initially. Later on, we will learn on how to generalize some variables, to accept different values but running the same test. For now, congratulations! We did it!

Authored by