fix(textarea): scrolling, text selection, reduced DOM manipulation. #7553
Conversation
| // This is necessary, because browsers fire a `mouseup` right after the element | ||
| // has been focused. In some browsers (Firefox in particular) this can clear the | ||
| // selection. There are examples of the problem in issue #7487. | ||
| element.on('mouseup', preventMouseUp); |
There was a problem hiding this comment.
Wouldn't it make more sense to keep the mouseup event registered and just change a state in the directive?. Adding / Removing events is more harmful, than just an empty event handler.
There was a problem hiding this comment.
Nevermind, we can keep track of it in the mouseup, I'll give it a try.
That would mean adding another handler for blur, though.
crisbeto
force-pushed
the
fix/textarea-grow
branch
from
a79d1e8
to
0ba5bae
Compare
| element[0].select(); | ||
| // Use HTMLInputElement#select to fix firefox select issues. | ||
| // The debounce is here for Edge's sake, otherwise the selection doesn't work. | ||
| preventMouseUp = true; |
There was a problem hiding this comment.
What happens if I focus the element using keyboard interaction? The mouseup event can't be triggered.
There was a problem hiding this comment.
Good point, it actually prevents the first click afterwards. Not sure how we could distinguish between the two though.
There was a problem hiding this comment.
When is the mouseup event usually called? Before the 1ms delay? I've got no time, to test that.
There was a problem hiding this comment.
I don't have it running atm either, but from what I remember it's afterwards. I'll take a closer look at it later.
There was a problem hiding this comment.
It's good now with resetting it from inside the $timeout. Also had time to test it out in most browsers.
There was a problem hiding this comment.
That's exactly what I've thought about. Great 👍
devversion
added
the
in progress
* Fixes `mdSelectOnFocus` not working in Edge and being unreliable in Firefox. * Fixes `textarea` not being scrollable once it is past it's minimum number of rows. * Fixes `textarea` not being scrollable if `mdNoAutogrow` is specified. * Tries to reduce the number of event listeners and the amount of DOM manipulation when resizing the `textarea`. Closes angular#7487.
crisbeto
force-pushed
the
fix/textarea-grow
branch
from
0ba5bae
to
526dbdb
Compare
crisbeto
added
pr: merge ready
| onChangeTextarea(); | ||
| return value; | ||
| } | ||
| var minRows = attr.hasOwnProperty('rows') ? parseInt(attr.rows) : NaN; |
There was a problem hiding this comment.
How can I now let the textarea grow?
There was a problem hiding this comment.
You don't specify the rows. It works in the same way as before, I just made it a one-liner.
There was a problem hiding this comment.
Ah, just rechecked with the latest version. Everything works fine 👍
* Fixes `mdSelectOnFocus` not working in Edge and being unreliable in Firefox. * Fixes `textarea` not being scrollable once it is past it's minimum number of rows. * Fixes `textarea` not being scrollable if `mdNoAutogrow` is specified. * Tries to reduce the number of event listeners and the amount of DOM manipulation when resizing the `textarea`. Fixes #7487. Closes #7553
|
Hope that PR solves that issue too: |
mdSelectOnFocusnot working in Edge and being unreliable in Firefox.textareanot being scrollable once it is past it's minimum number of rows.textareanot being scrollable ifmdNoAutogrowis specified.textarea.Closes #7487.