Closed Bug 1266547 Opened 4 years ago Closed 3 years ago

Can not move cursor by touch in Facebook's comment response field

Categories

(Web Compatibility :: Mobile, defect)

defect
Not set

Tracking

(platform-rel +)

RESOLVED FIXED
Tracking Status
platform-rel --- +

People

(Reporter: hsteen, Unassigned)

References

()

Details

(Whiteboard: [sitewait] [country-all] [facebook] [css] [platform-rel-Facebook] )

This CSS prevents moving the cursor around by touch in the Facebook textareas to reply to other comments:

.touch input, .touch textarea {
    -moz-user-select: auto;
}

https://static.xx.fbcdn.net/rsrc.php/v2/yt/r/fOGZ913wzZg.css

I'm not sure if we're doing this correctly or not.. If it is correct, please accept my apologies and move the bug to tech evangelism.
See Also: → 1235666
driveby: not an expert, but I'd noticed that pattern in earlier discussions

As per [0] (and I've not tested) there's no |-moz-user-select: auto;| for re-enabling selection ...

the apparant solution is |-moz-user-select: text|

[0] https://developer.mozilla.org/en-US/docs/Web/CSS/user-select
Hm.. Now I'm confused. Disabling that style from devtools solved the problem but making a minimal test case doesn't seem to support my belief that this styling was the cause..
That styling *and* a -moz-user-select:none set on an ancestor causes the problem. Somehow the "auto" value makes the TEXTAREA default to inherit the "none" where it would otherwise default to "text".

Facebook should switch to this:

.touch input, .touch textarea {
    -moz-user-select: text;
}
Component: Keyboards and IME → Mobile
Product: Firefox for Android → Tech Evangelism
Bringing it to Facebook's attention. Should be an easy fix :)
Whiteboard: [sitewait] [country-all] [facebook] [css]
Right, -moz-user-select:none causes all children down the tree to loses selectability. The -moz-user-select:auto is ignored.
But that's not what I was seeing (would have been easier to figure out). Here if I remove the -moz-user-select:auto but leave the -moz-user-select:none, I *can* move the cursor around in content inside TEXTAREA. Also, when auto is disabled getComputedStyle(textarea).MozUserSelect returns 'text', not 'none', and the devtools computed style view show nothing for -moz-user-select.

It's like -moz-user-select:auto makes some aspect of the -moz-user-select:none state apply to the TEXTAREA where it otherwise wouldn't..? Strange, but we have a simple fix for Facebook so I don't think studying this further is useful.
Duplicate of this bug: 1268419
Duplicate of this bug: 1268786
Whiteboard: [sitewait] [country-all] [facebook] [css] → [sitewait] [country-all] [facebook] [css][platform-rel-Facebook]
platform-rel: --- → ?
platform-rel: ? → +
Any progress on this bug? Been months and a major usability issue.     
Its really frustrating to have think in advance and then type it down.
I guess that means it's not fixed. Let's move back to contactready and ping Facebook about it. Comment #4 suggests Hallvord contacted them with the fix (I'm guessing on our private mailing list) from Comment #3, but they could probably use a re-ping.

Karl, can you get in touch with FB again?
Flags: needinfo?(kdubost)
Whiteboard: [sitewait] [country-all] [facebook] [css][platform-rel-Facebook] → [contactready] [country-all] [facebook] [css][platform-rel-Facebook]
Sure.

recontacted today on the partner list.
Flags: needinfo?(kdubost)
Whiteboard: [contactready] [country-all] [facebook] [css][platform-rel-Facebook] → [sitewait] [country-all] [facebook] [css] [platform-rel-Facebook]
Duplicate of this bug: 1310598
Rank: 22
Duplicate of this bug: 1322665
bull500, does this still reproduce? There was a note that a fix was going out in December -- thanks!
Flags: needinfo?(bullionareboy)
(In reply to Mike Taylor [:miketaylr] from comment #14)
> bull500, does this still reproduce? There was a note that a fix was going
> out in December -- thanks!

Mike im sorry, i've quit facebook.  
IIRC it did start working some point in late December or January but i cannot confirm it.
Flags: needinfo?(bullionareboy)
No worries, thanks bull500! Adam, would you be able to test?
Flags: needinfo?(astevenson)
Looks like it's working from my test. I'll document my steps to ensure I'm not missing something here:

1) Go to facebook.com in Firefox Android
2) Find a comment on a post
3) Tap reply
4) Type a sentence
5) Move cursor around 

The cursor moves around the textarea as expected.
Flags: needinfo?(astevenson)
(In reply to Adam Stevenson [:adamopenweb] from comment #17)
> Looks like it's working from my test. I'll document my steps to ensure I'm
> not missing something here:
> 
> 1) Go to facebook.com in Firefox Android
> 2) Find a comment on a post
> 3) Tap reply
> 4) Type a sentence
> 5) Move cursor around 
> 
> The cursor moves around the textarea as expected.

Could you also try pasting a multi line paragraph and checking if the cursor moves as well?  
Do try on some brand pages - its where i noticed to happen
Testing on the Netflix page. I pasted a two paragraph long "comment" into the reply box. The cursor moves around properly. It's not the greatest experience, moving a cursor around this tiny text area, but it works.
Sounds like we can close this as fixed -- thanks!
Status: NEW → RESOLVED
Closed: 3 years ago
Resolution: --- → FIXED
Product: Tech Evangelism → Web Compatibility
You need to log in before you can comment on or make changes to this bug.