devextreme
Version:
HTML5 JavaScript Component Suite for Responsive Web Development
160 lines (159 loc) • 6.05 kB
JavaScript
/**
* DevExtreme (esm/__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/
*/
import _extends from "@babel/runtime/helpers/esm/extends";
import {
createComponentVNode,
normalizeProps
} from "inferno";
import {
describe,
expect,
it
} from "@jest/globals";
import {
Item
} from "../../../../grids/new/card_view/header_panel/item";
import {
normalizeColumn
} from "../../../../grids/new/grid_core/columns_controller/columns_controller.mock";
import {
render
} from "inferno";
import {
getHeaderItemA11yLabel
} from "./a11y/index";
const CLASSES = {
itemRoot: "dx-cardview-header-item"
};
const setup = props => {
const rootElement = document.createElement("div");
render(normalizeProps(createComponentVNode(2, Item, _extends({}, props))), rootElement);
return rootElement
};
const getItemRoot = element => element.querySelector(`.${CLASSES.itemRoot}`);
describe("Item", (() => {
describe("A11y", (() => {
it("should has aria label with column caption", (() => {
const expectedAriaLabel = getHeaderItemA11yLabel("TEST_COL", {});
const element = setup({
column: normalizeColumn({
dataField: "SOME_DATA_FIELD",
caption: "TEST_COL"
})
});
const itemRoot = getItemRoot(element);
expect(null === itemRoot || void 0 === itemRoot ? void 0 : itemRoot.getAttribute("aria-label")).toBe(expectedAriaLabel)
}));
it.each([true, false])("should has aria label with header filter info", (hasFilters => {
const expectedAriaLabel = getHeaderItemA11yLabel("TEST_COL", {
hasHeaderFilterValue: hasFilters
});
const element = setup({
column: normalizeColumn({
dataField: "SOME_DATA_FIELD",
caption: "TEST_COL"
}),
hasFilters: hasFilters
});
const itemRoot = getItemRoot(element);
expect(null === itemRoot || void 0 === itemRoot ? void 0 : itemRoot.getAttribute("aria-label")).toBe(expectedAriaLabel)
}));
it.each(["asc", "desc", void 0])("sorting: %s -> should has arial label with sorting info", (sortOrder => {
const expectedAriaLabel = getHeaderItemA11yLabel("TEST_COL", {
sortOrder: sortOrder
});
const element = setup({
column: normalizeColumn({
dataField: "SOME_DATA_FIELD",
caption: "TEST_COL",
sortOrder: sortOrder
})
});
const itemRoot = getItemRoot(element);
expect(null === itemRoot || void 0 === itemRoot ? void 0 : itemRoot.getAttribute("aria-label")).toBe(expectedAriaLabel)
}));
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 = getHeaderItemA11yLabel("TEST_COL", {
sortOrder: sortOrder,
sortIndex: sortIndex
});
const element = setup({
column: normalizeColumn({
dataField: "SOME_DATA_FIELD",
caption: "TEST_COL",
sortOrder: sortOrder,
sortIndex: sortIndex
})
});
const itemRoot = getItemRoot(element);
expect(null === itemRoot || void 0 === itemRoot ? void 0 : itemRoot.getAttribute("aria-label")).toBe(expectedAriaLabel)
}));
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 = getHeaderItemA11yLabel(caption, {
hasHeaderFilterValue: hasFilters,
sortOrder: sortOrder,
sortIndex: sortIndex
});
const element = setup({
column: normalizeColumn({
dataField: "SOME_DATA_FIELD",
caption: caption,
sortOrder: sortOrder,
sortIndex: sortIndex
}),
hasFilters: hasFilters
});
const itemRoot = getItemRoot(element);
expect(null === itemRoot || void 0 === itemRoot ? void 0 : itemRoot.getAttribute("aria-label")).toBe(expectedAriaLabel)
}))
}))
}));