devextreme
Version:
JavaScript/TypeScript Component Suite for Responsive Web Development
207 lines (205 loc) • 8.71 kB
JavaScript
/**
* DevExtreme (cjs/__internal/scheduler/header/m_view_switcher.integration.test.js)
* Version: 25.2.7
* Build date: Tue May 05 2026
*
* Copyright (c) 2012 - 2026 Developer Express Inc. ALL RIGHTS RESERVED
* Read about DevExtreme licensing here: https://js.devexpress.com/Licensing/
*/
"use strict";
var _globals = require("@jest/globals");
var _renderer = _interopRequireDefault(require("../../../core/renderer"));
var _localization = require("../../../localization");
var _scheduler = _interopRequireDefault(require("../../../ui/scheduler"));
function _interopRequireDefault(e) {
return e && e.__esModule ? e : {
default: e
}
}
const SCHEDULER_CONTAINER_ID = "schedulerContainer";
const SELECTORS = {
schedulerContainer: "#schedulerContainer",
invisibleState: ".dx-state-invisible",
viewSwitcher: ".dx-scheduler-view-switcher",
viewSwitcherButton: ".dx-scheduler-view-switcher .dx-button",
viewButtonInDropdown: ".dx-scheduler-view-switcher-dropdown-button-content .dx-list-item"
};
const defaultViews = ["day", "week", "workWeek", "month", "timelineDay", "timelineWeek", "timelineWorkWeek", "timelineMonth", "agenda"];
const createScheduler = options => new Promise(resolve => {
const $container = (0, _renderer.default)("<div>").attr("id", "schedulerContainer").appendTo(document.body);
let instance;
instance = new _scheduler.default($container.get(0), Object.assign({}, options, {
onContentReady: () => {
resolve({
$container: $container,
instance: instance
})
}
}))
});
(0, _globals.describe)("ViewSwitcher", () => {
(0, _globals.afterEach)(() => {
const $container = (0, _renderer.default)(SELECTORS.schedulerContainer);
const scheduler = $container.dxScheduler("instance");
scheduler.dispose();
$container.remove()
});
(0, _globals.describe)("Visibility", () => {
_globals.it.each([{
useDropDownViewSwitcher: true,
views: ["day"],
currentView: "day",
expectedVisibility: false
}, {
useDropDownViewSwitcher: true,
views: ["day"],
currentView: "week",
expectedVisibility: false
}, {
useDropDownViewSwitcher: true,
views: [],
currentView: "day",
expectedVisibility: false
}, {
useDropDownViewSwitcher: true,
views: ["day", "week"],
currentView: "day",
expectedVisibility: true
}, {
useDropDownViewSwitcher: false,
views: ["day"],
currentView: "day",
expectedVisibility: false
}, {
useDropDownViewSwitcher: false,
views: ["day"],
currentView: "week",
expectedVisibility: false
}, {
useDropDownViewSwitcher: false,
views: [],
currentView: "day",
expectedVisibility: false
}, {
useDropDownViewSwitcher: false,
views: ["day", "week"],
currentView: "day",
expectedVisibility: true
}])("view switcher should be visible: $expectedVisibility, when useDropDownViewSwitcher: $useDropDownViewSwitcher views: $views, currentView: $currentView", async _ref => {
let {
useDropDownViewSwitcher: useDropDownViewSwitcher,
views: views,
currentView: currentView,
expectedVisibility: expectedVisibility
} = _ref;
const {
$container: $container
} = await createScheduler({
useDropDownViewSwitcher: useDropDownViewSwitcher,
currentView: currentView,
views: views
});
const viewSwitcher = $container.find(SELECTORS.viewSwitcher);
(0, _globals.expect)(!viewSwitcher.is(SELECTORS.invisibleState)).toBe(expectedVisibility)
})
});
(0, _globals.describe)("Localization", () => {
(0, _globals.it)("should display Russian view names when locale is set to Russian", async () => {
(0, _localization.loadMessages)({
ru: {
"dxScheduler-switcherDay": "\u0414\u0435\u043d\u044c",
"dxScheduler-switcherWeek": "\u041d\u0435\u0434\u0435\u043b\u044f",
"dxScheduler-switcherMonth": "\u041c\u0435\u0441\u044f\u0446"
}
});
(0, _localization.locale)("ru");
const {
$container: $container
} = await createScheduler({
useDropDownViewSwitcher: false,
currentView: "day",
views: ["day", "week", "month"]
});
const buttons = $container.find(SELECTORS.viewSwitcherButton);
const buttonTexts = [];
buttons.each((_, button) => {
buttonTexts.push((0, _renderer.default)(button).text());
return true
});
(0, _globals.expect)(buttonTexts).toContain("\u0414\u0435\u043d\u044c");
(0, _globals.expect)(buttonTexts).toContain("\u041d\u0435\u0434\u0435\u043b\u044f");
(0, _globals.expect)(buttonTexts).toContain("\u041c\u0435\u0441\u044f\u0446")
});
(0, _globals.it)("should display Russian view names in dropdown switcher when locale is set to Russian", async () => {
(0, _localization.loadMessages)({
ru: {
"dxScheduler-switcherDay": "\u0414\u0435\u043d\u044c",
"dxScheduler-switcherWeek": "\u041d\u0435\u0434\u0435\u043b\u044f",
"dxScheduler-switcherMonth": "\u041c\u0435\u0441\u044f\u0446"
}
});
(0, _localization.locale)("ru");
const {
$container: $container
} = await createScheduler({
useDropDownViewSwitcher: true,
currentView: "day",
views: ["day", "week", "month"]
});
const viewSwitcher = $container.find(SELECTORS.viewSwitcher);
const dropdown = viewSwitcher.find(".dx-dropdownbutton");
const buttonText = dropdown.find(".dx-button-text");
(0, _globals.expect)(buttonText.text()).toBe("\u0414\u0435\u043d\u044c")
})
});
(0, _globals.it)("currentView should equal type or name if it is set by config on switch, useDropDownViewSwitcher=false", async () => {
const changes = [];
await createScheduler({
dataSource: [],
views: [...defaultViews, {
name: "Week 2",
type: "week"
}],
currentView: "timelineDay",
width: 1e4,
useDropDownViewSwitcher: false,
onOptionChanged: e => {
if ("currentView" === e.name) {
const currentView = e.component.option("currentView");
changes.push(currentView ?? "")
}
}
});
const buttons = document.querySelectorAll(SELECTORS.viewSwitcherButton);
buttons.forEach(button => {
button.click()
});
(0, _globals.expect)(changes).toEqual([...defaultViews, "Week 2"])
});
(0, _globals.it)("currentView should equal type or name if it is set by config on switch, useDropDownViewSwitcher=true", async () => {
const changes = [];
await createScheduler({
dataSource: [],
views: [...defaultViews, {
name: "Week 2",
type: "week"
}],
currentView: "timelineDay",
useDropDownViewSwitcher: true,
onOptionChanged: e => {
if ("currentView" === e.name) {
const currentView = e.component.option("currentView");
changes.push(currentView ?? "")
}
}
});
const dropdown = document.querySelector(SELECTORS.viewSwitcherButton);
dropdown.click();
const buttons = document.querySelectorAll(SELECTORS.viewButtonInDropdown);
buttons.forEach(button => {
button.click();
dropdown.click()
});
(0, _globals.expect)(changes).toEqual([...defaultViews, "Week 2"])
})
});