2014-10-29 08:01:22 -07:00
|
|
|
/**
|
|
|
|
* Copyright (c) 2014, Facebook, Inc.
|
|
|
|
* All rights reserved.
|
|
|
|
*
|
|
|
|
* This source code is licensed under the BSD-style license found in the
|
|
|
|
* LICENSE file in the root directory of this source tree. An additional grant
|
|
|
|
* of patent rights can be found in the PATENTS file in the same directory.
|
|
|
|
*/
|
2014-09-18 15:15:21 -07:00
|
|
|
package com.facebook.csslayout;
|
|
|
|
|
|
|
|
import org.junit.Test;
|
|
|
|
|
|
|
|
import static junit.framework.Assert.*;
|
|
|
|
|
|
|
|
/**
|
|
|
|
* Tests for {@link LayoutEngine} and {@link CSSNode} to make sure layouts are only generated when
|
|
|
|
* needed.
|
|
|
|
*/
|
|
|
|
public class LayoutCachingTest {
|
|
|
|
|
|
|
|
private void assertTreeHasNewLayout(boolean expectedHasNewLayout, CSSNode root) {
|
|
|
|
assertEquals(expectedHasNewLayout, root.hasNewLayout());
|
|
|
|
|
|
|
|
for (int i = 0; i < root.getChildCount(); i++) {
|
|
|
|
assertTreeHasNewLayout(expectedHasNewLayout, root.getChildAt(i));
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
private void markLayoutAppliedForTree(CSSNode root) {
|
2014-10-08 15:42:51 -07:00
|
|
|
root.markLayoutSeen();
|
2014-09-18 15:15:21 -07:00
|
|
|
for (int i = 0; i < root.getChildCount(); i++) {
|
|
|
|
markLayoutAppliedForTree(root.getChildAt(i));
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
@Test
|
|
|
|
public void testCachesFullTree() {
|
2015-03-23 17:49:47 +00:00
|
|
|
CSSLayoutContext layoutContext = new CSSLayoutContext();
|
2014-09-18 15:15:21 -07:00
|
|
|
CSSNode root = new CSSNode();
|
|
|
|
CSSNode c0 = new CSSNode();
|
|
|
|
CSSNode c1 = new CSSNode();
|
|
|
|
CSSNode c0c0 = new CSSNode();
|
|
|
|
root.addChildAt(c0, 0);
|
|
|
|
root.addChildAt(c1, 1);
|
|
|
|
c0.addChildAt(c0c0, 0);
|
Alter layout engine to conform closer to W3C spec
The primary goals of this change are:
- Better conformance to the W3C flexbox standard (https://www.w3.org/TR/css-flexbox-1/)
and a clear articulation of the areas where it deviates from the spec.
- Support for flex-shrink.
- Conformance with layout effects of "overflow: hidden".
Specifically, here are the limitations of this implementation as compared to the W3C
flexbox standard (this is also documented in Layout.js):
- Display property is always assumed to be 'flex' except for Text nodes, which
are assumed to be 'inline-flex'.
- The 'zIndex' property (or any form of z ordering) is not supported. Nodes are
stacked in document order.
- The 'order' property is not supported. The order of flex items is always defined
by document order.
- The 'visibility' property is always assumed to be 'visible'. Values of 'collapse'
and 'hidden' are not supported.
- The 'wrap' property supports only 'nowrap' (which is the default) or 'wrap'. The
rarely-used 'wrap-reverse' is not supported.
- Rather than allowing arbitrary combinations of flexGrow, flexShrink and
flexBasis, this algorithm supports only the three most common combinations:
- flex: 0 is equiavlent to flex: 0 0 auto
- flex: n (where n is a positive value) is equivalent to flex: n 0 0
- flex: -1 (or any negative value) is equivalent to flex: 0 1 auto
- Margins cannot be specified as 'auto'. They must be specified in terms of pixel
values, and the default value is 0.
- The 'baseline' value is not supported for alignItems and alignSelf properties.
- Values of width, maxWidth, minWidth, height, maxHeight and minHeight must be
specified as pixel values, not as percentages.
- There is no support for calculation of dimensions based on intrinsic aspect ratios
(e.g. images).
- There is no support for forced breaks.
- It does not support vertical inline directions (top-to-bottom or bottom-to-top text).
And here is how the implementation deviates from the standard (this is also documented in
Layout.js):
- Section 4.5 of the spec indicates that all flex items have a default minimum
main size. For text blocks, for example, this is the width of the widest word.
Calculating the minimum width is expensive, so we forego it and assume a default
minimum main size of 0.
- Min/Max sizes in the main axis are not honored when resolving flexible lengths.
- The spec indicates that the default value for 'flexDirection' is 'row', but
the algorithm below assumes a default of 'column'.
2016-04-26 16:35:46 -07:00
|
|
|
|
2015-03-23 17:49:47 +00:00
|
|
|
root.calculateLayout(layoutContext);
|
2014-09-18 15:15:21 -07:00
|
|
|
assertTreeHasNewLayout(true, root);
|
|
|
|
markLayoutAppliedForTree(root);
|
|
|
|
|
2015-03-23 17:49:47 +00:00
|
|
|
root.calculateLayout(layoutContext);
|
2015-01-19 12:37:30 +00:00
|
|
|
assertTrue(root.hasNewLayout());
|
|
|
|
assertTreeHasNewLayout(false, c0);
|
|
|
|
assertTreeHasNewLayout(false, c1);
|
2014-09-18 15:15:21 -07:00
|
|
|
}
|
|
|
|
|
|
|
|
@Test
|
|
|
|
public void testInvalidatesCacheWhenChildAdded() {
|
2015-03-23 17:49:47 +00:00
|
|
|
CSSLayoutContext layoutContext = new CSSLayoutContext();
|
2014-09-18 15:15:21 -07:00
|
|
|
CSSNode root = new CSSNode();
|
|
|
|
CSSNode c0 = new CSSNode();
|
|
|
|
CSSNode c1 = new CSSNode();
|
|
|
|
CSSNode c0c0 = new CSSNode();
|
|
|
|
CSSNode c0c1 = new CSSNode();
|
2015-01-19 12:37:30 +00:00
|
|
|
CSSNode c1c0 = new CSSNode();
|
2014-09-18 15:15:21 -07:00
|
|
|
c0c1.setStyleWidth(200);
|
|
|
|
c0c1.setStyleHeight(200);
|
|
|
|
root.addChildAt(c0, 0);
|
|
|
|
root.addChildAt(c1, 1);
|
|
|
|
c0.addChildAt(c0c0, 0);
|
2015-01-19 12:37:30 +00:00
|
|
|
c0c0.addChildAt(c1c0, 0);
|
2014-09-18 15:15:21 -07:00
|
|
|
|
2015-03-23 17:49:47 +00:00
|
|
|
root.calculateLayout(layoutContext);
|
2014-09-18 15:15:21 -07:00
|
|
|
markLayoutAppliedForTree(root);
|
|
|
|
|
|
|
|
c0.addChildAt(c0c1, 1);
|
|
|
|
|
2015-03-23 17:49:47 +00:00
|
|
|
root.calculateLayout(layoutContext);
|
2014-09-18 15:15:21 -07:00
|
|
|
assertTrue(root.hasNewLayout());
|
|
|
|
assertTrue(c0.hasNewLayout());
|
|
|
|
assertTrue(c0c1.hasNewLayout());
|
|
|
|
|
2015-01-19 12:37:30 +00:00
|
|
|
assertTrue(c0c0.hasNewLayout());
|
|
|
|
assertTrue(c1.hasNewLayout());
|
|
|
|
|
2015-10-15 01:30:33 +03:00
|
|
|
assertTrue(c1c0.hasNewLayout());
|
2014-09-18 15:15:21 -07:00
|
|
|
}
|
|
|
|
|
|
|
|
@Test
|
|
|
|
public void testInvalidatesCacheWhenEnumPropertyChanges() {
|
2015-03-23 17:49:47 +00:00
|
|
|
CSSLayoutContext layoutContext = new CSSLayoutContext();
|
2014-09-18 15:15:21 -07:00
|
|
|
CSSNode root = new CSSNode();
|
|
|
|
CSSNode c0 = new CSSNode();
|
|
|
|
CSSNode c1 = new CSSNode();
|
|
|
|
CSSNode c0c0 = new CSSNode();
|
|
|
|
root.addChildAt(c0, 0);
|
|
|
|
root.addChildAt(c1, 1);
|
|
|
|
c0.addChildAt(c0c0, 0);
|
|
|
|
|
2015-03-23 17:49:47 +00:00
|
|
|
root.calculateLayout(layoutContext);
|
2014-09-18 15:15:21 -07:00
|
|
|
markLayoutAppliedForTree(root);
|
|
|
|
|
|
|
|
c1.setAlignSelf(CSSAlign.CENTER);
|
2015-03-23 17:49:47 +00:00
|
|
|
root.calculateLayout(layoutContext);
|
2014-09-18 15:15:21 -07:00
|
|
|
|
|
|
|
assertTrue(root.hasNewLayout());
|
|
|
|
assertTrue(c1.hasNewLayout());
|
|
|
|
|
2015-01-19 12:37:30 +00:00
|
|
|
assertTrue(c0.hasNewLayout());
|
2014-09-18 15:15:21 -07:00
|
|
|
assertFalse(c0c0.hasNewLayout());
|
|
|
|
}
|
|
|
|
|
|
|
|
@Test
|
|
|
|
public void testInvalidatesCacheWhenFloatPropertyChanges() {
|
2015-03-23 17:49:47 +00:00
|
|
|
CSSLayoutContext layoutContext = new CSSLayoutContext();
|
2014-09-18 15:15:21 -07:00
|
|
|
CSSNode root = new CSSNode();
|
|
|
|
CSSNode c0 = new CSSNode();
|
|
|
|
CSSNode c1 = new CSSNode();
|
|
|
|
CSSNode c0c0 = new CSSNode();
|
|
|
|
root.addChildAt(c0, 0);
|
|
|
|
root.addChildAt(c1, 1);
|
|
|
|
c0.addChildAt(c0c0, 0);
|
|
|
|
|
2015-03-23 17:49:47 +00:00
|
|
|
root.calculateLayout(layoutContext);
|
2014-09-18 15:15:21 -07:00
|
|
|
markLayoutAppliedForTree(root);
|
|
|
|
|
2015-01-19 12:37:30 +00:00
|
|
|
c1.setMargin(Spacing.LEFT, 10);
|
2015-03-23 17:49:47 +00:00
|
|
|
root.calculateLayout(layoutContext);
|
2014-09-18 15:15:21 -07:00
|
|
|
|
|
|
|
assertTrue(root.hasNewLayout());
|
|
|
|
assertTrue(c1.hasNewLayout());
|
|
|
|
|
2015-01-19 12:37:30 +00:00
|
|
|
assertTrue(c0.hasNewLayout());
|
2015-10-15 01:30:33 +03:00
|
|
|
assertTrue(c0c0.hasNewLayout());
|
2014-09-18 15:15:21 -07:00
|
|
|
}
|
|
|
|
|
|
|
|
@Test
|
|
|
|
public void testInvalidatesFullTreeWhenParentWidthChanges() {
|
2015-03-23 17:49:47 +00:00
|
|
|
CSSLayoutContext layoutContext = new CSSLayoutContext();
|
2014-09-18 15:15:21 -07:00
|
|
|
CSSNode root = new CSSNode();
|
|
|
|
CSSNode c0 = new CSSNode();
|
|
|
|
CSSNode c1 = new CSSNode();
|
|
|
|
CSSNode c0c0 = new CSSNode();
|
2015-01-19 12:37:30 +00:00
|
|
|
CSSNode c1c0 = new CSSNode();
|
2014-09-18 15:15:21 -07:00
|
|
|
root.addChildAt(c0, 0);
|
|
|
|
root.addChildAt(c1, 1);
|
|
|
|
c0.addChildAt(c0c0, 0);
|
2015-01-19 12:37:30 +00:00
|
|
|
c1.addChildAt(c1c0, 0);
|
2014-09-18 15:15:21 -07:00
|
|
|
|
2015-03-23 17:49:47 +00:00
|
|
|
root.calculateLayout(layoutContext);
|
2014-09-18 15:15:21 -07:00
|
|
|
markLayoutAppliedForTree(root);
|
|
|
|
|
|
|
|
c0.setStyleWidth(200);
|
2015-03-23 17:49:47 +00:00
|
|
|
root.calculateLayout(layoutContext);
|
2014-09-18 15:15:21 -07:00
|
|
|
|
|
|
|
assertTrue(root.hasNewLayout());
|
|
|
|
assertTrue(c0.hasNewLayout());
|
|
|
|
assertTrue(c0c0.hasNewLayout());
|
|
|
|
|
2015-01-19 12:37:30 +00:00
|
|
|
assertTrue(c1.hasNewLayout());
|
2015-10-15 01:30:33 +03:00
|
|
|
assertTrue(c1c0.hasNewLayout());
|
2014-09-18 15:15:21 -07:00
|
|
|
}
|
|
|
|
|
|
|
|
@Test
|
|
|
|
public void testDoesNotInvalidateCacheWhenPropertyIsTheSame() {
|
2015-03-23 17:49:47 +00:00
|
|
|
CSSLayoutContext layoutContext = new CSSLayoutContext();
|
2014-09-18 15:15:21 -07:00
|
|
|
CSSNode root = new CSSNode();
|
|
|
|
CSSNode c0 = new CSSNode();
|
|
|
|
CSSNode c1 = new CSSNode();
|
|
|
|
CSSNode c0c0 = new CSSNode();
|
|
|
|
root.addChildAt(c0, 0);
|
|
|
|
root.addChildAt(c1, 1);
|
|
|
|
c0.addChildAt(c0c0, 0);
|
|
|
|
root.setStyleWidth(200);
|
|
|
|
|
2015-03-23 17:49:47 +00:00
|
|
|
root.calculateLayout(layoutContext);
|
2014-09-18 15:15:21 -07:00
|
|
|
markLayoutAppliedForTree(root);
|
|
|
|
|
2014-10-08 15:42:51 -07:00
|
|
|
root.setStyleWidth(200);
|
2015-03-23 17:49:47 +00:00
|
|
|
root.calculateLayout(layoutContext);
|
2015-01-19 12:37:30 +00:00
|
|
|
|
|
|
|
assertTrue(root.hasNewLayout());
|
|
|
|
assertTreeHasNewLayout(false, c0);
|
|
|
|
assertTreeHasNewLayout(false, c1);
|
|
|
|
}
|
|
|
|
|
|
|
|
@Test
|
|
|
|
public void testInvalidateCacheWhenHeightChangesPosition() {
|
2015-03-23 17:49:47 +00:00
|
|
|
CSSLayoutContext layoutContext = new CSSLayoutContext();
|
2015-01-19 12:37:30 +00:00
|
|
|
CSSNode root = new CSSNode();
|
|
|
|
CSSNode c0 = new CSSNode();
|
|
|
|
CSSNode c1 = new CSSNode();
|
|
|
|
CSSNode c1c0 = new CSSNode();
|
|
|
|
root.addChildAt(c0, 0);
|
|
|
|
root.addChildAt(c1, 1);
|
|
|
|
c1.addChildAt(c1c0, 0);
|
|
|
|
|
2015-03-23 17:49:47 +00:00
|
|
|
root.calculateLayout(layoutContext);
|
2015-01-19 12:37:30 +00:00
|
|
|
markLayoutAppliedForTree(root);
|
|
|
|
|
|
|
|
c0.setStyleHeight(100);
|
2015-03-23 17:49:47 +00:00
|
|
|
root.calculateLayout(layoutContext);
|
2015-01-19 12:37:30 +00:00
|
|
|
|
|
|
|
assertTrue(root.hasNewLayout());
|
|
|
|
assertTrue(c0.hasNewLayout());
|
|
|
|
assertTrue(c1.hasNewLayout());
|
|
|
|
assertFalse(c1c0.hasNewLayout());
|
2014-10-08 15:42:51 -07:00
|
|
|
}
|
|
|
|
|
|
|
|
@Test
|
|
|
|
public void testInvalidatesOnNewMeasureFunction() {
|
2015-03-23 17:49:47 +00:00
|
|
|
CSSLayoutContext layoutContext = new CSSLayoutContext();
|
2014-10-08 15:42:51 -07:00
|
|
|
CSSNode root = new CSSNode();
|
|
|
|
CSSNode c0 = new CSSNode();
|
|
|
|
CSSNode c1 = new CSSNode();
|
|
|
|
CSSNode c0c0 = new CSSNode();
|
|
|
|
root.addChildAt(c0, 0);
|
|
|
|
root.addChildAt(c1, 1);
|
|
|
|
c0.addChildAt(c0c0, 0);
|
2014-09-18 15:15:21 -07:00
|
|
|
|
2015-03-23 17:49:47 +00:00
|
|
|
root.calculateLayout(layoutContext);
|
2014-10-08 15:42:51 -07:00
|
|
|
markLayoutAppliedForTree(root);
|
|
|
|
|
|
|
|
c1.setMeasureFunction(new CSSNode.MeasureFunction() {
|
|
|
|
@Override
|
2016-01-06 16:56:56 +00:00
|
|
|
public void measure(CSSNode node, float width, CSSMeasureMode widthMode, float height, CSSMeasureMode heightMode, MeasureOutput measureOutput) {
|
2014-10-08 15:42:51 -07:00
|
|
|
measureOutput.width = 100;
|
|
|
|
measureOutput.height = 20;
|
|
|
|
}
|
|
|
|
});
|
|
|
|
|
2015-03-23 17:49:47 +00:00
|
|
|
root.calculateLayout(layoutContext);
|
2014-10-08 15:42:51 -07:00
|
|
|
|
|
|
|
assertTrue(root.hasNewLayout());
|
|
|
|
assertTrue(c1.hasNewLayout());
|
|
|
|
|
2015-01-19 12:37:30 +00:00
|
|
|
assertTrue(c0.hasNewLayout());
|
2015-10-15 01:30:33 +03:00
|
|
|
assertTrue(c0c0.hasNewLayout());
|
2014-09-18 15:15:21 -07:00
|
|
|
}
|
|
|
|
}
|