Scrollbar showing on mobile chrome

[spencerchubb]

The scrollbar shows on the chrome mobile browser even if there is nowhere to scroll to, such as if there is only one line.

It's not a huge issue but I would rather not have the scrollbar there if there's nothing to scroll.

I am using this css as a workaround

::-webkit-scrollbar {
  width: 0;
  background: transparent;
}

[kyle-mccarthy]

I think that this depends on the size of the text used for the text area in combination with the line height. FWIW, I don't see it when my browser's zoom is normal (100%) but when I set the zoom to 75% I see the scrollbar. I was able to fix it by making the overflow-y hidden.

[cduff]

I'm seeing this also. I created a simple CodeSandbox to reproduce:

https://codesandbox.io/s/react-textarea-autosize-mobile-chrome-issue-5jv4br

https://5jv4br.csb.app/

I'm then able to reproduce on https://www.lambdatest.com/ using their Google Pixel 5 - 5G, Android 11, Chrome configuration.

Playing a bit with font-size and line-height - it seems it could be caused by a rounding issue. If font-size x line-height results in an integer value then the scrollbar doesn't show, but otherwise it does?

[cduff]

Interestingly, the same issue does not occur when using the https://github.com/jackmoore/autosize package (which this package is supposedly a React version of?).

I've updated the CodeSandbox to compare the two:

https://codesandbox.io/s/react-textarea-autosize-mobile-chrome-issue-5jv4br

https://5jv4br.csb.app/

[Andarist]

I would accept a PR fixing this - but I don't currently have time to investigate this on my own.