[FIX] spreadsheet,web: use dot or comma in date format

Date fields are changing format if you type it in instead of using the
date selector calendar popup

Steps to reproduce:
1. Install Time Off
2. Open the current language and change the date format to `%d.%m.%Y`
3. Go to Time Off > Approvals > Allocations
4. Create a new allocation
5. Change the validity period to 10.03.2023 (by typing it in, not using
   the datepicker) and click out of the field
6. The date displayed is changed to 2010/03/20 or 20.03.2010 (if the
   datepicker was opened)

Solution:
Add dot and comma as a possible character for static format
Also deduplicated function isValidStaticFormat so we have a single
definition

Problem:
Formats using dots were not considered as valid static format so the
value entered was parsed with the format `yyyy/MM/dd` instead

opw-3081268

closes odoo/odoo#112218

X-original-commit: 18d6944510b55a4de21be050b8fef327f00e71d5
Signed-off-by: Rémi Rahir (rar) <rar@odoo.com>
Signed-off-by: Guillaume Merlin (megu) <megu@odoo.com>
This commit is contained in:
MerlinGuillaume
2023-02-08 16:50:00 +01:00
parent 94e7d25273
commit a021c48417
3 changed files with 27 additions and 23 deletions
@@ -3,18 +3,6 @@
import { DatePicker } from "@web/core/datepicker/datepicker";
const { DateTime } = luxon;
/**
* @param {string} format
* @returns {boolean}
*/
const isValidStaticFormat = (format) => {
try {
return /^[\d\s/:-]+$/.test(DateTime.local().toFormat(format));
} catch {
return false;
}
};
const DEFAULT_DATE = DateTime.local();
export class YearPicker extends DatePicker {
/**
@@ -33,7 +21,7 @@ export class YearPicker extends DatePicker {
getOptions(useStatic = false) {
return {
format:
!useStatic || isValidStaticFormat(this.format) ? this.format : this.staticFormat,
!useStatic || this.isValidStaticFormat(this.format) ? this.format : this.staticFormat,
locale: DEFAULT_DATE.locale,
};
}
@@ -27,14 +27,6 @@ const { DateTime } = luxon;
let datePickerId = 0;
/**
* @param {string} format
* @returns {boolean}
*/
function isValidStaticFormat(format) {
return /^[\d\s/:-]+$/.test(DateTime.local().toFormat(format));
}
/**
* @param {Function} fn
* @returns {[any, null] | [null, Error]}
@@ -124,10 +116,18 @@ export class DatePicker extends Component {
// Protected
//---------------------------------------------------------------------
/**
* @param {string} format
* @returns {boolean}
*/
isValidStaticFormat(format) {
return /^[\d\s\/.,:-]+$/.test(DateTime.local().toFormat(format));
}
getOptions(useStatic = false) {
return {
format:
!useStatic || isValidStaticFormat(this.format) ? this.format : this.staticFormat,
!useStatic || this.isValidStaticFormat(this.format) ? this.format : this.staticFormat,
locale: this.props.locale || (this.date && this.date.locale),
};
}
@@ -180,7 +180,7 @@ export class DatePicker extends Component {
*/
bootstrapDateTimePicker(commandOrParams) {
if (typeof commandOrParams === "object") {
const format = isValidStaticFormat(this.format) ? this.format : this.staticFormat;
const format = this.isValidStaticFormat(this.format) ? this.format : this.staticFormat;
const params = {
...commandOrParams,
date: this.date || null,
@@ -495,6 +495,22 @@ QUnit.module("Components", ({ beforeEach }) => {
assert.verifySteps(["datetime-changed"]);
});
QUnit.test("Datepicker works with dots and commas in format", async (assert) => {
assert.expect(2);
await mountPicker(DateTimePicker, {
date: DateTime.fromFormat("10/03/2023 13:14:27", "dd/MM/yyyy HH:mm:ss"),
format: "dd.MM,yyyy",
});
let input = target.querySelector(".o_datepicker_input");
assert.strictEqual(input.value, "10.03,2023");
await click(input);
assert.strictEqual(input.value, "10.03,2023");
});
QUnit.test("custom filter date", async function (assert) {
assert.expect(3);
class MockedSearchModel extends ActionModel {