609 lines
20 KiB
JavaScript
609 lines
20 KiB
JavaScript
/** @odoo-module **/
|
||
|
||
import {
|
||
getPickerApplyButton,
|
||
getPickerCell,
|
||
getTimePickers,
|
||
zoomOut,
|
||
} from "@web/../tests/core/datetime/datetime_test_helpers";
|
||
import { makeFakeLocalizationService } from "@web/../tests/helpers/mock_services";
|
||
import {
|
||
click,
|
||
clickSave,
|
||
editInput,
|
||
editSelect,
|
||
getFixture,
|
||
patchTimeZone,
|
||
patchWithCleanup,
|
||
triggerEvent,
|
||
triggerEvents,
|
||
} from "@web/../tests/helpers/utils";
|
||
import { makeView, setupViewRegistries } from "@web/../tests/views/helpers";
|
||
import { registry } from "@web/core/registry";
|
||
|
||
let serverData;
|
||
let target;
|
||
|
||
QUnit.module("Fields", (hooks) => {
|
||
hooks.beforeEach(() => {
|
||
target = getFixture();
|
||
serverData = {
|
||
models: {
|
||
partner: {
|
||
fields: {
|
||
date: { string: "A date", type: "date", searchable: true },
|
||
datetime: { string: "A datetime", type: "datetime", searchable: true },
|
||
p: {
|
||
string: "one2many field",
|
||
type: "one2many",
|
||
relation: "partner",
|
||
searchable: true,
|
||
},
|
||
},
|
||
records: [
|
||
{
|
||
id: 1,
|
||
date: "2017-02-03",
|
||
datetime: "2017-02-08 10:00:00",
|
||
p: [],
|
||
},
|
||
{
|
||
id: 2,
|
||
date: false,
|
||
datetime: false,
|
||
},
|
||
],
|
||
onchanges: {},
|
||
},
|
||
},
|
||
};
|
||
|
||
setupViewRegistries();
|
||
});
|
||
|
||
QUnit.module("DatetimeField");
|
||
|
||
QUnit.test("DatetimeField in form view", async (assert) => {
|
||
patchTimeZone(120);
|
||
|
||
await makeView({
|
||
type: "form",
|
||
resModel: "partner",
|
||
resId: 1,
|
||
serverData,
|
||
arch: '<form><field name="datetime"/></form>',
|
||
});
|
||
|
||
const expectedDateString = "02/08/2017 12:00:00"; // 10:00:00 without timezone
|
||
assert.strictEqual(
|
||
target.querySelector(".o_field_datetime input").value,
|
||
expectedDateString,
|
||
"the datetime should be correctly displayed"
|
||
);
|
||
|
||
// datepicker should not open on focus
|
||
assert.containsNone(target, ".o_datetime_picker");
|
||
|
||
await click(target, ".o_field_datetime input");
|
||
assert.containsOnce(target, ".o_datetime_picker");
|
||
|
||
// select 22 April 2018 at 8:25
|
||
await zoomOut();
|
||
await zoomOut();
|
||
await click(getPickerCell("2018"));
|
||
await click(getPickerCell("Apr"));
|
||
await click(getPickerCell("22"));
|
||
const [hourSelect, minuteSelect] = getTimePickers().at(0);
|
||
await editSelect(hourSelect, null, "8");
|
||
await editSelect(minuteSelect, null, "25");
|
||
// Close the datepicker
|
||
await click(target, ".o_form_view_container");
|
||
|
||
assert.containsNone(target, ".o_datetime_picker", "datepicker should be closed");
|
||
|
||
const newExpectedDateString = "04/22/2018 08:25:00";
|
||
assert.strictEqual(
|
||
target.querySelector(".o_field_datetime input").value,
|
||
newExpectedDateString,
|
||
"the selected date should be displayed in the input"
|
||
);
|
||
|
||
// save
|
||
await clickSave(target);
|
||
assert.strictEqual(
|
||
target.querySelector(".o_field_datetime input").value,
|
||
newExpectedDateString,
|
||
"the selected date should be displayed after saving"
|
||
);
|
||
});
|
||
|
||
QUnit.test(
|
||
"DatetimeField only triggers fieldChange when a day is picked and when an hour/minute is selected",
|
||
async (assert) => {
|
||
patchTimeZone(120);
|
||
|
||
serverData.models.partner.onchanges = {
|
||
datetime() {},
|
||
};
|
||
await makeView({
|
||
type: "form",
|
||
resModel: "partner",
|
||
resId: 1,
|
||
serverData,
|
||
arch: '<form><field name="datetime"/></form>',
|
||
mockRPC(route, { method }) {
|
||
if (method === "onchange") {
|
||
assert.step("onchange");
|
||
}
|
||
},
|
||
});
|
||
|
||
await click(target, ".o_field_datetime input");
|
||
|
||
assert.containsOnce(target, ".o_datetime_picker");
|
||
|
||
// select 22 April 2018 at 8:25
|
||
await zoomOut();
|
||
await zoomOut();
|
||
await click(getPickerCell("2018"));
|
||
await click(getPickerCell("Apr"));
|
||
await click(getPickerCell("22"));
|
||
|
||
assert.verifySteps([]);
|
||
|
||
const [hourSelect, minuteSelect] = getTimePickers().at(0);
|
||
await editSelect(hourSelect, null, "8");
|
||
await editSelect(minuteSelect, null, "25");
|
||
|
||
assert.verifySteps([]);
|
||
|
||
// Close the datepicker
|
||
await click(target);
|
||
|
||
assert.containsNone(target, ".o_datetime_picker");
|
||
assert.strictEqual(
|
||
target.querySelector(".o_field_datetime input").value,
|
||
"04/22/2018 08:25:00"
|
||
);
|
||
assert.verifySteps(["onchange"]);
|
||
}
|
||
);
|
||
|
||
QUnit.test("DatetimeField with datetime formatted without second", async (assert) => {
|
||
patchTimeZone(0);
|
||
|
||
serverData.models.partner.fields.datetime.default = "2017-08-02 12:00:05";
|
||
serverData.models.partner.fields.datetime.required = true;
|
||
|
||
registry.category("services").add(
|
||
"localization",
|
||
makeFakeLocalizationService({
|
||
dateFormat: "MM/dd/yyyy",
|
||
timeFormat: "HH:mm",
|
||
dateTimeFormat: "MM/dd/yyyy HH:mm",
|
||
}),
|
||
{ force: true }
|
||
);
|
||
|
||
await makeView({
|
||
type: "form",
|
||
resModel: "partner",
|
||
serverData,
|
||
arch: '<form><field name="datetime"/></form>',
|
||
});
|
||
|
||
const expectedDateString = "08/02/2017 12:00";
|
||
assert.strictEqual(
|
||
target.querySelector(".o_field_datetime input").value,
|
||
expectedDateString,
|
||
"the datetime should be correctly displayed"
|
||
);
|
||
|
||
await click(target, ".o_form_button_cancel");
|
||
assert.containsNone(target, ".modal", "there should not be a Warning dialog");
|
||
});
|
||
QUnit.test("DatetimeField in editable list view", async (assert) => {
|
||
patchTimeZone(120);
|
||
|
||
await makeView({
|
||
serverData,
|
||
type: "list",
|
||
resModel: "partner",
|
||
arch: `<tree editable="bottom"><field name="datetime"/></tree>`,
|
||
});
|
||
|
||
const expectedDateString = "02/08/2017 12:00:00"; // 10:00:00 without timezone
|
||
const cell = target.querySelector("tr.o_data_row td:not(.o_list_record_selector)");
|
||
assert.strictEqual(
|
||
cell.textContent,
|
||
expectedDateString,
|
||
"the datetime should be correctly displayed"
|
||
);
|
||
|
||
// switch to edit mode
|
||
await click(target.querySelector(".o_data_row .o_data_cell"));
|
||
|
||
assert.containsOnce(
|
||
target,
|
||
".o_field_datetime input",
|
||
"the view should have a date input for editable mode"
|
||
);
|
||
assert.strictEqual(
|
||
target.querySelector(".o_field_datetime input"),
|
||
document.activeElement,
|
||
"date input should have the focus"
|
||
);
|
||
|
||
assert.strictEqual(
|
||
target.querySelector(".o_field_datetime input").value,
|
||
expectedDateString,
|
||
"the date should be correct in edit mode"
|
||
);
|
||
|
||
assert.containsNone(target, ".o_datetime_picker");
|
||
|
||
await click(target, ".o_field_datetime input");
|
||
|
||
assert.containsOnce(target, ".o_datetime_picker");
|
||
|
||
// select 22 April 2018 at 8:25
|
||
await zoomOut();
|
||
await zoomOut();
|
||
await click(getPickerCell("2018"));
|
||
await click(getPickerCell("Apr"));
|
||
await click(getPickerCell("22"));
|
||
const [hourSelect, minuteSelect] = getTimePickers().at(0);
|
||
await editSelect(hourSelect, null, "8");
|
||
await editSelect(minuteSelect, null, "25");
|
||
// Apply changes
|
||
await click(getPickerApplyButton());
|
||
|
||
assert.containsNone(target, ".o_datetime_picker", "datepicker should be closed");
|
||
|
||
const newExpectedDateString = "04/22/2018 08:25:00";
|
||
assert.strictEqual(
|
||
target.querySelector(".o_field_datetime input").value,
|
||
newExpectedDateString,
|
||
"the date should be updated in the input"
|
||
);
|
||
|
||
// save
|
||
await clickSave(target);
|
||
assert.strictEqual(
|
||
target.querySelector("tr.o_data_row td:not(.o_list_record_selector)").textContent,
|
||
newExpectedDateString,
|
||
"the selected datetime should be displayed after saving"
|
||
);
|
||
});
|
||
|
||
QUnit.test(
|
||
"multi edition of DatetimeField in list view: edit date in input",
|
||
async (assert) => {
|
||
await makeView({
|
||
serverData,
|
||
type: "list",
|
||
resModel: "partner",
|
||
arch: '<tree multi_edit="1"><field name="datetime"/></tree>',
|
||
});
|
||
|
||
const rows = target.querySelectorAll(".o_data_row");
|
||
|
||
// select two records and edit them
|
||
await click(rows[0], ".o_list_record_selector input");
|
||
await click(rows[1], ".o_list_record_selector input");
|
||
|
||
await click(rows[0], ".o_data_cell");
|
||
|
||
assert.containsOnce(target, ".o_field_datetime input");
|
||
|
||
await editInput(target, ".o_field_datetime input", "10/02/2019 09:00:00");
|
||
|
||
assert.containsOnce(target, ".modal");
|
||
|
||
await click(target.querySelector(".modal .modal-footer .btn-primary"));
|
||
|
||
assert.strictEqual(
|
||
target.querySelector(".o_data_row:first-child .o_data_cell").textContent,
|
||
"10/02/2019 09:00:00"
|
||
);
|
||
assert.strictEqual(
|
||
target.querySelector(".o_data_row:nth-child(2) .o_data_cell").textContent,
|
||
"10/02/2019 09:00:00"
|
||
);
|
||
}
|
||
);
|
||
|
||
QUnit.test(
|
||
"multi edition of DatetimeField in list view: clear date in input",
|
||
async (assert) => {
|
||
serverData.models.partner.records[1].datetime = "2017-02-08 10:00:00";
|
||
|
||
await makeView({
|
||
serverData,
|
||
type: "list",
|
||
resModel: "partner",
|
||
arch: '<tree multi_edit="1"><field name="datetime"/></tree>',
|
||
});
|
||
|
||
const rows = target.querySelectorAll(".o_data_row");
|
||
|
||
// select two records and edit them
|
||
await click(rows[0], ".o_list_record_selector input");
|
||
await click(rows[1], ".o_list_record_selector input");
|
||
|
||
await click(rows[0], ".o_data_cell");
|
||
|
||
assert.containsOnce(target, ".o_field_datetime input");
|
||
|
||
await editInput(target, ".o_field_datetime input", "");
|
||
|
||
assert.containsOnce(target, ".modal");
|
||
|
||
await click(target, ".modal .modal-footer .btn-primary");
|
||
|
||
assert.strictEqual(
|
||
target.querySelector(".o_data_row:first-child .o_data_cell").textContent,
|
||
""
|
||
);
|
||
assert.strictEqual(
|
||
target.querySelector(".o_data_row:nth-child(2) .o_data_cell").textContent,
|
||
""
|
||
);
|
||
}
|
||
);
|
||
|
||
QUnit.test("DatetimeField remove value", async (assert) => {
|
||
assert.expect(4);
|
||
|
||
patchTimeZone(120);
|
||
|
||
await makeView({
|
||
type: "form",
|
||
resModel: "partner",
|
||
resId: 1,
|
||
serverData,
|
||
arch: '<form><field name="datetime"/></form>',
|
||
mockRPC(route, { args }) {
|
||
if (route === "/web/dataset/call_kw/partner/web_save") {
|
||
assert.strictEqual(
|
||
args[1].datetime,
|
||
false,
|
||
"the correct value should be saved"
|
||
);
|
||
}
|
||
},
|
||
});
|
||
|
||
assert.strictEqual(
|
||
target.querySelector(".o_field_datetime input").value,
|
||
"02/08/2017 12:00:00",
|
||
"the date time should be correct in edit mode"
|
||
);
|
||
|
||
const input = target.querySelector(".o_field_datetime input");
|
||
input.value = "";
|
||
await triggerEvents(input, null, ["input", "change", "focusout"]);
|
||
assert.strictEqual(
|
||
target.querySelector(".o_field_datetime input").value,
|
||
"",
|
||
"should have an empty input"
|
||
);
|
||
|
||
// save
|
||
await clickSave(target);
|
||
assert.strictEqual(
|
||
target.querySelector(".o_field_datetime").textContent,
|
||
"",
|
||
"the selected date should be displayed after saving"
|
||
);
|
||
});
|
||
|
||
QUnit.test(
|
||
"DatetimeField with date/datetime widget (with day change) does not care about widget",
|
||
async (assert) => {
|
||
patchTimeZone(-240);
|
||
|
||
serverData.models.partner.records[0].p = [2];
|
||
serverData.models.partner.records[1].datetime = "2017-02-08 02:00:00"; // UTC
|
||
|
||
await makeView({
|
||
type: "form",
|
||
resModel: "partner",
|
||
resId: 1,
|
||
serverData,
|
||
arch: `
|
||
<form>
|
||
<field name="p">
|
||
<tree>
|
||
<field name="datetime" />
|
||
</tree>
|
||
<form>
|
||
<field name="datetime" widget="date" />
|
||
</form>
|
||
</field>
|
||
</form>`,
|
||
});
|
||
|
||
const expectedDateString = "02/07/2017 22:00:00"; // local time zone
|
||
assert.strictEqual(
|
||
target.querySelector(".o_field_widget[name='p'] .o_data_cell").textContent,
|
||
expectedDateString,
|
||
"the datetime (datetime widget) should be correctly displayed in tree view"
|
||
);
|
||
|
||
// switch to form view
|
||
await click(target, ".o_field_widget[name='p'] .o_data_cell");
|
||
assert.strictEqual(
|
||
target.querySelector(".modal .o_field_date[name='datetime'] input").value,
|
||
"02/07/2017 22:00:00",
|
||
"the datetime (date widget) should be correctly displayed in form view"
|
||
);
|
||
}
|
||
);
|
||
|
||
QUnit.test(
|
||
"DatetimeField with date/datetime widget (without day change) does not care about widget",
|
||
async (assert) => {
|
||
patchTimeZone(-240);
|
||
|
||
serverData.models.partner.records[0].p = [2];
|
||
serverData.models.partner.records[1].datetime = "2017-02-08 10:00:00"; // without timezone
|
||
|
||
await makeView({
|
||
type: "form",
|
||
resModel: "partner",
|
||
resId: 1,
|
||
serverData,
|
||
arch: `
|
||
<form>
|
||
<field name="p">
|
||
<tree>
|
||
<field name="datetime" />
|
||
</tree>
|
||
<form>
|
||
<field name="datetime" widget="date" />
|
||
</form>
|
||
</field>
|
||
</form>`,
|
||
});
|
||
|
||
const expectedDateString = "02/08/2017 06:00:00"; // with timezone
|
||
assert.strictEqual(
|
||
target.querySelector(".o_field_widget[name='p'] .o_data_cell").textContent,
|
||
expectedDateString,
|
||
"the datetime (datetime widget) should be correctly displayed in tree view"
|
||
);
|
||
|
||
// switch to form view
|
||
await click(target, ".o_field_widget[name='p'] .o_data_cell");
|
||
assert.strictEqual(
|
||
target.querySelector(".modal .o_field_date[name='datetime'] input").value,
|
||
"02/08/2017 06:00:00",
|
||
"the datetime (date widget) should be correctly displayed in form view"
|
||
);
|
||
}
|
||
);
|
||
|
||
QUnit.test("datetime field: hit enter should update value", async (assert) => {
|
||
// This test verifies that the field datetime is correctly computed when:
|
||
// - we press enter to validate our entry
|
||
// - we click outside the field to validate our entry
|
||
// - we save
|
||
patchTimeZone(120);
|
||
|
||
registry.category("services").add(
|
||
"localization",
|
||
makeFakeLocalizationService({
|
||
dateFormat: "%m/%d/%Y",
|
||
timeFormat: "%H:%M:%S",
|
||
}),
|
||
{ force: true }
|
||
);
|
||
|
||
await makeView({
|
||
serverData,
|
||
type: "form",
|
||
resModel: "partner",
|
||
arch: '<form><field name="datetime"/></form>',
|
||
resId: 1,
|
||
});
|
||
|
||
const datetime = target.querySelector(".o_field_datetime input");
|
||
|
||
// Enter a beginning of date and press enter to validate
|
||
await editInput(datetime, null, "01/08/22 14:30:40");
|
||
await triggerEvent(datetime, null, "keydown", { key: "Enter" });
|
||
|
||
const datetimeValue = `01/08/2022 14:30:40`;
|
||
|
||
assert.strictEqual(datetime.value, datetimeValue);
|
||
|
||
// Click outside the field to check that the field is not changed
|
||
await click(target);
|
||
assert.strictEqual(datetime.value, datetimeValue);
|
||
|
||
// Save and check that it's still ok
|
||
await clickSave(target);
|
||
|
||
const { value } = target.querySelector(".o_field_datetime input");
|
||
assert.strictEqual(value, datetimeValue);
|
||
});
|
||
|
||
QUnit.test("DateTimeField with label opens datepicker on click", async (assert) => {
|
||
await makeView({
|
||
type: "form",
|
||
resModel: "partner",
|
||
resId: 1,
|
||
serverData,
|
||
arch: `
|
||
<form>
|
||
<label for="datetime" string="When is it" />
|
||
<field name="datetime" />
|
||
</form>`,
|
||
});
|
||
|
||
await click(target.querySelector("label.o_form_label"));
|
||
assert.containsOnce(target, ".o_datetime_picker", "datepicker should be opened");
|
||
});
|
||
|
||
QUnit.test("datetime field: use picker with arabic numbering system", async (assert) => {
|
||
patchWithCleanup(luxon.Settings, {
|
||
defaultLocale: "ar-001",
|
||
defaultNumberingSystem: "arab",
|
||
});
|
||
|
||
await makeView({
|
||
type: "form",
|
||
resModel: "partner",
|
||
resId: 1,
|
||
serverData,
|
||
arch: /* xml */ `
|
||
<form string="Partners">
|
||
<field name="datetime" />
|
||
</form>
|
||
`,
|
||
});
|
||
|
||
const getInput = () => target.querySelector("[name=datetime] input");
|
||
|
||
assert.strictEqual(getInput().value, "٠٢/٠٨/٢٠١٧ ١١:٠٠:٠٠");
|
||
|
||
await click(getInput());
|
||
await editSelect(getTimePickers()[0][1], null, 45);
|
||
|
||
assert.strictEqual(getInput().value, "٠٢/٠٨/٢٠١٧ ١١:٤٥:٠٠");
|
||
});
|
||
|
||
QUnit.test("list datetime with date widget test", async (assert) => {
|
||
await makeView({
|
||
type: "list",
|
||
resModel: "partner",
|
||
arch: /* xml */ `
|
||
<tree editable="bottom">
|
||
<field name="datetime" widget="datetime" options="{'show_time': false}"/>
|
||
<field name="datetime" widget="datetime"/>
|
||
</tree>`,
|
||
serverData,
|
||
});
|
||
|
||
const dates = target.querySelectorAll(".o_field_cell");
|
||
|
||
assert.strictEqual(
|
||
dates[0].textContent,
|
||
"02/08/2017",
|
||
"for datetime field only date should be visible with show_time as false and readonly"
|
||
);
|
||
assert.strictEqual(
|
||
dates[1].textContent,
|
||
"02/08/2017 11:00:00",
|
||
"for datetime field both date and time should be visible with show_time by default true"
|
||
);
|
||
await click(dates[0]);
|
||
assert.strictEqual(
|
||
target.querySelector(".o_field_datetime input").value,
|
||
"02/08/2017 11:00:00",
|
||
"for datetime field both date and time should be visible with show_time as false and edit"
|
||
);
|
||
});
|
||
});
|