From 6a4e3dc030d4b74671347cac0c4a6adca3cd67da Mon Sep 17 00:00:00 2001
From: "Xavier BOL (xbo)" <xbo@odoo.com>
Date: Tue, 4 Oct 2022 16:48:01 +0200
Subject: [PATCH] [FIX] web: allow to change the row on textarea in TextField
 with a prop

Before this commit, the rows attribute given on the TextField component
was always 2, it is not possible to alter it without overriding the
component.

This commit adds a props to be able to update the rows with a prop
called `rowCount` and this prop can be set via `rows` attribute set on
the field.

task-2947516

X-original-commit: 110915c80c2a2578563283b1744e0e88d80ac4bb
---
 .../src/views/fields/text/text_field.js       | 21 ++++++++++++++----
 .../tests/views/fields/text_field_tests.js    | 22 +++++++++++++++++++
 2 files changed, 39 insertions(+), 4 deletions(-)

diff --git a/addons/web/static/src/views/fields/text/text_field.js b/addons/web/static/src/views/fields/text/text_field.js
index d44e1353253..95466e97844 100644
--- a/addons/web/static/src/views/fields/text/text_field.js
+++ b/addons/web/static/src/views/fields/text/text_field.js
@@ -6,6 +6,7 @@ import { useInputField } from "../input_field_hook";
 import { standardFieldProps } from "../standard_field_props";
 import { TranslationButton } from "../translation_button";
 import { useDynamicPlaceholder } from "../dynamicplaceholder_hook";
+import { parseInteger } from '../parsers';
 
 const { Component, useEffect, onMounted, onWillUnmount, useRef } = owl;
 
@@ -67,7 +68,7 @@ export class TextField extends Component {
         return 50;
     }
     get rowCount() {
-        return 2;
+        return this.props.rowCount;
     }
 
     resize() {
@@ -105,23 +106,31 @@ TextField.template = "web.TextField";
 TextField.components = {
     TranslationButton,
 };
-TextField.defaultProps = {dynamicPlaceholder: false};
+TextField.defaultProps = {
+    dynamicPlaceholder: false,
+    rowCount: 2,
+};
 TextField.props = {
     ...standardFieldProps,
     isTranslatable: { type: Boolean, optional: true },
     placeholder: { type: String, optional: true },
     dynamicPlaceholder: { type: Boolean, optional: true},
+    rowCount: { type: Number, optional: true },
 };
 
 TextField.displayName = _lt("Multiline Text");
 TextField.supportedTypes = ["html", "text"];
 
 TextField.extractProps = ({ attrs, field }) => {
-    return {
+    const props = {
         isTranslatable: field.translate,
         placeholder: attrs.placeholder,
         dynamicPlaceholder: attrs.options.dynamic_placeholder,
     };
+    if (attrs.rows) {
+        props.rowCount = parseInteger(attrs.rows);
+    }
+    return props;
 };
 
 registry.category("fields").add("text", TextField);
@@ -131,8 +140,12 @@ export class ListTextField extends TextField {
         return 0;
     }
     get rowCount() {
-        return 1;
+        return this.props.rowCount;
     }
 }
+ListTextField.defaultProps = {
+    ...TextField.defaultProps,
+    rowCount: 1,
+};
 
 registry.category("fields").add("list.text", ListTextField);
diff --git a/addons/web/static/tests/views/fields/text_field_tests.js b/addons/web/static/tests/views/fields/text_field_tests.js
index 62ec480b07a..76459e2772e 100644
--- a/addons/web/static/tests/views/fields/text_field_tests.js
+++ b/addons/web/static/tests/views/fields/text_field_tests.js
@@ -240,6 +240,28 @@ QUnit.module("Fields", (hooks) => {
         );
     });
 
+    QUnit.test("set row on text fields", async function (assert) {
+        serverData.models.partner.fields.foo.type = "text";
+
+        await makeView({
+            type: "form",
+            resModel: "partner",
+            resId: 1,
+            serverData,
+            arch: `
+                <form>
+                    <field name="foo" rows="4"/>
+                </form>`,
+        });
+
+        const textarea = target.querySelector("textarea");
+        assert.strictEqual(
+            textarea.rows,
+            4,
+            "rowCount should be the one set on the field",
+        );
+    });
+
     QUnit.test(
         "autoresize of text fields is done when switching to edit mode",
         async function (assert) {