Getting started with .NET unit testing using NUnit

It’s usually good practice to have automated unit tests while developing your code. Doing so helps you find bugs early in the development cycle and saves you time in the long run. These tests can be run by the developer multiple times to verify the behavior of a particular unit of code for different sets of input.

Unit tests essentially check the behavior of a particular unit of the code or the function, and are written by the developers who are implementing the functionalities.

image

We test the behavior of a function before it becomes part of the whole system and goes to production by writing a piece of code to test this behavior under different conditions. Usually a function gets tested in isolation with the other functions of the system under test (SUT).

Read full article on the Infragistics blog

How to Unit Test Private Methods in MS Test

Before we start to see, how a private method can be unit tested using the MS Test? Let us discuss whether it is a good idea to test a private method or not? Often I have seen there are two school of thoughts,

  1. Private methods should be tested.
  2. Private methods should not be tested.

To put these things in perspective, let us consider a system under test (SUT) Salary class as shown in the listing below.

image

A system under test Salary class has two functions:

  1. The CalculateSal method is a public method and it takes two parameters to calculate the salary
  2. The isValidwd method is a private method and it takes one parameter. This function returns true if the number of working days are more than 8, or else it returns false.
  3. The CalculateSal method first checks whether the number of working days is valid or not using the private method isValidWd.
  4. If the number of working days is valid, then salary is calculated by the multiplication of basic salary and the number of working days, or else it is fixed at $1000.

Read full article on the Infragistics blog

How to create an Azure-based real time Chat Application using Firebase and jQuery

In this post, we’re going to show you step by step instructions on how to create a Chat application that’s similar to a group chat messenger where many people at any given time can read and send messages with the group. In this example we’re going to use the following technologies:

  1. Firebase
  2. HTML
  3. Bootstrap
  4. jQuery

Eventually we will host the application on the Microsoft Azure website, and we’ll use Visual Studio IDE to develop the application.

You can see the real time chat application we are going to build in this article live at: http://igchatapp.azurewebsites.net/chat.html . Feel free to chat with us at this URL!

Setting up Firebase

Register on https://www.firebase.com/ and login to access the Firebase portal. In the right hand side, you’ll find the option to create a new app. Give your app a name and the URL to create a new app in Firebase.

Read the full article on the Infragistics blog

Exploring Angular’s “Controller as” Syntax and the vm Variable

Read full article on the Infragistics blog

Often, I hear developers ask “What is the ‘controller as’ syntax and how it is different from the $scope object approach of controller creation?” In this post we will learn about controller as syntax and compare it with the $scope object approach of controller creation.

In AngularJS 1.2, the “controller as” syntax was introduced, and made controller code creation more readable. Let’s see both approaches in action below:

Creating a controller using the $scope object

Usually we create a controller using the $scope object as shown in the listing below:

image

Above we are creating the AddController with three variables and one behaviour, using the $scope object controller and view, which talk to each other. The $scope object is used to pass data and behaviour to the view. It glues the view and controller together.

Essentially the $scope object performs the following tasks:

  1. Pass data from the controller to the view
  2. Pass behaviour from the controller to the view
  3. Glues the controller and view together
  4. The $scope object gets modified when a view changes and a view gets modified when the properties of the $scope object change

We attach properties to a $scope object to pass data and behaviour to the view. Before using the $scope object in the controller, we need to pass it in the controller function as dependencies.

Using the “controller as” syntax and vm

We can rewrite the above controller using the controller as syntax and the vm variable as shown in the listing below:

image

Read full article on the Infragistics blog

Simplifying the Liskov Substitution Principle of SOLID in C#

Before I start writing this article, I want to thank Steve Smith for his great course on the same topic with Pluralsight. This post is inspired by that course.

Read full article on the Infragistics blog here

The Liskov Substitution Principle says that the object of a derived class should be able to replace an object of the base class without bringing any errors in the system or modifying the behavior of the base class.

In short: if S is subset of T, an object of T could be replaced by object of S without impacting the program and bringing any error in the system. Let’s say you have a class Rectangle and another class Square. Square is as Rectangle, or in other words, it inherits the Rectangle class. So as the Liskov Substitution principle states, we should able to replace object of Rectangle by the object of Square without bringing any undesirable change or error in the system.

Let’s take a closer look at this principle with some examples.

Understanding the problem

Let us say we have two classes, Rectangle and Square. In this example, the Square class inherits the Rectangle class. Both classes are created as listed below:

image

The Square class inherits the Rectangle class and overrides the properties as shown in the listing below:

image

Read full article on the Infragistics blog here

How to work with the Bootstrap DropDown in AngularJS

Read full article on the Infragistics blog

In this post we will learn how to work with the Bootstrap dropdown in an AngularJS APP. In a step by step by approach, we’ll cover how to:

  1. Bind a dropdown with the controller;
  2. Select an item in the drop down and pass to controller;
  3. Bind a dropdown with the Web API

Bootstrap dropdown

A simple bootstrap dropdown button can be created as shown in the listing below:

image

In the dropdown we’ve created above, we will be navigated to another view or page on selecting an item and all the items are hard coded in the dropdown.

Bootstrap dropdown with AngularJS controller data

Now let us assume that we need to create a bootstrap dropdown in the AngularJS application. To create that, first we need to make sure that the reference of bootstrap CSS is added in the project, as shown in the listing below:

image 

Next let us create AngularJS controller. In the controller there is an array called subjects which will be bound to the bootstrap dropdown. The controller can be created as shown in the listing below:

image

Read full article on the Infragistics blog

Understanding scopes in AngularJS custom Directives

Read full article on the Infragistics blog

In this post we will learn about different kinds of scopes in AngularJS custom directives. First we’ll start with a high level introduction of directives and then focus on scopes.

Directives

Directives are one of the most important components of AngularJS 1.X, and have the following purposes:

  1. Gives special meaning to the existing element
  2. Creates a new element
  3. Manipulates the DOM

Mainly, directives perform either of the following tasks:

Manipulate DOM

  • Iterate through data
  • Handle events
  • Modify CSS
  • Validate data
  • Data Binding

Even though there are many built-in directives provided by the Angular team, there are times when you might need to create your own custom directives. A custom directive can be created either as an element, attribute, comment or class. In this post, a very simple custom directive can be created as shown in the listing below:

image

While creating custom directives, it’s important to remember:

  • The directive name must be in the camel case;
  • On the view, the directive can be used by separating the camel case name by using a dash, colon, underscore, or a combination of these.

Scopes in Custom Directives

Scopes enter the scene when we pass data to custom directives. There are three types of scopes:

  1. Shared scope
  2. Inherited scope
  3. Isolated scope

Read full article on the Infragistics blog

A Step-by-Step Guide to Working with the ASP.NET Web API and AngularJS

Read full article on the Infragistics blog

In this post we will learn to work with AngularJS and ASP.NET Web API in a step by step manner. I’ll assume that you are already familiar with some of the basic terms like what AngularJS and a Web API is, and we’ll work in a hands-on way, fetching data from the database and displaying that in an AngularJS application using the following:

  • Database in the SQL Server
  • Data model using Entity Framework database-first approach
  • The ASP.NET Web API
  • Using the Web API in an AngularJS application

Essentially, data resides in the SQL Server database and is exposed as JSON data using the ASP.NET Web API. We then consume the JSON data from the ASP.NET Web API in the AngularJS application.

Setting up the Database

Here we have a table named city with the following columns:

The table is populated with the following data:

This table is inside the SQL Server, and we’ll connect to SQL Server using the Entity Framework database first approach.

ASP.NET Web API

Let us go ahead and create a Web API project in Visual Studio. To do this, select File->New Project-> Web Application>Web API as shown in the image below.

On clicking Ok, we can verify in the solution explorer that a web API project has been created.

Creating the Data Model

Next, to create the data model we’re going to follow the Entity Framework database first approach. To do this, right click on the Model folder in the project and select Add new item.

Read full article on the Infragistics blog