Do not show overflow-y in gr-editable-content Because of the way iron-autogrow-textarea works, There will never be a need to have a vertical scroll bar, as the text area expands accordingly. In cases where a horizontal scrollbar appeared (due to long lines of text), the height of the textarea shrank just enough for a vertical scrollbar to be added as well. There also appeared to be some browser quirks in which the scroll bars jumped around when they shouldn't. In order to prevent this from happening, hide overflow-y. Additionally, add box-sizing: border-box to all iron-autogrow-textarea instances, so that scrollbars appear correctly in shadow dom. Bug: Issue 6500 Change-Id: I28f3b47d656a246decd693f637040748ec4fd3a0
diff --git a/polygerrit-ui/app/elements/change/gr-confirm-abandon-dialog/gr-confirm-abandon-dialog.html b/polygerrit-ui/app/elements/change/gr-confirm-abandon-dialog/gr-confirm-abandon-dialog.html index f528876..2ec2142 100644 --- a/polygerrit-ui/app/elements/change/gr-confirm-abandon-dialog/gr-confirm-abandon-dialog.html +++ b/polygerrit-ui/app/elements/change/gr-confirm-abandon-dialog/gr-confirm-abandon-dialog.html
@@ -46,6 +46,7 @@ --iron-autogrow-textarea { border: 1px solid #ddd; + box-sizing: border-box; font-family: var(--monospace-font-family); } }
diff --git a/polygerrit-ui/app/elements/change/gr-confirm-revert-dialog/gr-confirm-revert-dialog.html b/polygerrit-ui/app/elements/change/gr-confirm-revert-dialog/gr-confirm-revert-dialog.html index 94fd4ad..ffcd5e5 100644 --- a/polygerrit-ui/app/elements/change/gr-confirm-revert-dialog/gr-confirm-revert-dialog.html +++ b/polygerrit-ui/app/elements/change/gr-confirm-revert-dialog/gr-confirm-revert-dialog.html
@@ -41,6 +41,7 @@ --iron-autogrow-textarea { border: 1px solid #ddd; + box-sizing: border-box; font-family: var(--monospace-font-family); } }
diff --git a/polygerrit-ui/app/elements/diff/gr-confirm-delete-comment-dialog/gr-confirm-delete-comment-dialog.html b/polygerrit-ui/app/elements/diff/gr-confirm-delete-comment-dialog/gr-confirm-delete-comment-dialog.html index 33e8fe6..e828dc2 100644 --- a/polygerrit-ui/app/elements/diff/gr-confirm-delete-comment-dialog/gr-confirm-delete-comment-dialog.html +++ b/polygerrit-ui/app/elements/diff/gr-confirm-delete-comment-dialog/gr-confirm-delete-comment-dialog.html
@@ -46,6 +46,7 @@ --iron-autogrow-textarea { border: 1px solid #ddd; + box-sizing: border-box; font-family: var(--monospace-font-family); } }
diff --git a/polygerrit-ui/app/elements/diff/gr-diff-comment/gr-diff-comment.html b/polygerrit-ui/app/elements/diff/gr-diff-comment/gr-diff-comment.html index f67ef22..9ad0bf9 100644 --- a/polygerrit-ui/app/elements/diff/gr-diff-comment/gr-diff-comment.html +++ b/polygerrit-ui/app/elements/diff/gr-diff-comment/gr-diff-comment.html
@@ -38,6 +38,7 @@ font-family: var(--font-family); padding: .7em .7em; --iron-autogrow-textarea: { + box-sizing: border-box; padding: 2px; }; }
diff --git a/polygerrit-ui/app/elements/shared/gr-editable-content/gr-editable-content.html b/polygerrit-ui/app/elements/shared/gr-editable-content/gr-editable-content.html index 76453e4..e8c8037 100644 --- a/polygerrit-ui/app/elements/shared/gr-editable-content/gr-editable-content.html +++ b/polygerrit-ui/app/elements/shared/gr-editable-content/gr-editable-content.html
@@ -31,6 +31,8 @@ width: 100%; --iron-autogrow-textarea: { + box-sizing: border-box; + overflow-y: hidden; white-space: pre; }; }
diff --git a/polygerrit-ui/app/styles/gr-form-styles.html b/polygerrit-ui/app/styles/gr-form-styles.html index 556ce20..04346fe 100644 --- a/polygerrit-ui/app/styles/gr-form-styles.html +++ b/polygerrit-ui/app/styles/gr-form-styles.html
@@ -97,6 +97,7 @@ --iron-autogrow-textarea: { border: 1px solid #d1d2d3; border-radius: 2px; + box-sizing: border-box; font-size: 1em; padding: .25em .15em 0 .15em; }