diff --git a/packages/main/cypress/specs/TextArea.cy.tsx b/packages/main/cypress/specs/TextArea.cy.tsx
index bc64d6ad268f..ecb931be9ddb 100644
--- a/packages/main/cypress/specs/TextArea.cy.tsx
+++ b/packages/main/cypress/specs/TextArea.cy.tsx
@@ -397,8 +397,31 @@ describe("TextArea general interaction", () => {
.should("be.equal", initialTextareaSize);
});
});
+
+ it("should grow correctly when typing symbols (&)", () => {
+ cy.mount();
+
+ cy.get("[ui5-textarea]")
+ .as("textarea");
+
+ cy.get("@textarea")
+ .realClick();
+
+ cy.get("@textarea")
+ .then(textarea => {
+ const initialTextareaSize = textarea.height();
+
+ cy.focused()
+ .realType("&");
+
+ cy.get("@textarea")
+ .invoke("height")
+ .should("be.equal", initialTextareaSize);
+ });
+ });
});
+
describe("When having max length set", () => {
it("prevents input when max is reached", () => {
cy.mount();
diff --git a/packages/main/src/TextArea.ts b/packages/main/src/TextArea.ts
index 22a8e552beaa..e4a4e44f49df 100644
--- a/packages/main/src/TextArea.ts
+++ b/packages/main/src/TextArea.ts
@@ -492,7 +492,7 @@ class TextArea extends UI5Element implements IFormInputElement {
}
_tokenizeText(value: string) {
- const tokenizedText = value.replace(/&/gm, "&").replace(/"/gm, """).replace(/'/gm, "'").replace(//gm, ">")
.split("\n");
diff --git a/packages/main/src/themes/TextArea.css b/packages/main/src/themes/TextArea.css
index 74491d68efa5..b2a946b0cfa8 100644
--- a/packages/main/src/themes/TextArea.css
+++ b/packages/main/src/themes/TextArea.css
@@ -154,8 +154,7 @@
max-height: 94vh;
min-height: calc((var(--_textarea_rows) * var(--_ui5_textarea_line_height)) * var(--sapFontSize) + var(--_ui5_textarea_padding_top) + var(--_ui5_textarea_padding_bottom));
word-break: break-all;
- padding-top: var(--_ui5_textarea_padding_top);
- padding-bottom: var(--_ui5_textarea_padding_bottom);
+ padding: var(--_ui5_textarea_padding_top) var(--_ui5_textarea_padding_right_and_left) var(--_ui5_textarea_padding_bottom);
font-size: var(--sapFontSize);
font-family: "72override", var(--sapFontFamily);
white-space: pre-wrap;