Release 18.1.4

Cherry-picked changesets:
  72c302a Alexander Komarov - DataGrid: Fix conversion of columns in the filterBuilder fields (T642913, T646561) (#4401)
  7a38aad Konstantin Volnyagin - DataGrid: Fix routing in angular when a user clicks command column links (T643785) (#4413)
  289a62b Alexander Komarov - DataGrid: Fix closing of 'any of' operation popup when jquery is not using (T646013) (#4415)
  e42dd1e Alexander Komarov - DataGrid: Clear timeouts and check null ref in test after #4415 (#4417)
  7e088e3 Sergey Zvyagin - Fix title alignment (bar gauges) and margins for all viz widgets in Material theme (#4405)
  719a4bf Dmitry Semenov - Revert "fix a user's validation rules of Validator (#4368)" (#4434)

js/ui/filter_builder/utils.js

@@ -661,7 +661,7 @@ function isValidCondition(condition, field) {
 
 function setFocusToBody() {
     var doc = domAdapter.getDocument();
-    if(doc && doc.activeElement && doc.activeElement.nodeName.toLowerCase() !== "body") {
+    if(doc && doc.activeElement && doc.activeElement.nodeName && doc.activeElement.nodeName.toLowerCase() !== "body") {
         doc.activeElement.blur();
     }
 }

js/ui/grid_core/ui.grid_core.editing.js

@@ -1628,7 +1628,7 @@ var EditingController = modules.ViewController.inherit((function() {
         _createLink: function(container, text, methodName, options, useIcon) {
             var that = this,
                 $link = $("<a>")
-                .attr("href", "#")
+                    .attr("href", "#")
                     .addClass(LINK_CLASS)
                     .addClass(EDIT_LINK_CLASS[methodName]);
 
@@ -1644,6 +1644,7 @@ var EditingController = modules.ViewController.inherit((function() {
                 var e = params.event;
 
                 e.stopPropagation();
+                e.preventDefault();
                 setTimeout(function() {
                     options.row && that[methodName](options.row.rowIndex);
                 });

js/ui/grid_core/ui.grid_core.filter_builder.js

@@ -55,7 +55,7 @@ var FilterBuilderView = modules.View.inherit({
     },
 
     _getFilterBuilderFields: function() {
-        return this.getController("columns").getColumns().map(item => {
+        return this.getController("columns").getFilteringColumns().map(item => {
             let column = extend(true, {}, item);
             column.filterOperations = item.filterOperations !== item.defaultFilterOperations ? column.filterOperations : null;
             return column;

js/ui/grid_core/ui.grid_core.filter_custom_operations.js

@@ -3,6 +3,7 @@
 import { renderValueText } from "../filter_builder/filter_builder";
 
 var $ = require("../../core/renderer"),
+    eventsEngine = require("../../events/core/events_engine"),
     messageLocalization = require("../../localization/message"),
     extend = require("../../core/utils/extend").extend,
     DataSourceModule = require("../../data/data_source/data_source"),
@@ -93,7 +94,7 @@ function baseOperation(grid) {
                     headerFilterController.hideHeaderFilterMenu();
                 },
                 onHidden: function() {
-                    $("body").trigger("dxpointerdown");
+                    eventsEngine.trigger($("body"), "dxpointerdown");
                 },
                 isFilterBuilder: true
             });

js/ui/validator.js

@@ -224,7 +224,8 @@ var Validator = DOMComponent.inherit({
             value = adapter.getValue(),
             currentError = adapter.getCurrentValidationError && adapter.getCurrentValidationError(),
             rules = map(that.option("validationRules"), function(rule) {
-                return extend({}, rule, { validator: that });
+                rule.validator = that;
+                return rule;
             }),
 
             result;

js/viz/core/themes/material.js

@@ -16,7 +16,12 @@ registerTheme({
         family: FONT_FAMILY
     },
     title: {
-        margin: 20,
+        margin: {
+            top: 20,
+            bottom: 20,
+            left: 0,
+            right: 0
+        },
         font: {
             size: 20,
             family: FONT_FAMILY,
@@ -91,6 +96,15 @@ registerTheme({
         }
     },
 
+    barGauge: {
+        title: {
+            horizontalAlignment: "center",
+            subtitle: {
+                horizontalAlignment: "center"
+            }
+        }
+    },
+
     rangeSelector: {
         sliderHandle: {
             opacity: 0.5

testing/tests/DevExpress.ui.widgets.dataGrid/editing.tests.js

@@ -304,8 +304,10 @@ QUnit.module('Editing', {
         };
         this.click = function($element, selector) {
             var $targetElement = this.find($element, selector);
-            $($targetElement).trigger('dxclick');
+            var event = $.Event("dxclick");
+            $($targetElement).trigger(event);
             this.clock.tick();
+            return event;
         };
         this.keyboardNavigationController._focusedView = this.rowsView;
     },
@@ -755,7 +757,7 @@ QUnit.test('Edit Row', function(assert) {
     rowsView.render(testElement);
 
     // act
-    this.click(testElement.find('tbody > tr').first(), '.dx-link:contains(Edit)');
+    var event = this.click(testElement.find('tbody > tr').first(), '.dx-link:contains(Edit)');
     this.clock.tick();
 
     // assert
@@ -768,6 +770,8 @@ QUnit.test('Edit Row', function(assert) {
         },
         "focus position"
     );
+    assert.ok(event.isDefaultPrevented(), "default is prevented"); // T643785
+    assert.ok(event.isPropagationStopped(), "propagation is stopped");
 });
 
 QUnit.test('Edit Row and focus not first input', function(assert) {

testing/tests/DevExpress.ui.widgets.dataGrid/filterBuilder.tests.js

@@ -1,18 +1,19 @@
 "use strict";
 
-require("ui/data_grid/ui.data_grid");
+import "ui/data_grid/ui.data_grid";
 
-var $ = require("jquery"),
-    dataGridMocks = require("../../helpers/dataGridMocks.js"),
-    setupDataGridModules = dataGridMocks.setupDataGridModules;
+import $ from "jquery";
+import fx from "animation/fx";
+import dataGridMocks from "../../helpers/dataGridMocks.js";
+
+const setupDataGridModules = dataGridMocks.setupDataGridModules;
 
 QUnit.testStart(function() {
-    var markup =
-    '<div>\
-        <div class="dx-datagrid">\
-            <div id="container"></div>\
-        </div>\
-    </div>';
+    var markup = `<div>
+        <div class="dx-datagrid">
+            <div id="container"></div>
+        </div>
+    </div>`;
 
     $("#qunit-fixture").html(markup);
 });
@@ -222,4 +223,82 @@ QUnit.module("Common", {
         // assert
         assert.ok($(".dx-popup-content .dx-filterbuilder-item-operation").length, 1);
     });
+
+    // T646561
+    QUnit.test("the field mustn't be in filterBuilder if allowFiltering = false", function(assert) {
+        let filterBuilderFields;
+        this.initFilterBuilderView({
+            columns: [
+                { dataField: "field" },
+                { dataField: "hiddenField", allowFiltering: false }
+            ],
+            filterBuilder: {
+                onInitialized: (e) => {
+                    filterBuilderFields = e.component.option("fields");
+                }
+            },
+            filterBuilderPopup: { visible: true },
+        });
+
+
+        assert.deepEqual(filterBuilderFields.length, 1);
+        assert.deepEqual(filterBuilderFields[0].dataField, "field");
+    });
+
+    // T642913
+    QUnit.test("the field mustn't be in filterBuilder if this does not contain dataField", function(assert) {
+        let filterBuilderFields;
+        this.initFilterBuilderView({
+            columns: [
+                { caption: "field text" },
+                { dataField: "field" }
+            ],
+            filterBuilder: {
+                onInitialized: (e) => {
+                    filterBuilderFields = e.component.option("fields");
+                }
+            },
+            filterBuilderPopup: { visible: true },
+        });
+
+
+        assert.deepEqual(filterBuilderFields.length, 1);
+        assert.deepEqual(filterBuilderFields[0].dataField, "field");
+    });
+});
+
+QUnit.module("Real dataGrid", {
+    beforeEach: function() {
+        this.initDataGrid = function(options) {
+            this.dataGrid = $("#container").dxDataGrid($.extend({
+                dataSource: [{}]
+            }, options)).dxDataGrid("instance");
+            return this.dataGrid;
+        };
+
+        this.clock = sinon.useFakeTimers();
+        fx.off = true;
+    },
+    afterEach: function() {
+        this.dataGrid.dispose();
+        this.clock.restore();
+        fx.off = false;
+    }
+}, function() {
+    // T646013
+    QUnit.test("the 'any of' doesn't throw exception when popup is hiding (without jQuery)", function(assert) {
+        // arrange, act
+        this.initDataGrid({
+            columns: [{ dataField: "field", dataType: "string", defaultFilterOperations: ["anyof"] }],
+            filterValue: ["field", "anyof", ["text"]],
+            filterBuilderPopup: { visible: true },
+        });
+
+        $(".dx-popup-content .dx-filterbuilder-item-value-text").trigger("dxclick");
+        this.clock.tick();
+        $(".dx-header-filter-menu.dx-popup").dxPopup("instance").hide();
+
+        // assert
+        assert.equal($(".dx-popup-content .dx-filterbuilder-item-value-text").text(), "text");
+    });
 });

testing/tests/DevExpress.ui.widgets.editors/validator.tests.js

@@ -253,24 +253,6 @@ QUnit.test("Validator should be able to bypass validation", function(assert) {
     assert.ok(!result.brokenRule, "brokenRule is null");
 });
 
-QUnit.test("Validation rules are not modified after validate", function(assert) {
-    var value = "",
-        name = "Login",
-        handler = sinon.stub();
-
-
-    var validator = this.fixture.createValidator({
-        name: name,
-        onValidated: handler,
-        validationRules: [{ type: 'required' }]
-    });
-    this.fixture.stubAdapter.getValue.returns(value);
-
-    validator.validate();
-
-    assert.deepEqual(validator.option("validationRules"), [{ type: 'required' }]);
-});
-
 
 QUnit.module("Registration in groups", {
     beforeEach: function() {
@@ -344,14 +326,15 @@ QUnit.module("Events", {
 QUnit.test("Validated event should fire", function(assert) {
     var value = "",
         name = "Login",
+        validationRules = [{ type: 'required' }],
         expectedFailedValidationRule = { type: 'required', isValid: false, message: "Login is required", validator: {}, value: value },
         handler = sinon.stub();
 
 
     var validator = this.fixture.createValidator({
         name: name,
         onValidated: handler,
-        validationRules: [{ type: 'required' }]
+        validationRules: validationRules
     });
     expectedFailedValidationRule.validator = validator;
     this.fixture.stubAdapter.getValue.returns(value);
@@ -365,13 +348,7 @@ QUnit.test("Validated event should fire", function(assert) {
     assert.equal(params.value, value, "Correct value was passed");
     assert.equal(params.name, name, "Name of Validator should be passed");
     assert.strictEqual(params.isValid, false, "isValid was passed");
-    assert.deepEqual(params.validationRules, [{
-        isValid: false,
-        message: "Login is required",
-        type: "required",
-        validator: validator,
-        value: value
-    }], "Correct rules were passed");
+    assert.deepEqual(params.validationRules, validationRules, "Correct rules were passed");
     assert.deepEqual(params.brokenRule, expectedFailedValidationRule, "Failed rules were passed");
 });