Taking on “Testing Triangles – A classic excercise”

Solving puzzles, sudokus & the analytical problems is one of my hobby. This set of puzzles always helps me with some brain food which mandatory to stay tuned in the current trends.

I was going through this Testing Triangles post from Elisabeth Hendrickson from Quality Tree Software. The triangle program is very much popular to the world of testers and many of the books and blogs have already covered the same.

Elisabeth posted this as a testing puzzle and asks the people to uncover the bugs in her program. The beauty of this Triangle program is that whole code is available for the tester since it's written using JavaScript.

I couldn't stop my self exploring the program and discovering some issues with Testing Triangles and logging them into comments sections while in hurry too.

I thought for a while on this program in the evening and felt that there are many similarities for this even though it's very very small when compared to the real world applications we test today. So let me take a re-look at this program and apply my test approach for the problem.

Step1: What is the Problem ?

We need to test a program that takes the three sides of a triangle and tell the user about what kind of triangle is it. Here is that Triangle program which has been written in Java Script.

Find the description from the post here

This version of the program takes as input three numbers representing the size of the sides of a triangle. When the user clicks "Draw" the program draws a picture of the triangle with the size of the sides shown in proportion and also displays the type of triangle.

Step2: Question the problem & get the required information for the Test.

The Testers first need to understand the application and the scenarios in which the same might be used.

So with this perception, let's re-look at the information available for the application. This is true that the above information provided for the application, acts as Requirements, User Manual and any other info we can call it as.

Like many applications that we test now, even this doesn't have clarity on the information provided. This is also one of the reason for me to call it as a classic example for testing. If we dig more into it the clarity on the information is missing and there are lot of implied requirements (at least from the developer perspective) /assumptions made by the developer.

It's not clear from the above description that

• What is a Triangle and how to define the same ?
• How many types of triangles are there and how to define each one of them ?
• Are there any boundary limits for the size of the sides that makes triangle ?
• Can any given three numbers make a triangle ?
• etc..

Since the info is not available and the Triangles are very generic. Let's try to Google around the same and get some info to explore the application.

So get the info here, here, here, and here

Step 3: Sanity / Smoke Test for Triangle Program

By now, I know what a triangle is to begin with and how the same can be drawn. Let me do some sanity checks here.

• For the Test Data of 1, 1, 1 as the values for three edges of triangle the output of the application is "Triangle Type: Equilateral"
• For the Test Data of 2, 2, 3 as the values for three edges of triangle the output of the application is "Triangle Type: Isosceles"
• For the Test Data of 5, 6, 7 as the values for three edges of triangle the output of the application is "Triangle Type: Scalene"

 

I have started with some very basic positive tests to make sure that the application is inline as per requirements. It's not good to test the application against negative tests to begin with.

 

Let's explore some more tests.

• Try with 0,1,2 – Invalid – wow // might have checked for 0
• Try with -2,3,4 – Invalid – wow // might have checked for -ve values
• Try with 1,2,3 – Invalid – // what ? why is this invalid

For the Test Data of 1, 2, 3 as the values for three edges of triangle the output of the application is " Triangle Type: Invalid"

The Application says it's invalid. But as per the above spec it should be a Scalene Triangle since all the edges are different from each other.

The following queries came to my mind

• Is this a bug with Application ?
• Am I missing any more info that's required for the test ?
• Can any given three edges make a triangle ?
• Is there any logic behind the same ?
• But it could have been good,if the application says why the data is invalid. I have no clue on this and it's a usability issue.

 

The general tendency that i see in many of the testers is to report it as a bug the moment they see some different behavior with the application and run into many discussion over the same. I have already blogged on it with a post as That's Expected Behavior and not a Bug. A little more depth into information gathering will be more effective.

Let's see why this test data is invalid for the application.

I got some more information again over the web on the edges of the triangle that will help me to understand the issue. And this is the logic behind the same. Get more info on this here.

In order to construct a triangle, the sum of any two edges must be greater than the third one.

 

So with the above data of 1,2,3 we can't construct a triangle and the data is invalid. But a error message here on why this is invalid from the application could have saved us lot of time in exploring the same.

One more test with 3,4,5

For the Test Data of 1, 2, 3 as the values for three edges of triangle the output of the application is " Triangle Type: Right"

 

Oh the behavior is different again. i am expecting of Scalene Triangle. Some more info via message could have been helpful for users on why the same has been labeled as that particular type. Might be the developer expecting all the users to have the domain knowledge.

 

Step4: Thumb Rules of the game

By now, we have capture a bit more info on the application & let's list the same here

• Rule 1 : Sum of all the angles inside a triangle must be 180 degrees.
• Rule 2 : In order to construct a triangle, the sum of any two edges must be greater than the third one.
• In case of sides, they are called as equilateral triangle, isosceles triangle, right angled and scalene triangle
• In case of angles, they are called as right-angled triangle, obtuse triangle and cute triangle

 

It's a good practice to update this section as and when we get the more info about the app behavior & fine tune the same.

 

Step5 : Black Box Testing on the Application

We have the following info as of now through above test observations.

• Application doesn't have any validations for the input value to make sure weather it's a number or not .
• The is at least one test case that has passed for all the types of triangles

Many testers with so much information available now for testing still trying to attack on the system with negative tests (people used to call it as negative testing) to uncover some issues on the first phase itself. Even though we uncover many issues there it won't be worth trying out the same without exploring the basic functionality of the application.

Let's explore the application with some more Tests

The side of the triangle must be a numeric value. So the application should allow only that kind of data. Application must draw the triangle with in the area given for the same.

• Try with 6,8,11 – draws out side the box
• Try with 3,4,5 – Right Angled
• Try with 6,8,10 – Scalene- // Why so. why can't it be right angled ?
• Try with 3,5,10 – Scalene // what ? Basic violation of thumb rules. it must be invalid. more over it just draws a single line and not a triangle
• Try with 6,7,15 – same as above

There are couple of critical bugs here. For an input data which supposed to be invalid, treated as a triangle and other one is that it draws the triangle out of the box.

So there must be some goof up happened while handling the conditions on input data to satisfy them as valid or invalid. This has been proved now with the way that the above tests revealed the application behavior.

Let's do some code based testing now since it's a java script and the whole code is available.

Step6: White Box testing on the Application

Let's look at some important piece of the code.

if (this.s1 >= this.s2 + this.s3) {

 return "Invalid";

}if ((this.s3 == this.s2) && (this.s2 == this.s1)) {

 return "Equilateral";

}

if (Math.pow(this.s1, 2) == (Math.pow(this.s2, 2) + (Math.pow(this.s3, 2)))) {
 
 return "Right";

}

if ((this.s3 != this.s2) && (this.s2 != this.s1)) {

 return "Scalene";

} else {

 return "Isosceles";

}

The above code helps us to get the type of triangle based on the input data. Some observations from the above code

• If there are no validations for the input values, then it's going to be a major problem. Think of the scenarios like (0,0,0) or (-2,3,4)
• For this (this.s1 >= this.s2 + this.s3) condition we need to assume that the input data must be sorted from max to min being the s1 as max value and s3 as min value. Else this is going to be big blowup

Look at this bunch:

Triangle.prototype.setSides = function(s1, s2, s3) {

	sides = [s1, s2, s3];

 sides = sides.sort();	this.s1 = Number(sides[2]);

 this.s2 = Number(sides[1]);

 this.s3 = Number(sides[0]);

this.scale = 310/this.s1;

 this.scaledSide1 = this.scale * this.s1;
 
 this.scaledSide2 = this.scale * this.s2;

 this.scaledSide3 = this.scale * this.s3;

};

It's reading the input data, sort it and assign the same for the values for the edges. I am concerned about the sort() method here. It's a block box for us and need to explore on what it does. Other piece of does simple operations.

Let's ask the google again for some help here. Find some important reading here on the sort method.

Oh my god. This is the problem. It's doing a generic sort and not tuned towards the numeric sort. So this is the root cause of all the issues. It's such an issue that even a programmer might over look the same by it's nature

Find some info on how JavaScript sort works below from the link

Example

In this example we will create an array containing numbers and sort it:

<script type="text/javascript"> var arr = new Array(6)arr[0] = "10"arr[1] = "5" arr[2] = "40" arr[3] = "25" arr[4] = "1000" arr[5] = "1" document.write(arr + "<br />")document.write(arr.sort()) </script>

The output of the code above will be:

10,5,40,25,1000,11,10,1000,25,40,5

Note that the numbers above are NOT sorted correctly (by numeric value). To solve this problem, we must add a function that handles this problem:

<script type="text/javascript"> function sortNumber(a,b){return a - b } var arr = new Array(6)arr[0] = "10"arr[1] = "5" arr[2] = "40" arr[3] = "25" arr[4] = "1000" arr[5] = "1" document.write(arr + "<br />")document.write(arr.sort(sortNumber)) </script>

The output of the code above will be:

10,5,40,25,1000,11,5,10,25,40,1000

Step7: Summary:

I have taken a this approach for this application since it's simple to apply & explore in this context. It's good to always start exploring the applications by gathering information from all walks.

Keep getting the info, fine tune your tests and observe the application behavior. Set the base ground right and dig more and keep digging. You are bound to uncover all the important issues with the application.