Grid summary row missing colgroup

I just tried using the summary feature for a grid, wherein the store is dynamically populated using user inputs, when the summary value of a column is too long it doesn't get ellipsis like normal columns. After investigating the dom structure i found that the summary row table doesn't contain a colgroup. I have even tried it on the docs page for summary feature, when the column value is too long it stretches the column in the summary row instead.

Code:

Ext.define('TestResult', {
    extend: 'Ext.data.Model',
    fields: ['student', {
        name: 'mark',
        type: 'int'
    }]
});


Ext.create('Ext.grid.Panel', {
    width: 400,
    height: 200,
    columnLines: true,
    title: 'Summary Test',
    style: 'padding: 20px',
    renderTo: document.body,
    features: [{
        dock: 'bottom',
        ftype: 'summary'
    }],
    store: {
        model: 'TestResult',
        data: [{
            student: 'Student 1',
            mark: 840000
        },{
            student: 'Student 2',
            mark: 720000
        },{
            student: 'Student 3',
            mark: 960000
        },{
            student: 'Student 4',
            mark: 680000
        }]
    },
    columns: [{
        dataIndex: 'student',
        text: 'Name',
        summaryType: 'count',
        summaryRenderer: function(value, summaryData, dataIndex) {
            return Ext.String.format('{0} student{1}', value, value !== 1 ? 's' : '');
        }
    }, {
        dataIndex: 'mark',
        text: 'Mark',
        width: 60,
        summaryType: 'sum'
    }]
});

Grid summary row missing colgroup