Open
Bug 1333274
Opened 8 years ago
Updated 2 years ago
Inconsistent float layout with 'writing-mode: vertical-rl' between local test and web-based test
Categories
(Core :: Layout: Floats, defect)
Tracking
()
NEW
| Tracking | Status | |
|---|---|---|
| firefox54 | --- | affected |
People
(Reporter: bugzilla, Unassigned)
References
(Depends on 1 open bug, Blocks 1 open bug)
Details
(Keywords: testcase)
Attachments
(3 files)
Bug1333274-Firefox53-Local-based.png
While trying to create a better and more reduced test for bug 1272181, I found out that a local-based test will be rendered differently from a web-based test with both test using the very same code.
Exact steps to reproduce, actual results, expected results and reduced test coming up.
|
Reporter | |
Comment 1•8 years ago
|
||
Web-based test
--------------
http://www.gtalbot.org/BugzillaSection/Bug1333274-Inconsistent-float-layout.html
Local-based test code
---------------------
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Bug 1333274: Inconsistent float layout with 'writing-mode: vertical-rl' between local test and web-based test</title>
<style type="text/css">
div {float: left;}
span {writing-mode: vertical-rl;}
</style>
</head>
<body>
<div><span style="font-size: 60px;">A</span><span style="font-size: 120px;">B</span></div>
<div><span style="font-size: 60px;">X</span><span style="font-size: 120px;">Y</span></div>
</body>
</html>
Steps to reproduce
------------------
Copy and paste the local-based test code into a file on your computer and give it the same filename: Bug1333274-Inconsistent-float-layout.html
Actual results in Firefox 53.0a1 buildID=20170123163559 and Firefox 50.1
------------------------------------------------------------------------
local-based test
- - - - - - - -
The X glyph overlaps the A glyph and the Y glyph overlaps the B glyph in the local-based test. No matter how many times I reload (F5) or reload overriding cache (Ctrl+F5) the local-based test, the X glyph overlaps the A glyph and the Y glyph overlaps the B glyph.
web-based test
- - - - - - -
The X glyph does not overlap the A glyph and the Y glyph does not overlap the B glyph in the web-based test. But if I reload (F5) or reload overriding cache (Ctrl+F5) the web-based test a few times (say, 3 times, quickly), then sometimes the X glyph overlaps the A glyph and the Y glyph overlaps the B glyph and sometimes the X glyph does not overlap the A glyph and the Y glyph does not overlap the B glyph. The rendered layout is erratic and inconsistent.
Also, the A and B glyphs are rendered in 1 line box while the X and Y glyphs are rendered in *_another line box_*.
Expected results
----------------
The X glyph does not overlap the A glyph and the Y glyph does not overlap the B glyph and this consistently and in both local-based test and web-based test. But also, since both <div>s are left-floating, then all 4 glyphs should be lined up in the same, one single line box.
Notes
-----
- I will upload screenshots of actual results and expected results
- The Ahem font is not involved in the tests and there is no @font-face rule either; that is 2 differences from bug 1272181
- In my opinion, rendered layout of contiguous floated elements are definitely buggy in Firefox
- Chrome 55.0.2883.87 and Chrome 57.0.2986.0 pass both local and web tests; Edge 13 passes the web-based test
- I use Linux 3.13.0-107-generic x86_64, Qt: 4.8.6, KDE 4.14.13; Kubuntu (trusty) 14.04.5 LTS
- I've searched for duplicates and did not find any.
OS: Unspecified → Linux
|
|
Reporter | |
Comment 2•8 years ago
|
||
Rendered layout of local-based test by Firefox 53.0a1 buildID=20170123163559
|
|
Reporter | |
Comment 3•8 years ago
|
||
Rendered layout of Firefox 53.0a1 buildID=20170123163559 of web-based test
|
|
Reporter | |
Comment 4•8 years ago
|
||
Rendered layout of Chrome 55, Chrome 57 and Edge 13 of both local-based test and web-based test. This is also the expected results.
|
|
Reporter | |
Updated•8 years ago
|
|
|
Reporter | |
Comment 5•8 years ago
|
||
I tried again today with Firefox 54.0a1 buildID=20170123163559 (in previous comments, I wrote that I was using Firefox 53.0a1 buildID=20170123163559 but it was Firefox 54.0a1 buildID=20170123163559).
With the local-based test, I get the actual results as displayed in attachment 8829719 [details] for Firefox 54.0a1 buildID=20170123163559 and this regardless of if I reload (F5) or reload overriding cache (Ctrl+F5), once or a few times.
With the web-based test, I sometimes get the actual results as displayed in attachment 8829719 [details] for Firefox 54.0a1 buildID=20170123163559 or I get expected results as displayed in attachment 8829727 [details]; I get both results if I reload (F5) or if I reload overriding cache (Ctrl+F5), 2 or 3 times quickly.
Strangely, I seem now unable to get the actual results as displayed in attachment 8829722 [details], despite using the very same browser version.
|
|
Reporter | |
Comment 6•8 years ago
|
||
I tried again today with Firefox 50.1 buildID=20161209094039.
With the local-based test, I get the actual results as displayed in attachment 8829719 [details] for Firefox 50.1 buildID=20161209094039 and this regardless of if I reload (F5) or reload overriding cache (Ctrl+F5), once or a few times.
With the web-based test, I get expected results as displayed in attachment 8829727 [details] for Firefox 50.1; if I reload (F5) or if I reload overriding cache (Ctrl+F5) several times, say, 5 to 8 times quickly, then I sometimes get actual results as displayed in attachment 8829719 [details] .
- - - - - - - -
In conclusion: this bug report is still relevant. There is an inconsistency between the rendering of a local-based test and the rendering of a web-based test, despite using the very same code.
|
||
Comment 7•8 years ago
|
||
The inconsistency is because the bug is timing-/reflow-dependent, and so it may vary depending how quickly the testcase loads. I think this is a manifestation of the same issue as bug 1332555. One thing that tends to support that theory is that if you zoom in and then back out, the rendering will tend to sort itself out (because the orthogonal frames now have a size already) - though the initial rendering at any given zoom level is likely to be wrong.
Depends on: 1332555
|
|
Reporter | |
Comment 8•8 years ago
|
||
> The inconsistency is because the bug is timing-/reflow-dependent, and so it
> may vary depending how quickly the testcase loads. I think this is a
> manifestation of the same issue as bug 1332555.
Jonathan, have you been able to reproduce this bug on your platform? Just wondering here...
> One thing that tends to
> support that theory is that if you zoom in and then back out, the rendering
> will tend to sort itself out (because the orthogonal frames now have a size
> already)
Yes. The rendering differs when zooming in and/or out.
With Firefox 50.1, with the web-based test, I start with the expected results (displayed as attachment 8829727 [details]) and then when I zoom in, I get the actual results (displayed as attachment 8829722 [details]). Zooming in and out with the web-based version and with Firefox 50.1, I get either the expected results (displayed as attachment 8829727 [details]) or I get actual results (displayed as attachment 8829722 [details]).
With Firefox 50.1, with the local-based test, I can get all 3 renderings by zooming in and/or by zooming out.
This is very weird, odd, unexpected...
> - though the initial rendering at any given zoom level is likely to
> be wrong.
The initial rendering of Firefox 50.1 of the local-based test is always wrong and it is displayed as attachment 8829719 [details].
But the initial rendering of Firefox 50.1 of the web-based test is always correct and it is displayed as attachment 8829727 [details]. Just like I said in comment 6 .
There is something wrong and unexpected here: I would expect to always have the same (correct or incorrect, but it has to be the same) rendering between my local version and my webpage on my site.
|
||
Updated•2 years ago
|
Severity: normal → S3
You need to log in
before you can comment on or make changes to this bug.
Description
•