UI-grid wrap-text in each cell

Using angularjs ui-grid, I have increased the rowHeight of the grid. I need to wrap the text in each cell and I need to get rid of the text truncation.

example http://plnkr.co/edit/9aoV9rkjf9eKpTjcAaC5?p=preview  

Word wrap need to be done in name and description column.

You need to remove

 -ms-text-overflow: ellipsis;
  -o-text-overflow: ellipsis;
  text-overflow: ellipsis;

from

.ui-grid-cell-contents

and use word-break: break-all;

.ui-grid-cell-contents {
  padding: 5px;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;

  word-break: break-all;
  overflow: hidden;
  height: 100%;
}

main.css:

.grid {
  width: 100%;
  height: 400px;
}
.ui-grid-cell-contents-break {
   padding: 5px;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;


  overflow: hidden;
  height: 100%;

  word-break: break-all;
}

app.js:

$scope.gridOptions.columnDefs = [
    { name: 'id' },
    { name: 'name'},
    { name: 'description',cellTemplate:'<div class="ui-grid-cell-contents-break"> This is the test Description</div>'},
    { name: 'age', displayName: 'Age (not focusable)', allowCellFocus : false },
    { name: 'address.city' }
  ];

Plunker: http://plnkr.co/edit/6wDxSAfP8AE6zial4vhw?p=preview