1125045 - A vertical white rectangle shows up in right hand side in APN editor if tapping "Protocol"/"Roaming Protocol" drop down list when keyboard appear.

Status: VERIFIED FIXED

(Firefox OS Graveyard :: General, defect)

Description

[Gerry Chang [:gchang]]

### Steps:
1. Open Settings app
2. Navigate to Cellular & Data > SIM 1 in SIM Settings > APN Settings > Data Settings
3. Tap "Add New APN"
4. Scroll down to bottom
5. Long press "default" in APN Type to trigger utility bubble
6. Scroll up a little bit so that "Protocol" & "Roaming Protocol" items can be tapped
7. Tap "Protocol" or "Roaming Protocol", choose "IPv4", and tap "OK" button


### Expected:
1. No vertical white rectangle shows up.

### Actual:
1. A vertical white rectangle shows up.

PS: 
This issue won't happen at tapping "Authentication".

### Reproduce rate
always

### Version:
Gaia-Rev        237008137f6d72b9cad25ff4faff14ff2c40ac63
Gecko-Rev       https://hg.mozilla.org/releases/mozilla-b2g37_v2_2/rev/be24dd482a83
Build-ID        20150122162504
Version         37.0a2
Device-Name     flame
FW-Release      4.4.2

Comment 1

[Gerry Chang [:gchang]]

Attachment: The image of white space showing up in right hand side

Comment 2

[Morris Tseng [:mtseng] [:Morris] (Inactive)]

I can reproduce this bug even if selection/touch caret is turn off. STR as following.

1. Using edit-prefs.sh to set those preferences to false. ("selectioncaret.enabled", "touchcaret.enabled")
2. Open Settings app
3. Navigate to Cellular & Data > SIM 1 in SIM Settings > APN Settings > Data Settings
4. Tap "Add New APN"
5. Scroll down to bottom
6. Use WebIDE to select "Default".
7. Scroll up a little bit so that "Protocol" & "Roaming Protocol" items can be tapped
8. Tap "Protocol" or "Roaming Protocol", choose "IPv4", and tap "OK" button

Main difference is step 1 and 5. I think this is not related to selection/touch caret feature.

Comment 3

[Morris Tseng [:mtseng] [:Morris] (Inactive)]

Ahh, the main difference is step 1 and 6, not step 1 and 5.

Comment 4

[Wesley Huang [:wesley_huang] (EPM) (NI me)]

ni to Howie. Can you triage this bug relevant to text selection.

Comment 5

[howie [:howie]]

Hi Arthur, so this is a setting app bug?

Comment 6

[Morris Tseng [:mtseng] [:Morris] (Inactive)]

I found a easier way to reproduce. You don't need to select "Default" word in step 6. Just tap the "Default" word so the keyboard and caret bring up. Then tap "Protocol" and press "OK" button we can reproduce it.

Comment 7

[Arthur Chen [:arthurcc][inactive after 6/30]]

For Web IDE I found the entire html element of settings app was shifted but the displayed position was still (0, 0). Not sure whether this is a graphics issue.

Comment 8

[Stephany Wilkes]

Triage is blocking based on text selection being high priority for 2.2, and copy paste won't work without it. This is also poor UX.

Comment 9

[Morris Tseng [:mtseng] [:Morris] (Inactive)]

After some investigation, I found [1] causes whole page shift left. Based on STR per comment 2, step 6 bring up keyboard. Then in the step 8, <select element> is focused and keyboard dismissed and trigger resize event so that the code in [1] would call <select element>.scrollIntoView(false) and whole page shift left. Kevin, do you have any idea about this? Thanks.

[1]: https://dxr.mozilla.org/mozilla-central/source/dom/inputmethod/forms.js#1122

Comment 10

[Kevin Grandon :kgrandon]

If this is being caused by scrollIntoView I really don't know here =(

We may want to check with some graphics/platform guys?

Comment 11

[Botond Ballo [:botond]]

Can this be repro'd without a SIM card?

Comment 12

[Morris Tseng [:mtseng] [:Morris] (Inactive)]

(In reply to Botond Ballo [:botond] from comment #11)
> Can this be repro'd without a SIM card?

Yes, however, you cannot navigate to SIM manager page without SIM card. But you can use WebIDE to enable SIM manager option and then SIM manager page is able to navigate.

Maybe I could write a simple web page to reproduce this issue. I'll upload once I finish it.

Comment 13

[Morris Tseng [:mtseng] [:Morris] (Inactive)]

More investigation results...I found there are two problems.

1. In the same page, we have 3 select controls. But only last 2 select controls would cause this issue. So I try to find out what differences between those controls. I found [1] has logic error, this code should be offset.height instead of pos.width. After this change, we don't call <select element>.scrollIntoView so the problem doesn't exist anymore.

[1] https://dxr.mozilla.org/mozilla-central/source/dom/inputmethod/forms.js#127

2. So the second problem is why calling scrollIntoView on select element in settings would cause whole page shift left. I have no idea what is going on for this problem....

Comment 14

[Morris Tseng [:mtseng] [:Morris] (Inactive)]

Attachment: yAxisVisible should compare with offset.height instead of pos.width.

Comment 15

[Morris Tseng [:mtseng] [:Morris] (Inactive)]

I don't think this is related to CopyPaste anymore.

Comment 16

[Morris Tseng [:mtseng] [:Morris] (Inactive)]

try: https://treeherder.mozilla.org/#/jobs?repo=try&revision=33155e065c71

Comment 17

[David Flanagan [:djf]]

Comment on attachment 8569697 [details] [diff] [review]
yAxisVisible should compare with offset.height instead of pos.width.

I am unfamiliar with this code. I agree that passing pos.width as the third argument is obviously an error when the method wants a maximum height value, but I don't feel qualified to review the fix.

hg blame says that this code has been in this file for two years and that it was landed by James, so I'm passing the review to him. 

I suspect that Tim would also be a good reviewer for this patch.

Comment 18

[James Lal [:lightsofapollo]]

Comment on attachment 8569697 [details] [diff] [review]
yAxisVisible should compare with offset.height instead of pos.width.

This also looks right to me but I can barely remember the context here... I do know that at the time this landed there where _zero_ tests and I did bunch of manual trial/error by focusing on input elements of various websites so you might need to do play with this a bit.

Passing the r? to tim at worst you have had three people look at this.

Comment 19

[Tim Guan-tin Chien [:timdream] (please needinfo)]

Comment on attachment 8569697 [details] [diff] [review]
yAxisVisible should compare with offset.height instead of pos.width.

I am unfamiliar with this code either.

Comment 20

[Carsten Book [:Tomcat]]

https://hg.mozilla.org/integration/b2g-inbound/rev/5a94300d91f7

Comment 21

[Wes Kocher (:KWierso) (Not reading bugmail; email directly if needed)]

https://hg.mozilla.org/mozilla-central/rev/5a94300d91f7

Comment 22

[Morris Tseng [:mtseng] [:Morris] (Inactive)]

Comment on attachment 8569697 [details] [diff] [review]
yAxisVisible should compare with offset.height instead of pos.width.

NOTE: Please see https://wiki.mozilla.org/Release_Management/B2G_Landing to better understand the B2G approval process and landings.

[Approval Request Comment]
Bug caused by (feature/regressing bug #): 
User impact if declined: A vertical space would randomly appear when user press <select> control
Testing completed: On master.
Risk to taking this patch (and alternatives if risky): low risk, just one line fix.
String or UUID changes made by this patch: None

Comment 23

[Ryan VanderMeulen [:RyanVM]]

https://hg.mozilla.org/releases/mozilla-b2g37_v2_2/rev/63702742aa58

Comment 24

[Jayme Mercado [:JMercado] (Inactive 3/4/2016)]

This issue is verified fixed in the latest Nightly Flame 3.0 and 2.2 builds.  

Actual Results: Tapping the Protocol or Roaming Protocol dropdown lists while the keyboard is active does cause a white bar to appear on the far right side.

Environmental Variables:
Device: Flame 3.0 KK (319 MB) (Full Flash)
BuildID: 20150310010227
Gaia: 2fb09da0cb9cefad9c6e40f57533fafda6d12557
Gecko: 6686aacf006f
Gonk: e7c90613521145db090dd24147afd5ceb5703190
Version: 39.0a1 (3.0) 
Firmware Version: v18D-1
User Agent: Mozilla/5.0 (Mobile; rv:39.0) Gecko/39.0 Firefox/39.0

Environmental Variables:
Device: Flame 2.2 KK (319 MB) (Full Flash)
BuildID: 20150310002536
Gaia: 166491b92278dc9e648f8d49ab02d9ca00d74421
Gecko: 1cda026f8996
Gonk: e7c90613521145db090dd24147afd5ceb5703190
Version: 37.0 (2.2) 
Firmware Version: v18D-1
User Agent: Mozilla/5.0 (Mobile; rv:37.0) Gecko/37.0 Firefox/37.0