Bug 1461509 - Don't allow clearing fields in date / time inputs when using backspace if disabled or readonly. r=smaug

Differential Revision: https://phabricator.services.mozilla.com/D40485
This commit is contained in:
Emilio Cobos Álvarez 2019-08-02 22:34:58 +02:00
parent 9ab52ef858
commit aef0223323
3 changed files with 40 additions and 11 deletions

View File

@ -40,6 +40,7 @@ skip-if = android_version == '18' # Android, bug 1147974
[test_input_datetime_focus_blur_events.html]
[test_input_datetime_focus_state.html]
[test_input_datetime_hidden.html]
[test_input_datetime_readonly.html]
[test_input_datetime_reset_button.html]
[test_input_datetime_reset_default_value_input_change_event.html]
[test_input_datetime_tabindex.html]

View File

@ -0,0 +1,20 @@
<!doctype html>
<title>Test for bug 1461509</title>
<script src="/tests/SimpleTest/SimpleTest.js"></script>
<script src="/tests/SimpleTest/EventUtils.js"></script>
<link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/>
<input id="i" type="date" value="1995-11-20" readonly required>
<script>
SimpleTest.waitForExplicitFinish();
SimpleTest.waitForFocus(function() {
let input = document.getElementById("i");
let value = input.value;
isnot(value, "", "should have a value");
input.focus();
synthesizeKey("KEY_Backspace");
is(input.value, value, "Value shouldn't change");
SimpleTest.finish();
});
</script>

View File

@ -514,6 +514,10 @@ this.DateTimeInputBaseImplWidget = class {
return this.mInputElement.hasAttribute("readonly");
}
isEditable() {
return !this.isDisabled() && !this.isReadonly();
}
isRequired() {
return this.mInputElement.hasAttribute("required");
}
@ -627,10 +631,14 @@ this.DateTimeInputBaseImplWidget = class {
break;
}
case "Backspace": {
let targetField = aEvent.originalTarget;
this.clearFieldValue(targetField);
this.setInputValueFromFields();
aEvent.preventDefault();
// TODO(emilio, bug 1571533): These functions should look at
// defaultPrevented.
if (this.isEditable()) {
let targetField = aEvent.originalTarget;
this.clearFieldValue(targetField);
this.setInputValueFromFields();
aEvent.preventDefault();
}
break;
}
case "ArrowRight":
@ -671,7 +679,7 @@ this.DateTimeInputBaseImplWidget = class {
aEvent.target
);
if (aEvent.defaultPrevented || this.isDisabled() || this.isReadonly()) {
if (aEvent.defaultPrevented || !this.isEditable()) {
return;
}
@ -784,7 +792,7 @@ this.DateInputImplWidget = class extends DateTimeInputBaseImplWidget {
clearInputFields(aFromInputElement) {
this.log("clearInputFields");
if (this.isDisabled() || this.isReadonly()) {
if (!this.isEditable()) {
return;
}
@ -895,7 +903,7 @@ this.DateInputImplWidget = class extends DateTimeInputBaseImplWidget {
}
handleKeypress(aEvent) {
if (this.isDisabled() || this.isReadonly()) {
if (!this.isEditable()) {
return;
}
@ -953,7 +961,7 @@ this.DateInputImplWidget = class extends DateTimeInputBaseImplWidget {
}
handleKeyboardNav(aEvent) {
if (this.isDisabled() || this.isReadonly()) {
if (!this.isEditable()) {
return;
}
@ -1461,7 +1469,7 @@ this.TimeInputImplWidget = class extends DateTimeInputBaseImplWidget {
clearInputFields(aFromInputElement) {
this.log("clearInputFields");
if (this.isDisabled() || this.isReadonly()) {
if (!this.isEditable()) {
return;
}
@ -1560,7 +1568,7 @@ this.TimeInputImplWidget = class extends DateTimeInputBaseImplWidget {
}
handleKeyboardNav(aEvent) {
if (this.isDisabled() || this.isReadonly()) {
if (!this.isEditable()) {
return;
}
@ -1612,7 +1620,7 @@ this.TimeInputImplWidget = class extends DateTimeInputBaseImplWidget {
}
handleKeypress(aEvent) {
if (this.isDisabled() || this.isReadonly()) {
if (!this.isEditable()) {
return;
}