DEV/flutter_flutter
1
0
Fork 0
mirror of https://github.com/flutter/flutter.git synced 2026-02-20 02:29:02 +08:00
Code Issues Packages Projects Releases Wiki Activity

Add render tree dump and pixel tests for statically placed position:absolute.

Browse Source 
This exposes a bug that we position and size position:absolute
correctly inside paragraphs, but we fail to paint them.

R=abarth@chromium.org

Review URL: https://codereview.chromium.org/943113003
This commit is contained in:
Ojan Vafai 2015-02-20 18:20:23 -08:00
parent fb186ce679
commit f6bee1e2c4
4 changed files with 150 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

21
engine/src/flutter/tests/layout/position-absolute-expected.txt Normal file
View File

@ -0,0 +1,21 @@
layer at (0,0) size 800x600
RenderView {#document} at (0,0) size 800x600
layer at (0,0) size 100x100
RenderBlock {block} at (0,0) size 100x100 [bgcolor=#FFC0CB]
RenderBlock {spacer} at (0,0) size 40x40 [bgcolor=#FFEFD5] [border: (5px solid #800080)]
RenderBlock {spacer} at (0,40) size 40x40 [bgcolor=#FFEFD5] [border: (5px solid #800080)]
layer at (0,40) size 20x20
RenderBlock (positioned) {absolute} at (0,40) size 20x20 [bgcolor=#008000]
layer at (0,150) size 100x100
RenderParagraph {paragraph} at (0,150) size 100x100 [bgcolor=#FFA500]
RenderBlock (inline-block) {spacer} at (0,0) size 40x40 [bgcolor=#FFEFD5] [border: (5px solid #800080)]
RenderBlock (inline-block) {spacer} at (40,0) size 40x40 [bgcolor=#FFEFD5] [border: (5px solid #800080)]
layer at (0,194) size 20x20
RenderBlock (positioned) {absolute} at (0,44) size 20x20 [bgcolor=#008000]
layer at (0,300) size 100x100
RenderFlexibleBox {flex} at (0,300) size 100x100 [bgcolor=#FA8072]
RenderBlock {spacer} at (0,0) size 40x40 [bgcolor=#FFEFD5] [border: (5px solid #800080)]
RenderBlock {spacer} at (40,0) size 40x40 [bgcolor=#FFEFD5] [border: (5px solid #800080)]
layer at (40,300) size 20x20
RenderBlock (positioned) {absolute} at (40,0) size 20x20 [bgcolor=#008000]

18
engine/src/flutter/tests/layout/position-absolute-pixels-expected.sky Normal file
View File

@ -0,0 +1,18 @@
<sky>
<import src="../resources/run-after-display.sky"/>
<img src="http://storage.googleapis.com/mojo/sky-pngs/779342ae094f03cdac369ade75c087d56c742669" />
<script>
import "dart:sky";
import "dart:sky.internals" as internals;
void main() {
window.addEventListener("load", (_) {
runAfterDisplay(() {
internals.notifyTestComplete("");
});
});
}
</script>
</sky>

62
engine/src/flutter/tests/layout/position-absolute-pixels.sky Normal file
View File

@ -0,0 +1,62 @@
<import src="../resources/run-after-display.sky" />
<style>
block, paragraph, flex {
width: 100px;
height: 100px;
margin-bottom: 50px;
/* Make it a positioning root. */
transform: translate3d(0, 0, 0);
}
block { background: pink; }
paragraph {
background: orange;
display: paragraph;
}
flex {
background: salmon;
display: flex;
}
spacer {
height: 30px;
width: 30px;
border: 5px solid purple;
background: papayawhip;
}
absolute {
position: absolute;
width: 20px;
height: 20px;
background: green;
}
</style>
<block>
<spacer />
<absolute />
<spacer />
</block>
<paragraph>
<spacer />
<absolute />
<spacer />
</paragraph>
<flex>
<spacer />
<absolute />
<spacer />
</flex>
<script>
import "dart:sky";
import "dart:sky.internals" as internals;
void main() {
window.addEventListener("load", (_) {
runAfterDisplay(() {
internals.notifyTestComplete("");
});
});
}
</script>

49
engine/src/flutter/tests/layout/position-absolute.sky Normal file
View File

@ -0,0 +1,49 @@
<import src="../resources/dump-as-render-tree.sky" />
<style>
block, paragraph, flex {
width: 100px;
height: 100px;
margin-bottom: 50px;
/* Make it a positioning root. */
transform: translate3d(0, 0, 0);
}
block { background: pink; }
paragraph {
background: orange;
display: paragraph;
}
flex {
background: salmon;
display: flex;
}
spacer {
height: 30px;
width: 30px;
border: 5px solid purple;
background: papayawhip;
}
absolute {
position: absolute;
width: 20px;
height: 20px;
background: green;
}
</style>
<block>
<spacer />
<absolute />
<spacer />
</block>
<paragraph>
<spacer />
<absolute />
<spacer />
</paragraph>
<flex>
<spacer />
<absolute />
<spacer />
</flex>