Closed Bug 1050504 Opened 8 years ago Closed 6 years ago

stacksocial.com hides page contents by overlay DIV larger than the viewport on Firefox OS, can't be closed

Categories

(Web Compatibility :: Mobile, defect)

ARM
Gonk (Firefox OS)
defect
Not set
normal

Tracking

(b2g-v1.3 affected, b2g-v1.4 affected, b2g-v2.0 affected, b2g-v2.1 affected)

RESOLVED FIXED
Tracking Status
b2g-v1.3 --- affected
b2g-v1.4 --- affected
b2g-v2.0 --- affected
b2g-v2.1 --- affected

People

(Reporter: smiko, Unassigned)

References

()

Details

(Whiteboard: [2.0-exploratory] [country-us] [css] [contactready])

Attachments

(1 file, 1 obsolete file)

Attached video IMG_2378.MOV (obsolete) —
Description:
The user is unable to navigate the stacksocial.com website due to a pop up window that cannot be closed.
   
Repro Steps:
1) Update a Flame device to BuildID: 20140807000201
2) Open Browser and navigate to stacksocial.com
  
Actual:
A pop up window blocks navigation
  
Expected: 
Navigation is always possible
  
Environmental Variables:
Device: Flame 2.0
BuildID: 20140807000201
Gaia: 8cc28fd31905a0ea2b2e15d13e80a0eab2feb1ba
Gecko: 25980b5120b0
Version: 32.0 (2.0)
Firmware: V123
User Agent: Mozilla/5.0 (Mobile; rv:32.0) Gecko/32.0 Firefox/32.0
  
Repro frequency: 100%

See attached: (video clip)
Attached file StacksocialLogcat.txt
This issue DOES reproduce on Flame 2.1 (319mb), buri 2.1,  Flame 2.0(512mb), buri 2.0, Flame 1.4 (319mb), buri 1.4, and buri 1.3

Flame 2.1 (319mb)

Environmental Variables:
Device: Flame Master
Build ID: 20140807040201
Gaia: 079c5f85875b0f2eb341ca9fd375f1b905ed7157
Gecko: afcb3af79d09
Version: 34.0a1 (Master)
Firmware Version: v123
User Agent: Mozilla/5.0 (Mobile; rv:34.0) Gecko/34.0 Firefox/34.0

buri 2.1

Environmental Variables:
Device: Buri Master
BuildID: 20140807040201
Gaia: 079c5f85875b0f2eb341ca9fd375f1b905ed7157
Gecko: afcb3af79d09
Version: 34.0a1 (2.1)
Firmware: v1.2device.cfg
User Agent: Mozilla/5.0 (Mobile; rv:33.0) Gecko/33.0 Firefox/33.

Flame 2.0 (512mb)

Enviromental Variables:
Device: Flame 2.0 (512mb)
BuildID: 20140807000201
Gaia: 8cc28fd31905a0ea2b2e15d13e80a0eab2feb1ba
Gecko: 25980b5120b0
Version: 32.0 (2.0)
Firmware: V123
User Agent: Mozilla/5.0 (Mobile; rv:32.0) Gecko/32.0 Firefox/32.0

buri 2.0

Enviromental Variables:
Device: Buri 2.0
BuildID: 20140807063003
Gaia: 9d681c6a3b69af2d76e7e00c31bc57e0c3efb6b9
Gecko: ca7386df2e91
Version: 32.0 (2.0)
Firmware: v1.2device.cfg
User Agent: Mozilla/5.0 (Mobile; rv:32.0) Gecko/32.0 Firefox/32.0

Flame 1.4 (319mb)

Environmental Variables:
Device: Flame 1.4 319mb
Build ID: 20140806183051
Gaia: e9dce1f60f729e228810f751417681b5ff937b6b
Gecko: 89a8a24a8b1b
Version: 30.0 (1.4)
Firmware Version: v123
User Agent: Mozilla/5.0 (Mobile; rv:30.0) Gecko/30.0 Firefox/30.0

buri 1.4

Enviromental Variables:
Device: Buri 1.4
BuildID: 20140806183051
Gaia: e9dce1f60f729e228810f751417681b5ff937b6b
Gecko: 89a8a24a8b1b
Version: 30.0 (1.4)
Firmware: v1.2device.cfg
User Agent: Mozilla/5.0 (Mobile; rv:30.0) Gecko/30.0 Firefox/30.0

buri 1.3

Environmental Variables:
Device: Buri 1.3
BuildID: 20140807024001
Gaia: 23f55be856cef53c6604a6fe4aeb09061afbc897
Gecko: 9727017eabb9
Version: 28.0 (1.3)
Firmware: v1.2device.cfg
User Agent: Mozilla/5.0 (Mobile; rv:28.0) Gecko/28.0 Firefox/28.0
Flags: needinfo?(ktucker)
QA Whiteboard: [QAnalyst-Triage?]
Whiteboard: [2.0-exploratory]
Keywords:
browser, pop up, navigation, block
Please remove the sound from the video.
QA Whiteboard: [QAnalyst-Triage?] → [QAnalyst-Triage=]
Flags: needinfo?(ktucker) → needinfo?(smiko)
QA Whiteboard: [QAnalyst-Triage=] → [QAnalyst-Triage-]
Attachment #8469565 - Attachment is obsolete: true
Flags: needinfo?(smiko)
Video url: http://youtu.be/wBJdB8XsBuc
Flags: needinfo?(ktucker)
1. Go to https://stacksocial.com/
2. The pop up window is larger than the viewport. The [x] button is hidden out of the viewport on the right side.

On iPod Touch Safari, there is no pop-up window.
The issue can be reproduce on faking the user agent for Firefox OS on Desktop. The Web site is responsive except for this pop up window.

html body .email-capture-modal{
	display:none;
	left:50%;
	margin-bottom:84px;
	margin-left:-300px;
	overflow:hidden;
	position:fixed;
	top:84px;
	width:600px;
	z-index:10000001
}

html body .email-capture-modal .carrousel>a,html body .email-capture-modal .carrousel>ul{
	display:none
}


Possible to fix with

html body .email-capture-modal{
	display:none;
	width: 100%;
	overflow:hidden;
	position:fixed;
	top:84px;
	z-index:10000001
}

And you need also to modify some of the values in the inline style. Everything has been set for 600px.
Whiteboard: [2.0-exploratory] → [2.0-exploratory] [country-us] [css] [contactready]
Summary: [B2G][Browser] Pop up blocks navigation at stacksocial.com → stacksocial.com sends pop up larger than the viewport to Firefox OS
Since this not a regression and a TE issue not nominating as a blocker.
QA Whiteboard: [QAnalyst-Triage-] → [QAnalyst-Triage+]
Flags: needinfo?(ktucker)
QA Whiteboard: [QAnalyst-Triage+] → [QAnalyst-Triage+][lead-review+]
Summary: stacksocial.com sends pop up larger than the viewport to Firefox OS → stacksocial.com hides page contents by overlay DIV larger than the viewport on Firefox OS, can't be closed
fixed
Status: NEW → RESOLVED
Closed: 6 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.