diff options
| author | stephanchrst <stephanchrst@gmail.com> | 2022-05-10 21:51:50 +0700 |
|---|---|---|
| committer | stephanchrst <stephanchrst@gmail.com> | 2022-05-10 21:51:50 +0700 |
| commit | 3751379f1e9a4c215fb6eb898b4ccc67659b9ace (patch) | |
| tree | a44932296ef4a9b71d5f010906253d8c53727726 /addons/web/static/tests/components/datepicker_tests.js | |
| parent | 0a15094050bfde69a06d6eff798e9a8ddf2b8c21 (diff) | |
initial commit 2
Diffstat (limited to 'addons/web/static/tests/components/datepicker_tests.js')
| -rw-r--r-- | addons/web/static/tests/components/datepicker_tests.js | 350 |
1 files changed, 350 insertions, 0 deletions
diff --git a/addons/web/static/tests/components/datepicker_tests.js b/addons/web/static/tests/components/datepicker_tests.js new file mode 100644 index 00000000..643bcdb5 --- /dev/null +++ b/addons/web/static/tests/components/datepicker_tests.js @@ -0,0 +1,350 @@ +odoo.define('web.datepicker_tests', function (require) { + "use strict"; + + const { DatePicker, DateTimePicker } = require('web.DatePickerOwl'); + const testUtils = require('web.test_utils'); + const time = require('web.time'); + + const { createComponent } = testUtils; + + QUnit.module('Components', {}, function () { + + QUnit.module('DatePicker'); + + QUnit.test("basic rendering", async function (assert) { + assert.expect(8); + + const picker = await createComponent(DatePicker, { + props: { date: moment('01/09/1997') }, + }); + + assert.containsOnce(picker, 'input.o_input.o_datepicker_input'); + assert.containsOnce(picker, 'span.o_datepicker_button'); + assert.containsNone(document.body, 'div.bootstrap-datetimepicker-widget'); + + const input = picker.el.querySelector('input.o_input.o_datepicker_input'); + assert.strictEqual(input.value, '01/09/1997', + "Value should be the one given") + ; + assert.strictEqual(input.dataset.target, `#${picker.el.id}`, + "DatePicker id should match its input target"); + + await testUtils.dom.click(input); + + assert.containsOnce(document.body, 'div.bootstrap-datetimepicker-widget .datepicker'); + assert.containsNone(document.body, 'div.bootstrap-datetimepicker-widget .timepicker'); + assert.strictEqual( + document.querySelector('.datepicker .day.active').dataset.day, + '01/09/1997', + "Datepicker should have set the correct day" + ); + + picker.destroy(); + }); + + QUnit.test("pick a date", async function (assert) { + assert.expect(5); + + const picker = await createComponent(DatePicker, { + props: { date: moment('01/09/1997') }, + intercepts: { + 'datetime-changed': ev => { + assert.step('datetime-changed'); + assert.strictEqual(ev.detail.date.format('MM/DD/YYYY'), '02/08/1997', + "Event should transmit the correct date"); + }, + } + }); + const input = picker.el.querySelector('.o_datepicker_input'); + + await testUtils.dom.click(input); + await testUtils.dom.click(document.querySelector('.datepicker th.next')); // next month + + assert.verifySteps([]); + + await testUtils.dom.click(document.querySelectorAll('.datepicker table td')[15]); // previous day + + assert.strictEqual(input.value, '02/08/1997'); + assert.verifySteps(['datetime-changed']); + + picker.destroy(); + }); + + QUnit.test("pick a date with locale", async function (assert) { + assert.expect(4); + + // weird shit of moment https://github.com/moment/moment/issues/5600 + // When month regex returns undefined, january is taken (first month of the default "nameless" locale) + const originalLocale = moment.locale(); + // Those parameters will make Moment's internal compute stuff that are relevant to the bug + const months = 'janvier_février_mars_avril_mai_juin_juillet_août_septembre_octobre_novembre_décembre'.split('_'); + const monthsShort = 'janv._févr._mars_avr._mai_juin_juil._août_custSept._oct._nov._déc.'.split('_'); + moment.defineLocale('frenchForTests', { months, monthsShort, code: 'frTest' , monthsParseExact: true}); + + const hasChanged = testUtils.makeTestPromise(); + const picker = await createComponent(DatePicker, { + translateParameters: { + date_format: "%d %b, %Y", // Those are important too + time_format: "%H:%M:%S", + }, + props: { date: moment('09/01/1997', 'MM/DD/YYYY') }, + intercepts: { + 'datetime-changed': ev => { + assert.step('datetime-changed'); + assert.strictEqual(ev.detail.date.format('MM/DD/YYYY'), '09/02/1997', + "Event should transmit the correct date"); + hasChanged.resolve(); + }, + } + }); + const input = picker.el.querySelector('.o_datepicker_input'); + await testUtils.dom.click(input); + + await testUtils.dom.click(document.querySelectorAll('.datepicker table td')[3]); // next day + + assert.strictEqual(input.value, '02 custSept., 1997'); + assert.verifySteps(['datetime-changed']); + + moment.locale(originalLocale); + moment.updateLocale('englishForTest', null); + + picker.destroy(); + }); + + QUnit.test("enter a date value", async function (assert) { + assert.expect(5); + + const picker = await createComponent(DatePicker, { + props: { date: moment('01/09/1997') }, + intercepts: { + 'datetime-changed': ev => { + assert.step('datetime-changed'); + assert.strictEqual(ev.detail.date.format('MM/DD/YYYY'), '02/08/1997', + "Event should transmit the correct date"); + }, + } + }); + const input = picker.el.querySelector('.o_datepicker_input'); + + assert.verifySteps([]); + + await testUtils.fields.editAndTrigger(input, '02/08/1997', ['change']); + + assert.verifySteps(['datetime-changed']); + + await testUtils.dom.click(input); + + assert.strictEqual( + document.querySelector('.datepicker .day.active').dataset.day, + '02/08/1997', + "Datepicker should have set the correct day" + ); + + picker.destroy(); + }); + + QUnit.test("Date format is correctly set", async function (assert) { + assert.expect(2); + + testUtils.patch(time, { getLangDateFormat: () => "YYYY/MM/DD" }); + const picker = await createComponent(DatePicker, { + props: { date: moment('01/09/1997') }, + }); + const input = picker.el.querySelector('.o_datepicker_input'); + + assert.strictEqual(input.value, '1997/01/09'); + + // Forces an update to assert that the registered format is the correct one + await testUtils.dom.click(input); + + assert.strictEqual(input.value, '1997/01/09'); + + picker.destroy(); + testUtils.unpatch(time); + }); + + QUnit.module('DateTimePicker'); + + QUnit.test("basic rendering", async function (assert) { + assert.expect(11); + + const picker = await createComponent(DateTimePicker, { + props: { date: moment('01/09/1997 12:30:01') }, + }); + + assert.containsOnce(picker, 'input.o_input.o_datepicker_input'); + assert.containsOnce(picker, 'span.o_datepicker_button'); + assert.containsNone(document.body, 'div.bootstrap-datetimepicker-widget'); + + const input = picker.el.querySelector('input.o_input.o_datepicker_input'); + assert.strictEqual(input.value, '01/09/1997 12:30:01', "Value should be the one given"); + assert.strictEqual(input.dataset.target, `#${picker.el.id}`, + "DateTimePicker id should match its input target"); + + await testUtils.dom.click(input); + + assert.containsOnce(document.body, 'div.bootstrap-datetimepicker-widget .datepicker'); + assert.containsOnce(document.body, 'div.bootstrap-datetimepicker-widget .timepicker'); + assert.strictEqual( + document.querySelector('.datepicker .day.active').dataset.day, + '01/09/1997', + "Datepicker should have set the correct day"); + + assert.strictEqual(document.querySelector('.timepicker .timepicker-hour').innerText.trim(), '12', + "Datepicker should have set the correct hour"); + assert.strictEqual(document.querySelector('.timepicker .timepicker-minute').innerText.trim(), '30', + "Datepicker should have set the correct minute"); + assert.strictEqual(document.querySelector('.timepicker .timepicker-second').innerText.trim(), '01', + "Datepicker should have set the correct second"); + + picker.destroy(); + }); + + QUnit.test("pick a date and time", async function (assert) { + assert.expect(5); + + const picker = await createComponent(DateTimePicker, { + props: { date: moment('01/09/1997 12:30:01') }, + intercepts: { + 'datetime-changed': ev => { + assert.step('datetime-changed'); + assert.strictEqual(ev.detail.date.format('MM/DD/YYYY HH:mm:ss'), '02/08/1997 15:45:05', + "Event should transmit the correct date"); + }, + } + }); + const input = picker.el.querySelector('input.o_input.o_datepicker_input'); + + await testUtils.dom.click(input); + await testUtils.dom.click(document.querySelector('.datepicker th.next')); // February + await testUtils.dom.click(document.querySelectorAll('.datepicker table td')[15]); // 08 + await testUtils.dom.click(document.querySelector('a[title="Select Time"]')); + await testUtils.dom.click(document.querySelector('.timepicker .timepicker-hour')); + await testUtils.dom.click(document.querySelectorAll('.timepicker .hour')[15]); // 15h + await testUtils.dom.click(document.querySelector('.timepicker .timepicker-minute')); + await testUtils.dom.click(document.querySelectorAll('.timepicker .minute')[9]); // 45m + await testUtils.dom.click(document.querySelector('.timepicker .timepicker-second')); + + assert.verifySteps([]); + + await testUtils.dom.click(document.querySelectorAll('.timepicker .second')[1]); // 05s + + assert.strictEqual(input.value, '02/08/1997 15:45:05'); + assert.verifySteps(['datetime-changed']); + + picker.destroy(); + }); + + QUnit.test("pick a date and time with locale", async function (assert) { + assert.expect(5); + + // weird shit of moment https://github.com/moment/moment/issues/5600 + // When month regex returns undefined, january is taken (first month of the default "nameless" locale) + const originalLocale = moment.locale(); + // Those parameters will make Moment's internal compute stuff that are relevant to the bug + const months = 'janvier_février_mars_avril_mai_juin_juillet_août_septembre_octobre_novembre_décembre'.split('_'); + const monthsShort = 'janv._févr._mars_avr._mai_juin_juil._août_custSept._oct._nov._déc.'.split('_'); + moment.defineLocale('frenchForTests', { months, monthsShort, code: 'frTest' , monthsParseExact: true}); + + const hasChanged = testUtils.makeTestPromise(); + const picker = await createComponent(DateTimePicker, { + translateParameters: { + date_format: "%d %b, %Y", // Those are important too + time_format: "%H:%M:%S", + }, + props: { date: moment('09/01/1997 12:30:01', 'MM/DD/YYYY HH:mm:ss') }, + intercepts: { + 'datetime-changed': ev => { + assert.step('datetime-changed'); + assert.strictEqual(ev.detail.date.format('MM/DD/YYYY HH:mm:ss'), '09/02/1997 15:45:05', + "Event should transmit the correct date"); + hasChanged.resolve(); + }, + } + }); + + const input = picker.el.querySelector('input.o_input.o_datepicker_input'); + + await testUtils.dom.click(input); + await testUtils.dom.click(document.querySelectorAll('.datepicker table td')[3]); // next day + await testUtils.dom.click(document.querySelector('a[title="Select Time"]')); + await testUtils.dom.click(document.querySelector('.timepicker .timepicker-hour')); + await testUtils.dom.click(document.querySelectorAll('.timepicker .hour')[15]); // 15h + await testUtils.dom.click(document.querySelector('.timepicker .timepicker-minute')); + await testUtils.dom.click(document.querySelectorAll('.timepicker .minute')[9]); // 45m + await testUtils.dom.click(document.querySelector('.timepicker .timepicker-second')); + + assert.verifySteps([]); + await testUtils.dom.click(document.querySelectorAll('.timepicker .second')[1]); // 05s + + assert.strictEqual(input.value, '02 custSept., 1997 15:45:05'); + assert.verifySteps(['datetime-changed']); + + await hasChanged; + + moment.locale(originalLocale); + moment.updateLocale('frenchForTests', null); + + picker.destroy(); + }); + + QUnit.test("enter a datetime value", async function (assert) { + assert.expect(9); + + const picker = await createComponent(DateTimePicker, { + props: { date: moment('01/09/1997 12:30:01') }, + intercepts: { + 'datetime-changed': ev => { + assert.step('datetime-changed'); + assert.strictEqual(ev.detail.date.format('MM/DD/YYYY HH:mm:ss'), '02/08/1997 15:45:05', + "Event should transmit the correct date"); + }, + } + }); + const input = picker.el.querySelector('.o_datepicker_input'); + + assert.verifySteps([]); + + await testUtils.fields.editAndTrigger(input, '02/08/1997 15:45:05', ['change']); + + assert.verifySteps(['datetime-changed']); + + await testUtils.dom.click(input); + + assert.strictEqual(input.value, '02/08/1997 15:45:05'); + assert.strictEqual( + document.querySelector('.datepicker .day.active').dataset.day, + '02/08/1997', + "Datepicker should have set the correct day" + ); + assert.strictEqual(document.querySelector('.timepicker .timepicker-hour').innerText.trim(), '15', + "Datepicker should have set the correct hour"); + assert.strictEqual(document.querySelector('.timepicker .timepicker-minute').innerText.trim(), '45', + "Datepicker should have set the correct minute"); + assert.strictEqual(document.querySelector('.timepicker .timepicker-second').innerText.trim(), '05', + "Datepicker should have set the correct second"); + + picker.destroy(); + }); + + QUnit.test("Date time format is correctly set", async function (assert) { + assert.expect(2); + + testUtils.patch(time, { getLangDatetimeFormat: () => "hh:mm:ss YYYY/MM/DD" }); + const picker = await createComponent(DateTimePicker, { + props: { date: moment('01/09/1997 12:30:01') }, + }); + const input = picker.el.querySelector('.o_datepicker_input'); + + assert.strictEqual(input.value, '12:30:01 1997/01/09'); + + // Forces an update to assert that the registered format is the correct one + await testUtils.dom.click(input); + + assert.strictEqual(input.value, '12:30:01 1997/01/09'); + + picker.destroy(); + testUtils.unpatch(time); + }); + }); +}); |
