Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(40)

Issues Search
    My Issues | Starred     Open | Closed | All

Unified Diff: LayoutTests/fast/css/css-properties-position-relative-as-parent-fixed.html

Issue 669143002: Make css-properties-position-relative-as-parent-fixed.html a ref-test (Closed) Base URL: https://chromium.googlesource.com/chromium/blink.git@master
Patch Set: Created 6 years, 2 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View side-by-side diff with in-line comments
Download patch
« no previous file with comments | « no previous file | LayoutTests/fast/css/css-properties-position-relative-as-parent-fixed-expected.txt » ('j') | no next file with comments »
Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
Index: LayoutTests/fast/css/css-properties-position-relative-as-parent-fixed.html
diff --git a/LayoutTests/fast/css/css-properties-position-relative-as-parent-fixed.html b/LayoutTests/fast/css/css-properties-position-relative-as-parent-fixed.html
index 8b487cdceb8138ea119ad7ac1a54ed5d1ffc5f71..002838cc56719c4b35e0e9820860d3c91876f780 100644
--- a/LayoutTests/fast/css/css-properties-position-relative-as-parent-fixed.html
+++ b/LayoutTests/fast/css/css-properties-position-relative-as-parent-fixed.html
@@ -1,158 +1,196 @@
<!DOCTYPE html>
<html>
<head>
+ <style>
+ html, body, h5, pre {
+ margin: 0;
+ }
+
+ .container {
+ position: relative;
+ left: 150px;
+ font: 10px/1 Ahem;
+ }
+
+ .main {
+ width: 400px;
+ }
+
+ .relative {
+ position: relative;
+ }
+
+ .fixed {
+ position: fixed;
+ }
+
+ .green {
+ color: green;
+ background-color: lime;
+ }
+
+ .red {
+ color: red;
+ }
+
+ .grey {
+ color: grey;
+ background-color: silver;
+ }
+
+ .rtl {
+ direction: rtl;
+ }
+ </style>
+ <script src="../../resources/check-layout.js"></script>
</head>
-<body style="position:fixed; left:150px;">
-<h3>Test for chromium bug : <a href="https://code.google.com/p/chromium/issues/detail?id=31286">31286</a>. css rendering bug : fixed-position-element and 'left'.</h3>
-<h4>If fixed position inline element does not have left and/or right position then it should render as normal flow.</h4>
-
-<h5>
-Case 1 : fixed text box should be just after relative text box.
-<br/>
-
-<div style="position:relative; left:100px; background:green; width:400px;">
-relative
-<span style="position:fixed; background:red;">
-fixed
-</span>
-</span>
-</div>
-
-Case 2 : fixed text box should be just before relative text box.
-<br/>
-
-<div style="position:relative; left:100px; background:green; direction:rtl; width:400px;">
-relative
-<span style="position:fixed; background:red;">
-fixed
-</span>
-</span>
-</div>
-
-Case 3 : fixed text box should be just after relative text box.
-<br/>
-
-<div style="position:relative; right:100px; background:green; width:400px;">
-relative
-<span style="position:fixed; background:red;">
-fixed
-</span>
-</span>
-</div>
-
-Case 4 : fixed text box should be just before relative text box.
-<br/>
-
-<div style="position:relative; right:100px; background:green; direction:rtl; width:400px;">
-relative
-<span style="position:fixed; background:red;">
-fixed
-</span>
-</span>
-</div>
-
-Case 5 : fixed text box should be just after relative2 text box.
-<br/>
-
-<div style="position:relative; left:100px; background:gray; width:400px;">
-relative
-<span style="position:relative; left:100px; background:green;">
-relative2
-<span style="position:fixed; background:red;">
-fixed
-</span>
-</span>
-</div>
-
-Case 6 : fixed text box should be after relative text box in some distance and before relative2 in some distance.
-<br/>
-
-<div style="position:relative; left:100px; background:gray; direction:rtl; width:400px;">
-relative
-<span style="position:relative; left:100px; background:green;">
-relative2
-<span style="position:fixed; background:red;">
-fixed
-</span>
-</span>
-</div>
-
-Case 7 : fixed text box should be just after relative2 text box.
-<br/>
-
-<div style="position:relative; left:100px; background:gray; width:400px;">
-relative
-<span style="position:relative; right:100px; background:green;">
-relative2
-<span style="position:fixed; background:red;">
-fixed
-</span>
-</span>
-</div>
-
-Case 8 : fixed text box should be before relative2 text box in some distance.
-<br/>
-
-<div style="position:relative; left:100px; background:gray; direction:rtl; width:400px;">
-relative
-<span style="position:relative; right:100px; background:green;">
-relative2
-<span style="position:fixed; background:red;">
-fixed
-</span>
-</span>
-</div>
-
-Case 9 : fixed text box should be just after relative2 text box.
-<br/>
-
-<div style="position:relative; right:100px; background:gray; width:400px;">
-relative
-<span style="position:relative; left:100px; background:green;">
-relative2
-<span style="position:fixed; background:red;">
-fixed
-</span>
-</span>
-</div>
-
-Case 10 : fixed text box should be after relative text box in some distance and before relative2 in some distance.
-<br/>
-
-<div style="position:relative; right:100px; background:gray; direction:rtl; width:400px;">
-relative
-<span style="position:relative; left:100px; background:green;">
-relative2
-<span style="position:fixed; background:red;">
-fixed
-</span>
-</span>
-</div>
-
-Case 11 : fixed text box should be just after relative2 text box.
-<br/>
-
-<div style="position:relative; right:100px; background:gray; width:400px;">
-relative
-<span style="position:relative; right:100px; background:green;">
-relative2
-<span style="position:fixed; background:red;">
-fixed
-</span>
-</span>
-</div>
-
-Case 12 : fixed text box should be before relative2 text box in some distance.
-<br/>
-
-<div style="position:relative; right:100px; background:gray; direction:rtl; width:400px;">
-relative
-<span style="position:relative; right:100px; background:green;">
-relative2
-<span style="position:fixed; background:red;">
-fixed
-</span>
-</span>
-</div>
-
-</h5>
+<body onload="checkLayout('.container')">
+ <h3>Test for chromium bug : <a href="https://code.google.com/p/chromium/issues/detail?id=31286">31286</a>. css rendering bug : fixed-position-element and 'left'.</h3>
+ <p>If fixed position inline element does not have left and/or right position then it should render as normal flow.</p>
+
+ <h5>Case 1: fixed text box (red) should be just after relative text box (green).</h5>
+ <div class="container">
+ <div class="main relative green" style="left: 100px;" data-offset-x="100">
+ XXXXXXXXXX
+ <span class="fixed red" data-offset-x="350">
Julien - ping for review 2014/10/23 01:22:27 Nit: I would change red for another color (blue, p
Manuel Rego 2014/10/23 08:12:21 I agree, I was just using red because of it was in
+ XXXXX
+ </span>
+ </div>
+ </div>
+
+ <h5>Case 2: fixed text box (red) should be just before relative text box (green).</h5>
+ <div class="container">
+ <div class="main relative green rtl" style="left: 100px;" data-offset-x="100">
+ XXXXXXXXXX
+ <span class="fixed red" data-offset-x="500">
+ XXXXX
+ </span>
+ </div>
+ </div>
+
+ <h5>Case 3: fixed text box (red) should be just after relative text box (green).</h5>
+ <div class="container">
+ <div class="main relative green" style="right: 100px;" data-offset-x="-100">
+ XXXXXXXXXX
+ <span class="fixed red" data-offset-x="150">
+ XXXXX
+ </span>
+ </div>
+ </div>
+
+ <h5>Case 4: fixed text box (red) should be just before relative text box (green).</h5>
+ <div class="container">
+ <div class="main relative green rtl" style="right: 100px;" data-offset-x="-100">
+ XXXXXXXXXX
+ <span class="fixed red" data-offset-x="300">
+ XXXXX
+ </span>
+ </div>
+ </div>
+
+ <h5>Case 5: fixed text box (red) should be just after relative text box (green).</h5>
+ <div class="container">
+ <div class="main relative grey" style="left: 100px;" data-offset-x="100">
+ XXXXXXXXX
+ <span class="relative green" style="left: 50px;" data-offset-x="150">
+ XXXXXXXXXXXXXXX
+ <span class="fixed red" data-offset-x="550">
+ XXXXX
+ </span>
+ </span>
+ </div>
+ </div>
+
+ <h5>Case 6: fixed text box (red) should be after relative text box (grey) in some distance and before the other relative text box (green) in some distance.</h5>
+ <div class="container">
+ <div class="main relative grey rtl" style="left: 100px;" data-offset-x="100">
+ XXXXX
+ <span class="relative green" style="left: 150px;" data-offset-x="400">
+ XXXXXXXXX
+ <span class="fixed red" data-offset-x="600">
Julien - ping for review 2014/10/23 01:22:27 That doesn't match the description and old result
Manuel Rego 2014/10/23 08:12:21 The offset in the fixed elements is absolute, so i
Julien - ping for review 2014/10/23 15:54:21 You're right, the offset is defined with respect t
Manuel Rego 2014/10/24 10:07:37 FWIW, the checkLayout() test could also be checked
+ XXXXX
+ </span>
+ </span>
+ </div>
+ </div>
+
+ <h5>Case 7: fixed text box (red) should be just after relative text box (green).</h5>
+ <div class="container">
+ <div class="main relative grey" style="left: 100px;" data-offset-x="100">
+ XXXXXXXXXXXXXX
+ <span class="relative green" style="right: 50px;" data-offset-x="100">
+ XXXXXXXXXX
+ <span class="fixed red" data-offset-x="450">
+ XXXXX
+ </span>
+ </span>
+ </div>
+ </div>
+
+ <h5>Case 8: fixed text box (red) should be before relative text box (green) in some distance.</h5>
+ <div class="container">
+ <div class="main relative grey rtl" style="left: 100px;" data-offset-x="100">
+ XXXXX
+ <span class="relative green" style="right: 150px;" data-offset-x="100">
+ XXXXXXXXX
+ <span class="fixed red" data-offset-x="300">
Julien - ping for review 2014/10/23 01:22:27 This doesn't seem to match the description / visua
Manuel Rego 2014/10/23 08:12:21 Ditto.
+ XXXXX
+ </span>
+ </span>
+ </div>
+ </div>
+
+ <h5>Case 9: fixed text box (red) should be just after relative text box (green).</h5>
+ <div class="container">
+ <div class="main relative grey" style="right: 100px;" data-offset-x="-100">
+ XXXXXXXXXXXXXX
+ <span class="relative green" style="left: 50px;" data-offset-x="200">
+ XXXXXXXXXX
+ <span class="fixed red" data-offset-x="350">
+ XXXXX
+ </span>
+ </span>
+ </div>
+ </div>
+
+ <h5>Case 10: fixed text box (red) should be after relative text box (grey) in some distance and before other relative text box (green) in some distance.</h5>
+ <div class="container">
+ <div class="main relative grey rtl" style="right: 100px;" data-offset-x="-100">
+ XXXXX
+ <span class="relative green" style="left: 150px;" data-offset-x="400">
+ XXXXXXXXX
+ <span class="fixed red" data-offset-x="400">
+ XXXXX
+ </span>
+ </span>
+ </div>
+ </div>
+
+ <h5>Case 11: fixed text box (red) should be just after relative text box (green).</h5>
+ <div class="container">
+ <div class="main relative grey" style="right: 100px;" data-offset-x="-100">
+ XXXXXXXXXXXXXX
+ <span class="relative green" style="right: 50px;" data-offset-x="100">
+ XXXXXXXXXX
+ <span class="fixed red" data-offset-x="250">
+ XXXXX
+ </span>
+ </span>
+ </div>
+ </div>
+
+ <h5>Case 12: fixed text box (red) should be before relative text box (green) in some distance.</h5>
+ <div class="container">
+ <div class="main relative grey rtl" style="right: 100px;" data-offset-x="-100">
+ XXXX
+ <span class="relative green" style="right: 150px;" data-offset-x="100">
+ XXXXXXXXXX
+ <span class="fixed red" data-offset-x="100">
+ XXXXX
+ </span>
+ </span>
+ </div>
+ </div>
+
+</body>
+</html>
« no previous file with comments | « no previous file | LayoutTests/fast/css/css-properties-position-relative-as-parent-fixed-expected.txt » ('j') | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698