Table TD with background-attachment Fixed Scrolling Results in Weird Pixel Rendering

RESOLVED FIXED in Firefox 39

Status

()

Core
Layout
RESOLVED FIXED
4 years ago
a year ago

People

(Reporter: ggnoreneverdie, Assigned: roc)

Tracking

({regression})

19 Branch
mozilla39
x86
Windows XP
regression
Points:
---
Dependency tree / graph

Firefox Tracking Flags

(firefox39 fixed)

Details

(URL)

Attachments

(3 attachments)

(Reporter)

Description

4 years ago
Created attachment 8504405 [details]
mozbug.zip

User Agent: Mozilla/5.0 (Windows NT 5.1; rv:24.7) Gecko/20140907 Firefox/24.7 PaleMoon/24.7.2
Build ID: 20140907200403

Steps to reproduce:

If a table column is set to use a fixed background image, if you scroll down or up in the document, the background image of the table column becomes distorted and renders multiple times incorrectly.  However, if you resize the Firefox window, the backgrounds are correctly rendered until the user scrolls again.


Actual results:

View this JSFiddle with the latest version of Firefox:

http://jsfiddle.net/b3pfzt94/

Scroll down, and then scroll up.  Notice how the background becomes messed up?

Note, the JSFiddle example appears to only trigger the messed up background when scrolling up, but I have seen other examples where scrolling down and up cause the background image distortion with a fixed background image.

For more information, check out this forum thread as well:
http://forums.mozillazine.org/viewtopic.php?f=25&t=2879081

I've also attached a video (XVID MPEG4 Codec Required to View) to this post illustrating both scrolling up and down causing anomalies.  


Expected results:

If you try the same fiddle in IE, it works fine.  Scrolling up or down in the document does not affect the fixed background-attachment of the table column backgrounds.
(Reporter)

Comment 1

4 years ago
If you use a div, it appears to work fine, but that defeats the purpose of my table layout :(

No background anomalies with this JSFiddle since it uses a div to contain a fixed background-attachment:

http://jsfiddle.net/b3pfzt94/3/

Seems to be a bug with the way Firefox handles td

Comment 2

4 years ago
Regression range:
good=2012-11-16
bad=2012-11-17
http://hg.mozilla.org/mozilla-central/pushloghtml?fromchange=58ebb638a7ea&tochange=9a6d708faf3f
Component: Untriaged → Layout
Keywords: regression
Product: Firefox → Core
Version: 24 Branch → 19 Branch

Comment 3

4 years ago
Regression window(m-i)
Good:
http://hg.mozilla.org/integration/mozilla-inbound/rev/244493403e89
Mozilla/5.0 (Windows NT 6.1; WOW64; rv:19.0) Gecko/19.0 Firefox/19.0 ID:20121115151651
Bad:
http://hg.mozilla.org/integration/mozilla-inbound/rev/2c2c6ddb6fe6
Mozilla/5.0 (Windows NT 6.1; WOW64; rv:19.0) Gecko/19.0 Firefox/19.0 ID:20121115163151
Pushlog:
https://hg.mozilla.org/integration/mozilla-inbound/pushloghtml?fromchange=244493403e89&tochange=2c2c6ddb6fe6

In local build
Last Good: 76e6feedd0d6
First Bad: 85793c93543a

Regressed by:
85793c93543a	Robert O'Callahan — Bug 810470. Part 3: Remove code for invalidating background-attachment:fixed content when scrolling. r=mattwoodrow New invalidation logic takes care of this automatically.
Blocks: 810470
Status: UNCONFIRMED → NEW
Ever confirmed: true
Duplicate of this bug: 1138168
roc, do you have time to look at this?
Flags: needinfo?(roc)
Summary: Table TD with Background Attachment Fixed Scrolling Results in Weird Pixel Rendering → Table TD with background-attachment Fixed Scrolling Results in Weird Pixel Rendering

Comment 6

3 years ago
Created attachment 8571442 [details]
Testcase with various kinds of affected table elements

This bug affects not only {background-attachment:fixed;} on TD, but also on TH, TR, THEAD, TBODY, or TFOOT, as well as other on elements that use CSS in order to look alike: {display:table-cell;}, {display:table-row;}, {display:table-header-group;}, {display:table-row-group;}, or {display:table-footer-group;}. The only table elements that are not affected are TABLE and CAPTION and, again, their CSS counterparts. Elements within table cells are not affected either.
Created attachment 8572559 [details] [diff] [review]
Invalidate background-attachment:fixed table-part backgrounds when scrolled
Attachment #8572559 - Flags: review?(matt.woodrow)
Assignee: nobody → roc
Status: NEW → ASSIGNED
Attachment #8572559 - Flags: review?(matt.woodrow) → review+
https://hg.mozilla.org/mozilla-central/rev/dd08e5008cec
Status: ASSIGNED → RESOLVED
Last Resolved: 3 years ago
status-firefox39: --- → fixed
Resolution: --- → FIXED
Target Milestone: --- → mozilla39

Comment 10

a year ago
Looks like this regressed? I replicated it in the wild at https://calendar.perfplanet.com/2010/png-that-works/ and all the testcases pertaining to tr, thead, tbody, and tfoot show breakage.

Mozilla/5.0 (Windows NT 10.0; WOW64; rv:53.0) Gecko/20100101 Firefox/53.0
(In reply to Greg Edwards from comment #10)
> Looks like this regressed? I replicated it in the wild at
> https://calendar.perfplanet.com/2010/png-that-works/ and all the testcases
> pertaining to tr, thead, tbody, and tfoot show breakage.
> 
> Mozilla/5.0 (Windows NT 10.0; WOW64; rv:53.0) Gecko/20100101 Firefox/53.0

What part of that page is wrong? I couldn't tell when I quickly took a look.

In any case we'll want a new bug to investigate this.

Comment 12

a year ago
The pixels involved in the fixed background don't invalidate when the window is scrolled. The most obvious breakage in attachment 8571442 [details] is that the backgrounds in some of the rows (the affected ones) appear to scroll with the page rather than being a 'window' through to the beaver image. The background pops back into place when you horizontally resize the window. Other activities like text selection will also force invalidate the background.
You need to log in before you can comment on or make changes to this bug.