devextreme
Version:
HTML5 JavaScript Component Suite for Responsive Web Development
156 lines (154 loc) • 6.62 kB
JavaScript
/**
* DevExtreme (cjs/__internal/grids/new/card_view/header_panel/item.a11y.test.js)
* Version: 25.1.3
* Build date: Wed Jun 25 2025
*
* Copyright (c) 2012 - 2025 Developer Express Inc. ALL RIGHTS RESERVED
* Read about DevExtreme licensing here: https://js.devexpress.com/Licensing/
*/
"use strict";
var _inferno = require("inferno");
var _globals = require("@jest/globals");
var _item = require("../../../../grids/new/card_view/header_panel/item");
var _columns_controller = require("../../../../grids/new/grid_core/columns_controller/columns_controller.mock");
var _index = require("./a11y/index");
function _extends() {
return _extends = Object.assign ? Object.assign.bind() : function(n) {
for (var e = 1; e < arguments.length; e++) {
var t = arguments[e];
for (var r in t) {
({}).hasOwnProperty.call(t, r) && (n[r] = t[r])
}
}
return n
}, _extends.apply(null, arguments)
}
const CLASSES = {
itemRoot: "dx-cardview-header-item"
};
const setup = props => {
const rootElement = document.createElement("div");
(0, _inferno.render)((0, _inferno.normalizeProps)((0, _inferno.createComponentVNode)(2, _item.Item, _extends({}, props))), rootElement);
return rootElement
};
const getItemRoot = element => element.querySelector(`.${CLASSES.itemRoot}`);
(0, _globals.describe)("Item", (() => {
(0, _globals.describe)("A11y", (() => {
(0, _globals.it)("should has aria label with column caption", (() => {
const expectedAriaLabel = (0, _index.getHeaderItemA11yLabel)("TEST_COL", {});
const element = setup({
column: (0, _columns_controller.normalizeColumn)({
dataField: "SOME_DATA_FIELD",
caption: "TEST_COL"
})
});
const itemRoot = getItemRoot(element);
(0, _globals.expect)(null === itemRoot || void 0 === itemRoot ? void 0 : itemRoot.getAttribute("aria-label")).toBe(expectedAriaLabel)
}));
_globals.it.each([true, false])("should has aria label with header filter info", (hasFilters => {
const expectedAriaLabel = (0, _index.getHeaderItemA11yLabel)("TEST_COL", {
hasHeaderFilterValue: hasFilters
});
const element = setup({
column: (0, _columns_controller.normalizeColumn)({
dataField: "SOME_DATA_FIELD",
caption: "TEST_COL"
}),
hasFilters: hasFilters
});
const itemRoot = getItemRoot(element);
(0, _globals.expect)(null === itemRoot || void 0 === itemRoot ? void 0 : itemRoot.getAttribute("aria-label")).toBe(expectedAriaLabel)
}));
_globals.it.each(["asc", "desc", void 0])("sorting: %s -> should has arial label with sorting info", (sortOrder => {
const expectedAriaLabel = (0, _index.getHeaderItemA11yLabel)("TEST_COL", {
sortOrder: sortOrder
});
const element = setup({
column: (0, _columns_controller.normalizeColumn)({
dataField: "SOME_DATA_FIELD",
caption: "TEST_COL",
sortOrder: sortOrder
})
});
const itemRoot = getItemRoot(element);
(0, _globals.expect)(null === itemRoot || void 0 === itemRoot ? void 0 : itemRoot.getAttribute("aria-label")).toBe(expectedAriaLabel)
}));
_globals.it.each([{
sortOrder: "asc",
sortIndex: 0
}, {
sortOrder: "desc",
sortIndex: 5
}, {
sortOrder: void 0,
sortIndex: 1
}, {
sortOrder: void 0,
sortIndex: void 0
}, {
sortOrder: "asc",
sortIndex: void 0
}, {
sortOrder: "desc",
sortIndex: void 0
}])("sorting: $sortOrder | sortIndex: $sortIndex -> should has arial label with sort idx info", (_ref => {
let {
sortOrder: sortOrder,
sortIndex: sortIndex
} = _ref;
const expectedAriaLabel = (0, _index.getHeaderItemA11yLabel)("TEST_COL", {
sortOrder: sortOrder,
sortIndex: sortIndex
});
const element = setup({
column: (0, _columns_controller.normalizeColumn)({
dataField: "SOME_DATA_FIELD",
caption: "TEST_COL",
sortOrder: sortOrder,
sortIndex: sortIndex
})
});
const itemRoot = getItemRoot(element);
(0, _globals.expect)(null === itemRoot || void 0 === itemRoot ? void 0 : itemRoot.getAttribute("aria-label")).toBe(expectedAriaLabel)
}));
_globals.it.each([{
caption: "TEST #0",
hasFilters: true,
sortOrder: "asc",
sortIndex: 100
}, {
caption: "TEST #1",
hasFilters: true,
sortOrder: void 0,
sortIndex: 100
}, {
caption: "TEST #2",
hasFilters: true,
sortOrder: void 0,
sortIndex: 1
}])("caption: $caption | filterType: $filterType | filterValues: $filterValues | sortOrder: $sortOrder | sortIndex: $sortIndex -> complex case", (_ref2 => {
let {
caption: caption,
hasFilters: hasFilters,
sortOrder: sortOrder,
sortIndex: sortIndex
} = _ref2;
const expectedAriaLabel = (0, _index.getHeaderItemA11yLabel)(caption, {
hasHeaderFilterValue: hasFilters,
sortOrder: sortOrder,
sortIndex: sortIndex
});
const element = setup({
column: (0, _columns_controller.normalizeColumn)({
dataField: "SOME_DATA_FIELD",
caption: caption,
sortOrder: sortOrder,
sortIndex: sortIndex
}),
hasFilters: hasFilters
});
const itemRoot = getItemRoot(element);
(0, _globals.expect)(null === itemRoot || void 0 === itemRoot ? void 0 : itemRoot.getAttribute("aria-label")).toBe(expectedAriaLabel)
}))
}))
}));