1287: Typing a comment causes the textarea to expand for every character typed

jackm*****@gmai***** (Google Code) (Is this you? Claim this profile.)
Aug. 27, 2009
What version are you running?
1.1 Alpha 1 on the demo site


What's the URL of the page containing the problem?
Any review page


What steps will reproduce the problem?
1. click "add comment"
2. focus the comment textarea
3. start typing

What is the expected output? What do you see instead?
notice the textarea grows in height by 1 line for every character typed

What operating system are you using? What browser?
WinXP Corporate, Chrome2.0

Please provide any additional information below.
david
#1 david
This is a bug in the version of webkit that Chrome uses.
  • +ThirdParty
#2 jackm*****@gmai***** (Google Code) (Is this you? Claim this profile.)
Never Once in my 5 years of GUI development have I EVER seen this happen without some
sort of bug/defect in the JavaScript. I find it very hard to believe that this issue
is native to Chrome.
chipx86
#3 chipx86
It's not just Review Board. There's actually a WebKit bug filed on this, and it was
fixed. Safari had the same problem and it went away once they took a new code drop.
Chrome has yet to upgrade to a version with the fix.

The bug is due to the method that Review Board and many other webapps use to provide
auto-resizable text fields, where it maintains a copy of the element off-screen and
uses it for sizing information. The bug in WebKit causes it to get the size wrong.

We want to support Chrome pretty bad, but until this is fixed by them taking a new
code drop, we can't. I've looked into workarounds and there's just little we can do
without really complicating things, except to wait.
#4 jackm*****@gmai***** (Google Code) (Is this you? Claim this profile.)
Can you not do something like this? (just pseudo-code here will need tweaking)

textArea.onfocus = function ()
{
   textArea.origSize = new Array( textArea.offsetWidth, textArea.offsetHeight );
}

textArea.onkeyup = function ()
{
   if (textArea.offsetWidth != textArea.origSize[0])
   {
      textArea.width = textArea.origSize[0];
   }

   if (textArea.offsetHeight != textArea.origSize[1])
   {
      textArea.width = textArea.origSize[1];
   }
}