1156932 - Anchor scrolling doesn't adjust properly when a downloadable font with very different metrics loads after the initial anchor scroll

Status: NEW

(Core :: Layout, defect)

Description

[vladmalik]

User Agent: Mozilla/5.0 (Windows NT 6.3; WOW64; rv:37.0) Gecko/20100101 Firefox/37.0
Build ID: 20150402191859

Steps to reproduce:

1. Clear cache
2. Go to http://goodui.org/anchor_works.html#65
3. Notice FF starts at TOP of page, loads page, and then scrolls to anchor #65 near the bottom of the page

Then,

1. Clear cache
2. Go to http://goodui.org/anchor_fails.html#65
3. Notice FF starts at BOTTOM of page, loads page, and stays at the bottom of the page


Actual results:

If I add an empty script tag anywhere on the page, links to anchors on the page work fine. Once the page is cached, links to anchors also work fine.

But as soon as I add even a space to the script tag, anchor links miss the actual position of the anchor (scroll down by quite a bit). For the lower anchors, it ends up scrolling to the bottom of the page.


Expected results:

It should load the page and then take me to anchor #65.

Comment 1

[vladmalik]

anchor_works.html has a blank script element in head
anchor_fails.html has a space between the script tags in head

There is no other difference.

Comment 2

[Justin [:JW_SoftvisionQA]]

Hello,

Are you still encountering this bug on Firefox 42.0 or Nightly 46.0a1?

I can not replicated. Both sites go down to anchor #65.

Version 	46.0a1
Build ID 	20151215030221
User Agent 	Mozilla/5.0 (Windows NT 6.3; Win64; x64; rv:46.0) Gecko/20100101 Firefox/46.0

Thank you,

Justin

Comment 3

[vladmalik]

Actually now if I clear cache and hit either link, it goes to the bottom of the page. Refreshing doesn't take me to anchor. However, once the page is cached on subsequent visit (close tab and type URL again), it does go to anchor.

Comment 4

[Boris Zbarsky [:bzbarsky]]

The basic problem is presumably that we go to the anchor before the images load, and once they load we're at the wrong place in the page.

That said, I can't reproduce the problem.  Loading http://goodui.org/anchor_fails.html#65 without anything cached works just fine for me...

Is this bug reproducible in safe mode?

Comment 5

[vladmalik]

Attachment: Screenshot of problem (not on anchor location)

Comment 6

[vladmalik]

Yes It is reproducible in 43.0.4. When page is cached, I see [see screenshot].

Comment 7

[Boris Zbarsky [:bzbarsky]]

I see, this is interesting.  I can reproduce, but only when my window is more than 1024px wide.

Now the page does have a media query with a breakpoint at 1024px which changes all sorts of stuff around... and if I download the page locally so that it can't use the "OswaldLight" font, the problem disappears.  What's weird is that this font is used both with and without the media query, albeit with different font sizes.

Anyway, if I stop styling h2 with the "OswaldLight" font, the problem goes away.  So I expect what happens is that we scroll to the anchor, then "OswaldLight" loads, changes the font metrics and hence the layout, and now the scroll position is wrong.  Not quite sure yet what the empty script has to do with it other than possibly affecting when layout starts and exactly when anchor scrolls are performed.

Comment 8

[Justin [:JW_SoftvisionQA]]

Marking this bug as new to give a dev a chance to look at it.