On a page with overflow-x or overflow-y set, elements flicker when shrinking an element filling the difference by switching a display:none element to display:block with JS

NEW
Unassigned
(NeedInfo from)

Status

()

Core
Layout
8 years ago
a year ago

People

(Reporter: Tim, Unassigned, NeedInfo)

Tracking

({regression, testcase})

Trunk
x86
Windows Vista
regression, testcase
Points:
---

Firefox Tracking Flags

(Not tracked)

Details

Attachments

(1 attachment)

(Reporter)

Description

8 years ago
User-Agent:       Mozilla/5.0 (Windows; U; Windows NT 6.1; en-US; rv:1.9.0.10) Gecko/2009042316 Firefox/3.0.10 (.NET CLR 3.5.30729)
Build Identifier: Mozilla/5.0 (Windows; U; Windows NT 6.1; en-US; rv:1.9.0.10) Gecko/2009042316 Firefox/3.0.10 (.NET CLR 3.5.30729)

First, the element being resized should be within an element with overflow-x:auto or overflow-y:scroll.
For a page with a 120px header, 40px div on top and 80px div below, if the elements are updated with JS such that the 40px element grows to 120px and the 80px element shifts to display:none, then there's a moment where both new 120px and old 80px elements display.
The expectation would be that while the JS block is being processed the div elements wouldn't dynamically jump around.

Reproducible: Always

Steps to Reproduce:
1. See attached file
2. Click the button a few times
Actual Results:  
Red element flickers as the blue element grows.

Expected Results:  
A clean transition for both elements. This happens if no overflow-x:auto or overflow-y:scroll is set.
(Reporter)

Comment 1

8 years ago
Created attachment 380393 [details]
Page that demonstrates display: switch flicker.
(Reporter)

Comment 2

8 years ago
This may be related to 477789, but this doesn't cause a full screen flicker.

Updated

8 years ago
Component: General → Layout
Product: Firefox → Core
QA Contact: general → layout
This regressed in 2004, in at least two steps. After the flickering started, this changed again at least two times.
Status: UNCONFIRMED → NEW
Ever confirmed: true
Keywords: regression, testcase
Version: unspecified → Trunk
Hi Tim,

I have tested your issue on latest FF release (46.0.1) and latest Nightly build and could not reproduce it. I have opened the testcase you provided in comment 0 and clicked multiple times the button, but there was no flicker.

Is this still reproducible on your end ? If yes, can you please retest this using latest FF release and latest Nightly build (https://nightly.mozilla.org/) and report back the results ? When doing this, please use a new clean Firefox profile, maybe even safe mode, to eliminate custom settings as a possible cause (https://goo.gl/PNe90E).

Thanks,
Paul.
Flags: needinfo?(timmc)
You need to log in before you can comment on or make changes to this bug.