fix(textarea-autoresize): add a bit of padding when setting textarea height (#1891)

Co-authored-by: Garrick Aden-Buie <[email protected]>

Author: cpsievert

js/chat/chat.scss

@@ -32,7 +32,7 @@ shiny-chat-container {
     text-underline-offset: 4px;
     text-decoration-thickness: 2px;
 
-    padding: 2px;
+    padding-inline: 2px;
 
     &:hover {
       text-decoration-style: solid;

js/text-area/textarea-autoresize.ts

@@ -49,7 +49,7 @@ function update_height(target: HTMLTextAreaElement) {
   if (target.scrollHeight > 0) {
     // Automatically resize the textarea to fit its content.
     target.style.height = "auto";
-    target.style.height = target.scrollHeight + "px";
+    target.style.height = target.scrollHeight + 2 + "px";
   } else {
     // The textarea is not visible on the page, therefore it has a 0 scroll height.
 

shiny/www/py-shiny/chat/chat.css

@@ -27,7 +27,7 @@ function callUpdateHeightWhenTargetIsVisible(target) {
 function update_height(target) {
   if (target.scrollHeight > 0) {
     target.style.height = "auto";
-    target.style.height = target.scrollHeight + "px";
+    target.style.height = target.scrollHeight + 2 + "px";
   } else {
     callUpdateHeightWhenTargetIsVisible(target);
   }

shiny/www/py-shiny/chat/chat.css.map

@@ -30,8 +30,8 @@ def test_accordion(page: Page, local_app: ShinyAppProc, is_webkit: bool) -> None
         # Skip the rest of the test for webkit.
         # Heights are not consistent with chrome and firefox
         return
-    expect_to_have_style(test_text_area.loc, "height", "125px")
-    expect_to_have_style(test_text_area_w_rows.loc, "height", "125px")
+    expect_to_have_style(test_text_area.loc, "height", "127px")
+    expect_to_have_style(test_text_area_w_rows.loc, "height", "127px")
 
     # Make sure the `rows` is consistent
     test_text_area.expect_rows("1")
@@ -42,6 +42,6 @@ def test_accordion(page: Page, local_app: ShinyAppProc, is_webkit: bool) -> None
     test_text_area_w_rows.set("single row")
 
     # 1 row
-    expect_to_have_style(test_text_area.loc, "height", "35px")
+    expect_to_have_style(test_text_area.loc, "height", "37px")
     # 4 rows
-    expect_to_have_style(test_text_area_w_rows.loc, "height", "102px")
+    expect_to_have_style(test_text_area_w_rows.loc, "height", "104px")