add extjs 6.0.1 sources

[extjs.git] / extjs / classic / classic / test / specs / grid / filters / filter / DateTime.js

xdescribe('Ext.grid.filters.filter.DateTime', function () {\r
    var viewReady = false,\r
        grid, plugin, store;\r
\r
    function createGrid(pluginCfg, gridCfg, storeCfg) {\r
        store = new Ext.data.Store(Ext.apply({\r
            fields:['name', 'email', 'phone', { name: 'dob', type: 'date'}],\r
            data: [\r
                { 'name': 'evan',  'email':'evan@example.com',  'phone':'555-111-1224', 'dob': '12/12/1992 01:00' },\r
                { 'name': 'nige',  'email':'nige@example.com',  'phone':'555-222-1234', 'dob': '12/12/1992 02:00' },\r
                { 'name': 'phil', 'email':'phil@example.com', 'phone':'555-222-1244', 'dob': '12/12/1992 03:15' },\r
                { 'name': 'don', 'email':'don@example.com', 'phone':'555-222-1254', 'dob': '12/12/1992 04:30' },\r
                { 'name': 'alex', 'email':'alex@example.com', 'phone':'555-222-1254', 'dob': '12/12/1992 13:00' },\r
                { 'name': 'ben', 'email':'ben@example.com', 'phone':'555-222-1264', 'dob': '12/12/1992 22:45' }\r
            ],\r
            autoDestroy: true\r
        }, storeCfg));\r
\r
        plugin = new Ext.grid.filters.Filters(Ext.apply({\r
            updateBuffer: 0\r
        }, pluginCfg || {}));\r
\r
        grid = new Ext.grid.Panel(Ext.apply({\r
            store: store,\r
            columns: [\r
                { header: 'Name',  dataIndex: 'name', width: 100 },\r
                { header: 'Email', dataIndex: 'email', width: 100 },\r
                { header: 'Phone', dataIndex: 'phone', width: 100 },\r
                { header: 'DOB', dataIndex: 'dob', xtype: 'datecolumn', format: 'd/m/Y G:i', width: 100,\r
                    filter: {\r
                        type: 'datetime',\r
                        time: {\r
                            format: 'G:i'\r
                        },\r
                        dock: {\r
                            buttonText: 'Filter',\r
                            dock: 'bottom'\r
                        }\r
                    }\r
                }\r
            ],\r
            plugins: plugin,\r
            height: 200,\r
            width: 400,\r
            listeners: {\r
                viewready: function () {\r
                    viewReady = true;\r
                }\r
            },\r
            renderTo: Ext.getBody()\r
        }, gridCfg));\r
    }\r
\r
    afterEach(function () {\r
        Ext.destroy(grid);\r
        grid = plugin = store = null;\r
        viewReady = false;\r
    });\r
\r
    describe('setValue', function () {\r
        var parse = Ext.Date.parse,\r
            columnFilter;\r
\r
        afterEach(function () {\r
            columnFilter = null;\r
        });\r
\r
        it('should update the value of the date whenever called', function () {\r
            // See EXTJSIV-11532.\r
            createGrid();\r
\r
            waitsFor(function () {\r
                return viewReady;\r
            });\r
\r
            runs(function () {\r
                columnFilter = grid.columnManager.getHeaderByDataIndex('dob').filter;\r
                columnFilter.createMenu();\r
\r
                columnFilter.setValue({eq: parse('08/08/1992', 'd/m/Y')});\r
                columnFilter.setValue({eq: parse('26/09/2009', 'd/m/Y')});\r
\r
                expect(columnFilter.filter.eq.getValue()).toBe(parse('26/09/2009', 'd/m/Y').getTime());\r
            });\r
        });\r
    });\r
\r
    describe('onMenuSelect handler and setFieldValue', function () {\r
        var columnFilter, headerCt, header, filtersCheckItem, beforeCheckItem, datepicker, timepicker, btn;\r
\r
        afterEach(function () {\r
            columnFilter = headerCt = header = filtersCheckItem = beforeCheckItem = datepicker = timepicker = btn = null;\r
        });\r
\r
        it('should correctly filter based upon picker selections', function () {\r
            createGrid();\r
\r
            waitsFor(function () {\r
                return viewReady;\r
            });\r
\r
            runs(function () {\r
                columnFilter = grid.columnManager.getHeaderByDataIndex('dob').filter;\r
                headerCt = grid.headerCt;\r
                header = grid.getColumnManager().getLast();\r
\r
                // Show the grid menu.\r
                headerCt.showMenuBy(null, header.triggerEl.dom, header);\r
\r
                // Show the filter menu.\r
                filtersCheckItem = headerCt.menu.items.last();\r
                filtersCheckItem.activated = true;\r
                filtersCheckItem.expandMenu(null, 0);\r
\r
                // Show the DateTime container.\r
                beforeCheckItem = filtersCheckItem.menu.items.first();\r
                beforeCheckItem.activated = true;\r
                beforeCheckItem.expandMenu(null, 0);\r
\r
                // Finally, get the refs to the components we need to test.\r
                datepicker = beforeCheckItem.menu.down('datepicker');\r
                timepicker = beforeCheckItem.menu.down('timepicker');\r
                btn = beforeCheckItem.menu.down('button[text="Filter"]');\r
\r
                datepicker.setValue(new Date('12/12/1992'));\r
                timepicker.select(timepicker.store.getAt(5));\r
                btn.el.dom.click();\r
\r
                // The filtering is async.\r
                waits(1);\r
\r
                runs(function () {\r
                    expect(store.getCount()).toBe(1);\r
\r
                    timepicker.select(timepicker.store.getAt(9));\r
                    btn.el.dom.click();\r
                });\r
\r
                waits(1);\r
\r
                runs(function () {\r
                    expect(store.getCount()).toBe(2);\r
                });\r
            });\r
        });\r
    });\r
});\r