Pages

Wednesday, April 24, 2013

Deep object comparison of complex objects for unit tests

Decided to post this because I had fun writing this code, however I think it will bring good use to you too.

While implementing functionality for creating/merging/converting  complex data objects I had to backup myself with unit tests. First of all to test if it is working correctly, secondly to be more confident when new requirements or the need of refactoring appears.

In the tests you usually have to compare the actual result and expected result of some logic. In my case these result where complex data objects. And there is no standard generic mechanism in .NET for comparing 2 complex objects, for example instances of such class:

Here is the implementation checking for checking equality that I came out with:

Please note that this was added and was used only for tests.
If you had the same problem and came with a better solution be kind to share it.

Saturday, February 2, 2013

Structuring view specific JS and CSS files


While using the default VS template for ASP.NET MVC that is provided it seems obvious to store all of the JS files under the script folder and the CSS under the content. However when you have more than 10 JS or CSS files that are related to specific views than  the navigation between the view and the JS or CSS file becomes not that pleasant, at least that’s what I have experienced.
Try imagining how you should navigate through such file structure:
         
To make the app more maintainable and more transparent it is better to place the JS or CSS file that is related to a specific view in the same folder with that view. So the structure looks something like this:
       
The file structure above looks more transparent.
There are a couple of things that should be done before placing files in such a way.
By default in ASP.NET MVC JavaScript or CSS files cannot be accessed if they are placed under the Views folder. For accessing JS and CSS files that are under the Views folder the Web.config file that is in the Views folder should be extended.
This is how it should look:
After this change you are ready to go.

Sunday, January 6, 2013

Solving the JSON Serialization "A circular reference was detected ... " error OR how to flatten you domain entities

I mostly work with ASP.NET MVC and EF Code First is used as the ORM. Recently I had a chance to work on an application that required a lot of client side JS logic. A REST approach for this application seemed as the best solution.
And I have started running into the Json Serialization error “A circular reference was detected while serializing an object of type ‘object name’  ” while passing an entity as a JSON object to the client in ASP.NET MVC...

So I was just passing the entity as a JSON object to the client. Everything went well until I started passing complex entities that had dependencies with entities that were referencing the complex entity and this was forming a circular reference. And because of this “A circular reference was detected while serializing an object of type ‘object name’  ” error occurred.

Here is an example of such entities: 
In my case all of the domain entities are derived from a base class. You can see that from the code above. Here is how the base class looks:
And on the client side I’m always working with a flattened entity. While having such an entity only these properties were used, properties that have a primitive types:
Also most of the properties (ID and Deleted) that are inherited from the base class are used on the client side.
So a mechanism for flattening the entities had to be implemented.
This was done with the help of Reflection and AutoMapper.
Here is how it looked:
Now in the AutoMapper boostrapper file of the project this code should be added.

Lets say that all the domain classes are in the "App.Domain.*" namespace. The code above flattens all the entities that are derived from the specified base class and the nampespace prefix where the namespace prefix is "App".
So if you want to pass a flattened JSON object to the client just map the entity to itself like this:


This solution is a good fit when you are mostly working with flattened entities of you domain model on the client side.

Monday, February 20, 2012

Using jQueryUI accordion to create a vertical menu

A majority of web applications need a navigation menu and there are a lot plugins out the to create a great menu. In my case I had to create a vertical navigation menu with some expanding and collapsing behavior.

There are a lot of solutions for creating such a menu. I was already using  jQuery UI and decided to use the accordion for this purpose. This is what happened…
Lets say that we have a simple site were we have a home, projects and about me pages and we need to create a vertical navigation menu for it using jQuery UI.

The first step was to create a accordion with the navigation links:



We have to initialize the navigationMenu as an accordion :




Ok, now we can some code for customizing the navigation accordion. Lets decorate the menu headers and divs that don’t need to be collapsible and single with a class=“single-menu-item” for headers and class=”single-menu-container” for the divs:




We have unbind the click event from the single-menu element:




And as a last step we have to create some css rules for single-menu-item and single-menu-container that will rewrite the standard behavior of the jquery accordion:



This was the last step.


Now we have a vertical navigation menu! You can find the code of this example HERE.

If you have great example of implementing a vertical navigation menu with jQuery please write some links down in the comment