diff --git a/src/app/components/noosfero-boxes/boxes.component.spec.ts b/src/app/components/noosfero-boxes/boxes.component.spec.ts
new file mode 100644
index 0000000..cdd2ff4
--- /dev/null
+++ b/src/app/components/noosfero-boxes/boxes.component.spec.ts
@@ -0,0 +1,69 @@
+import {providers} from 'ng-forward/cjs/testing/providers';
+
+import {Input, Component} from 'ng-forward';
+
+import {Box, Profile} from "../../models/interfaces";
+import {Boxes} from './boxes.component';
+
+import {
+    createComponentFromClass,
+    quickCreateComponent,
+    provideEmptyObjects,
+    createProviderToValue,
+    getAngularServiceFactory,
+    provideFilters
+} from "../../../spec/helpers";
+
+// this htmlTemplate will be re-used between the container components in this spec file
+const htmlTemplate: string = '<noosfero-boxes [boxes]="ctrl.boxes" [owner]="ctrl.profile"></noosfero-blog>';
+
+
+describe("Boxes Component", () => {
+
+    beforeEach(() => {
+        angular.mock.module("templates")
+    })
+
+    @Component({
+        selector: 'test-container-component',
+        template: htmlTemplate,
+        directives: [Boxes],
+        providers: []
+    })
+    class BoxesContainerComponent {
+        boxes: Box[] = [
+            { id: 1, position: 1 },
+            { id: 2, position: 2 }
+        ];
+
+        owner: Profile = {
+            id: 1,
+            identifier: 'profile-name',
+            type: 'Person'
+        };
+    }
+
+    it("renders boxes into a container", (done: Function) => {
+        createComponentFromClass(BoxesContainerComponent).then((fixture) => {
+
+            var boxesHtml = fixture.debugElement;
+            expect(boxesHtml.query('div.col-md-7').length).toEqual(1);
+            expect(boxesHtml.query('div.col-md-2-5').length).toEqual(1);
+
+            done();
+        });
+    });
+
+    it("check the boxes order", (done: Function) => {
+        createComponentFromClass(BoxesContainerComponent).then((fixture) => {
+
+            let boxesComponent: Boxes = fixture.debugElement.componentViewChildren[0].componentInstance;
+            let boxesContainer: BoxesContainerComponent = fixture.componentInstance;
+
+            expect(boxesComponent.boxesOrder(boxesContainer.boxes[0])).toEqual(1);
+            expect(boxesComponent.boxesOrder(boxesContainer.boxes[1])).toEqual(0);
+
+            done();
+        });
+    });
+});
diff --git a/src/app/components/noosfero-boxes/boxes.component.ts b/src/app/components/noosfero-boxes/boxes.component.ts
index ddce12f..085cad1 100644
--- a/src/app/components/noosfero-boxes/boxes.component.ts
+++ b/src/app/components/noosfero-boxes/boxes.component.ts
@@ -1,13 +1,14 @@
-import { Input, Inject, Component } from 'ng-forward';
-import {Box} from "./../../models/interfaces";
+import {Input, Inject, Component} from 'ng-forward';
+import {Box, Profile} from "./../../models/interfaces";
+
 @Component({
     selector: "noosfero-boxes",
     templateUrl: "app/components/noosfero-boxes/boxes.html"
 })
 export class Boxes {
 
-    @Input() boxes: any;
-    @Input() owner: any;
+    @Input() boxes: Box[];
+    @Input() owner: Profile;
 
     boxesOrder(box: Box) {
         if (box.position === 2) return 0;
--
libgit2 0.21.2