Bug 206024

Summary:

Thin line sometimes shown above heading on twitter.com

Product:

WebKit

Reporter:

Kenneth Kufluk <kenneth>

Component:

Layout and Rendering

Assignee:

Nobody <webkit-unassigned>

Status:

RESOLVED CONFIGURATION CHANGED

Severity:

Normal

CC:

bfulgham, karlcow, mjs, simon.fraser, webkit-bug-importer, zalan

Priority:

Keywords:

InRadar

Version:

Safari 13

Hardware:

Unspecified

OS:

iOS 13

Attachments:

Description	Flags
Screenshot of Twitter on my iPad showing the line at the top of the site.	none

Description Kenneth Kufluk 2020-01-09 12:23:30 PST

Created attachment 387254 [details]
Screenshot of Twitter on my iPad showing the line at the top of the site.

Hi. I'm a web engineer on twitter.com.

I have found an infrequent rendering bug when using iPhone or iPad with mobile.twitter.com.
I use dark mode on the OS and on twitter.
I scroll my home timeline. When scrolling stops, I sometimes see one pixel of rendering from the timeline under the top header, appearing above the header.
This is most apparent when there is a bright image in the timeline.

This bug either does not appear, or is much less apparent, when the phone is not in dark mode. I suspect it is less apparent.

I have made a reduced test case here:
https://clumsy-biplane.glitch.me (make sure your phone is in dark mode)
The bug appears far less frequently in the reduced test case. Perhaps 20-30 scrolls up and down might be needed. I find the line only appears after the scroll moment has finished.

By comparing screenshots, I believe the line is an additional line, because I measured an extra 1px between the top of the screen and the text in the header.

Comment 1 Simon Fraser (smfr) 2020-01-09 12:41:57 PST

Probably a rounding error in the positioning of the position:fixed header.

Does the patch have a meta viewport that gives it unit scale (width=device-width)?

Comment 2 Kenneth Kufluk 2020-01-09 13:04:00 PST

Yes, reduced test case has 
    <meta name="viewport" content="width=device-width, initial-scale=1">
Site has
    <meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=0,viewport-fit=cover" />

Comment 3 Radar WebKit Bug Importer 2020-01-09 23:38:34 PST

<rdar://problem/58471889>

Comment 4 Karl Dubost 2024-05-02 01:32:41 PDT

@Kenneth,

Spring Cleaning. 
I don't seem to be able to reproduce this issue.