Skip to content
Permalink
Browse files

[FIX] web: checkbox readonly is RO in list editable

Since f4fbaf1 the structure of checkboxes has been improved, now we
have something like:

```
 <input type="checkbox" id="checkbox-18" class="custom-control-input">
 <label for="checkbox-18" class="custom-control-label">&#8203;</label>
```

With the first input invisible (whilst before it was visible and the
clickable element).

This cause an issue in an editable list view:

- we have a boolean readonly field in a cell
- we are on focused on a line (not in the boolean field cell)
- we click on the boolean field

=> the check mark is toggled

This is because when we switch cell, we try to activate the widget of
the other cell. Before f4fbaf1 this issue did not happen since the
browser do not generate a click event when clicking a disabled checkbox.

With this changeset, a disabled FieldBoolean is not focusable as is the
case for other fields, so we can't "activate" it.

Without the fix, the added test fails with:

 [clicking disabled checkbox did not work]

opw-1958433
closes #32652

Signed-off-by: Aaron Bohy (aab) <aab@odoo.com>
  • Loading branch information...
nle-odoo committed Apr 12, 2019
1 parent 385342b commit 58c64558a9a3188edccd1c60042de9f6e639b4a1
Showing with 45 additions and 1 deletion.
  1. +1 −1 addons/web/static/src/js/fields/basic_fields.js
  2. +44 −0 addons/web/static/tests/views/list_tests.js
@@ -805,7 +805,7 @@ var FieldBoolean = AbstractField.extend({
* @returns {jQuery} the focusable checkbox input
*/
getFocusableElement: function () {
return this.$input || $();
return this.mode === 'readonly' ? $() : this.$input;
},
/**
* A boolean field is always set since false is a valid value.
@@ -4194,6 +4194,50 @@ QUnit.module('Views', {

list.destroy();
});

QUnit.test('readonly boolean in editable list is readonly', function (assert) {
assert.expect(6);

var list = createView({
View: ListView,
model: 'foo',
data: this.data,
arch: '<tree editable="bottom">' +
'<field name="foo"/>' +
'<field name="bar" attrs="{\'readonly\': [(\'foo\', \'!=\', \'yop\')]}"/>' +
'</tree>',
});

// clicking on disabled checkbox with active row does not work
var $disabledCell = list.$('.o_data_row:eq(1) .o_data_cell:last-child');
testUtils.dom.click($disabledCell.prev());
assert.containsOnce($disabledCell, ':disabled:checked');
var $disabledLabel = $disabledCell.find('.custom-control-label');
testUtils.dom.click($disabledLabel);
assert.containsOnce($disabledCell, ':checked',
"clicking disabled checkbox did not work"
);
assert.ok(
$(document.activeElement).is('input[type="text"]'),
"disabled checkbox is not focused after click"
);

// clicking on enabled checkbox with active row toggles check mark
var $enabledCell = list.$('.o_data_row:eq(0) .o_data_cell:last-child');
testUtils.dom.click($enabledCell.prev());
assert.containsOnce($enabledCell, ':checked:not(:disabled)');
var $enabledLabel = $enabledCell.find('.custom-control-label');
testUtils.dom.click($enabledLabel);
assert.containsNone($enabledCell, ':checked',
"clicking enabled checkbox worked and unchecked it"
);
assert.ok(
$(document.activeElement).is('input[type="checkbox"]'),
"enabled checkbox is focused after click"
);

list.destroy();
});
});

});

0 comments on commit 58c6455

Please sign in to comment.
You can’t perform that action at this time.