DataGrid - Fixes showing error when reject is called in stateStoring.…

…customLoad (T894590) (#13328)
DevExpress · Jun 5, 2020 · 6324758 · 6324758
1 parent 53b90a7
commit 6324758
Show file tree

Hide file tree

Showing 3 changed files with 108 additions and 19 deletions.
diff --git a/js/ui/grid_core/ui.grid_core.state_storing.js b/js/ui/grid_core/ui.grid_core.state_storing.js
@@ -246,25 +246,29 @@ module.exports = {
                     return this.callBase().concat(['stateLoaded']);
                 },
                 _refreshDataSource: function() {
-                    const that = this;
-                    const callBase = that.callBase;
-                    const stateStoringController = that.getController('stateStoring');
+                    const callBase = this.callBase;
+                    const stateStoringController = this.getController('stateStoring');
 
                     if(stateStoringController.isEnabled() && !stateStoringController.isLoaded()) {
-                        clearTimeout(that._restoreStateTimeoutID);
+                        clearTimeout(this._restoreStateTimeoutID);
 
                         const deferred = new Deferred();
-                        that._restoreStateTimeoutID = setTimeout(function() {
-                            stateStoringController.load().always(function() {
-                                that._restoreStateTimeoutID = null;
-                                callBase.call(that);
-                                that.stateLoaded.fire();
+                        this._restoreStateTimeoutID = setTimeout(() => {
+                            stateStoringController.load().always(() => {
+                                this._restoreStateTimeoutID = null;
+                            }).done(() => {
+                                callBase.call(this);
+                                this.stateLoaded.fire();
                                 deferred.resolve();
+                            }).fail(error => {
+                                this.stateLoaded.fire();
+                                this._handleLoadError(error || 'Unknown error');
+                                deferred.reject();
                             });
                         });
                         return deferred.promise();
-                    } else if(!that.isStateLoading()) {
-                        callBase.call(that);
+                    } else if(!this.isStateLoading()) {
+                        callBase.call(this);
                     }
                 },
 

diff --git a/js/ui/grid_core/ui.grid_core.state_storing_core.js b/js/ui/grid_core/ui.grid_core.state_storing_core.js
@@ -68,6 +68,7 @@ exports.StateStoringController = modules.ViewController.inherit((function() {
             try {
                 getStorage(options).setItem(getUniqueStorageKey(options), JSON.stringify(state));
             } catch(e) {
+                errors.log(e.message);
             }
         },
 
@@ -106,14 +107,13 @@ exports.StateStoringController = modules.ViewController.inherit((function() {
         },
 
         load: function() {
-            const that = this;
-
-            that._isLoading = true;
-            const loadResult = fromPromise(that._loadState());
-            loadResult.done(function(state) {
-                that._isLoaded = true;
-                that._isLoading = false;
-                that.state(state);
+            this._isLoading = true;
+            const loadResult = fromPromise(this._loadState());
+            loadResult.always(() => {
+                this._isLoaded = true;
+                this._isLoading = false;
+            }).done((state) => {
+                this.state(state);
             });
             return loadResult;
         },

diff --git a/testing/tests/DevExpress.ui.widgets.dataGrid/dataGrid.tests.js b/testing/tests/DevExpress.ui.widgets.dataGrid/dataGrid.tests.js
@@ -8768,6 +8768,91 @@ QUnit.module('Initialization', baseModuleConfig, () => {
         // assert
         assert.notOk(onScrollHandler.called, 'onScroll handler is not called');
     });
+
+    QUnit.test('Error row should be shown when state loading failed (T894590)', function(assert) {
+        // arrange
+        const errorText = 'test error';
+        const contentReadyHandler = sinon.spy();
+        const dataErrorOccurred = sinon.spy();
+        const gridOptions = {
+            dataSource: [{ id: 1 }],
+            columns: ['id'],
+            stateStoring: {
+                enabled: true,
+                type: 'custom',
+                customLoad: function() {
+                    return $.Deferred().reject(errorText).promise();
+                }
+            },
+            onContentReady: contentReadyHandler,
+            onDataErrorOccurred: dataErrorOccurred
+        };
+        const dataGrid = createDataGrid(gridOptions);
+        this.clock.tick();
+
+        const $headerRow = $(dataGrid.element()).find('.dx-header-row');
+        const $errorRow = $(dataGrid.element()).find('.dx-error-row');
+        const renderedRowCount = dataGrid.getVisibleRows().length;
+
+        // assert
+        assert.ok(contentReadyHandler.called, 'onContentReady is called');
+        assert.equal(dataErrorOccurred.callCount, 1, 'onDataErrorOccurred is called');
+        assert.equal(dataErrorOccurred.getCall(0).args[0].error, errorText, 'error text is correct');
+        assert.equal(renderedRowCount, 0, 'there are no rendered data rows');
+        assert.ok($headerRow.length, 'header row is rendered');
+        assert.ok($errorRow.length, 'error row is rendered');
+        assert.equal($errorRow.find('.dx-error-message').text(), errorText, 'error text is correct');
+    });
+
+    QUnit.test('Error row should display the default error message when reject is called without a parameter in stateStoring.customLoad (T894590)', function(assert) {
+        // arrange
+        const gridOptions = {
+            dataSource: [],
+            columns: ['id'],
+            stateStoring: {
+                enabled: true,
+                type: 'custom',
+                customLoad: function() {
+                    return $.Deferred().reject().promise();
+                }
+            }
+        };
+        const dataGrid = createDataGrid(gridOptions);
+        this.clock.tick();
+
+        const $errorRow = $(dataGrid.element()).find('.dx-error-row');
+
+        // assert
+        assert.ok($errorRow.length, 'error row is rendered');
+        assert.equal($errorRow.find('.dx-error-message').text(), 'Unknown error', 'default error message');
+    });
+
+    QUnit.test('Error row should not be displayed when reject is called in stateStoring.customLoad and errorRowEnabled === false (T894590)', function(assert) {
+        // arrange
+        const dataErrorOccurred = sinon.spy();
+        const gridOptions = {
+            dataSource: [],
+            columns: ['id'],
+            errorRowEnabled: false,
+            stateStoring: {
+                enabled: true,
+                type: 'custom',
+                customLoad: function() {
+                    return $.Deferred().reject().promise();
+                }
+            },
+            onDataErrorOccurred: dataErrorOccurred
+        };
+        const dataGrid = createDataGrid(gridOptions);
+        this.clock.tick();
+
+        const $errorRow = $(dataGrid.element()).find('.dx-error-row');
+
+        // assert
+        assert.equal(dataErrorOccurred.callCount, 1, 'onDataErrorOccurred is called');
+        assert.equal(dataErrorOccurred.getCall(0).args[0].error, 'Unknown error', 'default error message');
+        assert.notOk($errorRow.length, 'error row is not rendered');
+    });
 });