devextreme
Version:
JavaScript/TypeScript Component Suite for Responsive Web Development
141 lines (140 loc) • 6.1 kB
JavaScript
/**
* DevExtreme (esm/__internal/scheduler/appointments_new/appointment_collector.test.js)
* Version: 25.2.8
* Build date: Mon Jun 08 2026
*
* Copyright (c) 2012 - 2026 Developer Express Inc. ALL RIGHTS RESERVED
* Read about DevExtreme licensing here: https://js.devexpress.com/Licensing/
*/
import {
afterEach,
beforeEach,
describe,
expect,
it,
jest
} from "@jest/globals";
import $ from "../../../core/renderer";
import fx from "../../../common/core/animation/fx";
import {
createAppointmentCollector,
getAppointmentCollectorProperties as getProperties
} from "./__mock__/appointment_collector";
import {
APPOINTMENT_COLLECTOR_CLASSES
} from "./const";
const defaultAppointmentData = {
title: "Test appointment",
startDate: new Date(2024, 0, 1, 9, 0),
endDate: new Date(2024, 0, 1, 10, 0)
};
describe("AppointmentCollector", () => {
beforeEach(() => {
fx.off = true;
const $container = $("<div>").addClass("container").appendTo(document.body);
$("<div>").addClass("root").appendTo($container)
});
afterEach(() => {
$(".container").remove();
fx.off = false;
jest.useRealTimers()
});
describe("Classes", () => {
it("should have correct container class", () => {
const instance = createAppointmentCollector(getProperties([defaultAppointmentData]));
expect(instance.$element().hasClass("dx-scheduler-appointment-collector")).toBe(true);
expect(instance.$element().hasClass("dx-button")).toBe(true)
});
it("should have correct content class", () => {
const instance = createAppointmentCollector(getProperties([defaultAppointmentData]));
const $buttonContent = instance.$element().find(".dx-button-content");
expect($buttonContent.hasClass(APPOINTMENT_COLLECTOR_CLASSES.CONTENT)).toBe(true)
});
it.each([true, false])("should have correct compact class for isCompact = %o", isCompact => {
const instance = createAppointmentCollector(Object.assign({}, getProperties([defaultAppointmentData]), {
isCompact: isCompact
}));
expect(instance.$element().hasClass(APPOINTMENT_COLLECTOR_CLASSES.COMPACT)).toBe(isCompact)
})
});
describe("Aria", () => {
it("should have correct aria-roledescription when appointment is in the same date", () => {
const instance = createAppointmentCollector(getProperties([{
text: "test",
startDate: new Date(2024, 0, 1, 9, 0),
endDate: new Date(2024, 0, 1, 10, 0)
}]));
expect(instance.$element().attr("aria-roledescription")).toBe("January 1, 2024")
});
it("should have correct aria-roledescription when appointment is in different dates", () => {
const instance = createAppointmentCollector(getProperties([{
text: "test",
startDate: new Date(2024, 0, 1, 9, 0),
endDate: new Date(2024, 0, 2, 10, 0)
}]));
expect(instance.$element().attr("aria-roledescription")).toBe("January 1, 2024 - January 2, 2024")
})
});
describe("Geometry", () => {
it("should have correct top and left on init", () => {
const instance = createAppointmentCollector(Object.assign({}, getProperties([defaultAppointmentData]), {
geometry: {
top: 100,
left: 200,
height: 30,
width: 40
}
}));
expect(instance.$element().css("top")).toBe("100px");
expect(instance.$element().css("left")).toBe("200px");
expect(instance.$element().css("height")).toBe("30px");
expect(instance.$element().css("width")).toBe("40px")
});
it("should have correct top and left after geometry is updated and resize is called", () => {
const instance = createAppointmentCollector(Object.assign({}, getProperties([defaultAppointmentData]), {
geometry: {
top: 100,
left: 200,
height: 30,
width: 40
}
}));
instance.resize({
height: 30,
width: 40,
top: 150,
left: 250
});
expect(instance.$element().css("top")).toBe("150px");
expect(instance.$element().css("left")).toBe("250px");
expect(instance.$element().css("height")).toBe("30px");
expect(instance.$element().css("width")).toBe("40px")
})
});
describe("Text", () => {
it.each([{
isCompact: true,
expectedText: "1"
}, {
isCompact: false,
expectedText: "1 more"
}])("should have correct text for single appointment and isCompact = %o", _ref => {
let {
isCompact: isCompact,
expectedText: expectedText
} = _ref;
const instance = createAppointmentCollector(Object.assign({}, getProperties([defaultAppointmentData]), {
isCompact: isCompact
}));
const $buttonContent = instance.$element().find(".dx-button-content");
expect($buttonContent.text()).toBe(expectedText)
});
it("should have correct text for two appointments and isCompact = true", () => {
const instance = createAppointmentCollector(Object.assign({}, getProperties([Object.assign({}, defaultAppointmentData), Object.assign({}, defaultAppointmentData)]), {
isCompact: true
}));
const $buttonContent = instance.$element().find(".dx-button-content");
expect($buttonContent.text()).toBe("2")
})
})
});