ag-grid renders extra blank column right to the last column

Question

I use ag-grid with Angular 1.5 and I have defined 5 columns in the following format in an array:

[
{headerName: 'Username', width: 150, field: 'username'},
{headerName: 'Full Name', width: 150, field: 'full_name'},
{headerName: 'Location', width: 150, field: 'location'},
{headerName: 'Email', width: 150, field: 'email'},
{headerName: 'Check In Comment', width: 370, field: 'comment'},
];

The rendering shows 6 columns with the right-most one being blank. I've tried everything, but I cannot still remove the blank column. See the :

gridOptions:

options = {
                rowData: dataArray,
                rowModelType: 'pagination',
                columnDefs: getColumnDefs(),
                enableColResize: true,
                enableSorting: false,
                enableFilter: true,
                rowHeight: 25,
                angularCompileRows: true,
                suppressRowClickSelection: true
            };

The html code:

<div style="width: 100%;"
                     ag-grid="vm.gridOptions"
                     class="ag-fresh ag-basic">
                </div>

I wonder how to remove the blank column right to the 'Check In Comment' column. any ideas?

Answer 1

Have you tried gridOptions.api.sizeColumnsToFit() ?

Source (7min 50sec)

Answer 2

extra column is there even if we use that api gridOptions.api.sizeColumnsToFit().