Mirrors/servo
1
0
Fork 0
mirror of https://github.com/servo/servo.git synced 2025-08-06 22:15:33 +01:00
Code Issues Projects Releases Packages Wiki Activity

Add reftests for basic flexbox functionality.

Browse source 
These tests (flex_row_direction.html and flex_column_direction.html) are
correct, but only test the small amount of current flexbox
functionality.
This commit is contained in:
Kyle Zentner 2015-08-10 23:42:57 -07:00 • committed by Patrick Walton
parent 0e18f645f4
commit e3bbcb50d2
5 changed files with 139 additions and 0 deletions
Download patch file Download diff file Expand all files Collapse all files

2
tests/ref/basic.list
View file

@ -98,6 +98,8 @@ flaky_cpu == append_style_a.html append_style_b.html
== first_child_pseudo_a.html first_child_pseudo_b.html == first_child_pseudo_a.html first_child_pseudo_b.html
== first_of_type_pseudo_a.html first_of_type_pseudo_b.html == first_of_type_pseudo_a.html first_of_type_pseudo_b.html
== fixed_width_overrides_child_intrinsic_width_a.html fixed_width_overrides_child_intrinsic_width_ref.html == fixed_width_overrides_child_intrinsic_width_a.html fixed_width_overrides_child_intrinsic_width_ref.html
== flex_column_direction.html flex_column_direction_ref.html
== flex_row_direction.html flex_row_direction_ref.html
== float_clearance_a.html float_clearance_ref.html == float_clearance_a.html float_clearance_ref.html
== float_clearance_intrinsic_width_a.html float_clearance_intrinsic_width_ref.html == float_clearance_intrinsic_width_a.html float_clearance_intrinsic_width_ref.html
== float_intrinsic_height.html float_intrinsic_height_ref.html == float_intrinsic_height.html float_intrinsic_height_ref.html

37
tests/ref/flex_column_direction.html Normal file
View file

@ -0,0 +1,37 @@
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>CSS Test: flex container should layout flex items horizontally</title>
<link rel="author" title="Kyle Zentner" href="mailto:zentner.kyle@gmail.com">
<link rel="help" href="https://drafts.csswg.org/css-flexbox/">
<style>
body {
margin: 0;
}
.flexbox {
display: flex;
flex-direction: column;
height: 300px;
}
.first-item {
background: orange;
height: 150px;
width: 100px;
flex: 1 0 auto;
}
.second-item {
background: blue;
height: 150px;
width: 100px;
flex: 1 0 auto;
}
</style>
</head>
<body>
<div class="flexbox">
<div class="first-item"></div>
<div class="second-item"></div>
</div>
</body>
</html>

32
tests/ref/flex_column_direction_ref.html Normal file
View file

@ -0,0 +1,32 @@
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>CSS Reftest Reference</title>
<link rel="author" title="Kyle Zentner" href="mailto:zentner.kyle@gmail.com">
<style>
body {
margin: 0;
}
.flexbox {
height: 300px;
}
.first-item {
background: orange;
width: 100px;
height: 150px;
}
.second-item {
background: blue;
width: 100px;
height: 150px;
}
</style>
</head>
<body>
<div class="flexbox">
<div class="first-item"></div>
<div class="second-item"></div>
</div>
</body>
</html>

34
tests/ref/flex_row_direction.html Normal file
View file

@ -0,0 +1,34 @@
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>CSS Test: flex container should layout flex items horizontally</title>
<link rel="author" title="Kyle Zentner" href="mailto:zentner.kyle@gmail.com">
<link rel="help" href="https://drafts.csswg.org/css-flexbox/">
<style>
body {
margin: 0;
}
.flexbox {
display: flex;
width: 300px;
}
.first-item {
background: orange;
height: 100px;
flex: 1 0 auto;
}
.second-item {
background: blue;
height: 100px;
flex: 1 0 auto;
}
</style>
</head>
<body>
<div class="flexbox">
<div class="first-item"></div>
<div class="second-item"></div>
</div>
</body>
</html>

34
tests/ref/flex_row_direction_ref.html Normal file
View file

@ -0,0 +1,34 @@
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>CSS Reftest Reference</title>
<link rel="author" title="Kyle Zentner" href="mailto:zentner.kyle@gmail.com">
<style>
body {
margin: 0;
}
.flexbox {
width: 300px;
}
.first-item {
background: orange;
height: 100px;
width: 150px;
float: left;
}
.second-item {
background: blue;
height: 100px;
width: 150px;
float: left;
}
</style>
</head>
<body>
<div class="flexbox">
<div class="first-item"></div>
<div class="second-item"></div>
</div>
</body>
</html>