[FIX] web: correctly compute colspan of empty line in list renderer

Previously, the colspan of empty lines in list view did not account for
the fact that the column with the delete action is not always present,
resulting in incorrect colspan on empty lines when it is not.

This commit fixes that by accounting for it, and also fixes the size of
the header of that column, which is supposed to be fixed at 32px but
wasn't in some circumstances.

closes odoo/odoo#98711

Signed-off-by: Aaron Bohy (aab) <aab@odoo.com>
This commit is contained in:
Samuel Degueldre
2022-08-25 03:11:45 +02:00
committed by Aaron Bohy
parent 545e2378ab
commit f00df383ea
3 changed files with 44 additions and 4 deletions
@@ -203,7 +203,7 @@ export class ListRenderer extends Component {
}
const table = this.tableRef.el;
const headers = [...table.querySelectorAll("thead th")];
const headers = [...table.querySelectorAll("thead th:not(.o_list_record_remove_header)")];
if (!this.columnWidths || !this.columnWidths.length) {
// no column widths to restore
@@ -333,6 +333,17 @@ export class ListRenderer extends Component {
return this.props.list.fields;
}
get nbCols() {
let nbCols = this.state.columns.length;
if (this.hasSelectors) {
nbCols++;
}
if (this.props.activeActions && this.props.activeActions.onDelete) {
nbCols++;
}
return nbCols;
}
canUseFormatter(column, record) {
return (
!record.isInEdition && !column.widget && record.fields[column.name].type !== "boolean"
@@ -75,7 +75,7 @@
</t>
<tr t-if="displayRowCreates">
<td t-if="withHandleColumn"/>
<td t-att-colspan="state.columns.length + 1"
<td t-att-colspan="withHandleColumn ? nbCols - 1 : nbCols"
class="o_field_x2many_list_row_add"
t-on-keydown.synthetic="(ev) => this.onCellKeydown(ev, null)"
>
@@ -105,7 +105,7 @@
</tr>
<t t-if="!props.list.isGrouped">
<tr t-foreach="getEmptyRowIds" t-as="emptyRowId" t-key="emptyRowId">
<td t-att-colspan="state.columns.length + 1">&#8203;</td>
<td t-att-colspan="nbCols">&#8203;</td>
</tr>
</t>
</t>
@@ -119,7 +119,7 @@
<tr t-if="!group.list.isGrouped and props.editable and props.activeActions['create']">
<td t-if="hasSelectors"/>
<td
t-att-colspan="state.columns.length + 1"
t-att-colspan="hasSelector ? nbCols - 1 : nbCols"
class="o_group_field_row_add"
>
<a href="#"
@@ -3123,6 +3123,35 @@ QUnit.module("Views", (hooks) => {
}
);
QUnit.test("colspan of empty lines is correct in readonly and edit", async function (assert) {
serverData.models.foo.fields.foo_o2m = {
string: "Foo O2M",
type: "one2many",
relation: "foo",
};
await makeView({
type: "form",
resModel: "foo",
serverData,
resId: 1,
mode: "readonly",
arch: `
<form>
<sheet>
<field name="foo_o2m">
<tree editable="bottom">
<field name="int_field"/>
</tree>
</field>
</sheet>
</form>`,
});
assert.strictEqual(target.querySelector("tbody td").getAttribute("colspan"), "1");
await clickEdit(target);
// in edit mode, the delete action is available and the empty lines should cover that col
assert.strictEqual(target.querySelector("tbody td").getAttribute("colspan"), "2");
});
QUnit.test(
"width of some fields should be hardcoded if no data, and list initially invisible",
async function (assert) {