+2014-02-04 Zoltan Horvath <zoltan@webkit.org>
+
+ [CSS Shapes] Add initial performance test for shape-outside: content-box
+ https://bugs.webkit.org/show_bug.cgi?id=128190
+
+ Reviewed by Ryosuke Niwa.
+
+ I've introduced Shapes subdirectory in Layout, every CSS Shapes related performance tests should
+ go there in the future. The initial performance tests uses 'shape-outside: content-box' in order
+ to tests the code paths of the Shapes implementation. I also introduced shapes.js, which allows us
+ to easily add new, simple performance tests for shape-outside.
+
+ The entire progress is tracked under #128188 meta bug.
+
+ * Layout/Shapes/ShapeOutsideContentBox.html: Added.
+ * Layout/Shapes/resources/shapes.css: Added.
+ * Layout/Shapes/resources/shapes.js: Added.
+ * Skipped: We skip running the tests by default for now.
+
2014-01-17 Manuel Rego Casasnovas <rego@igalia.com>
[CSS Regions] Minor fixes in regions performance tests
--- /dev/null
+<!DOCTYPE html>
+<html>
+ <head>
+ <link rel="stylesheet" href="resources/shapes.css" type="text/css"></link>
+ <script src="../../resources/runner.js"></script>
+ <script>
+ var templateParagraph = null;
+ var templateFloatingNode = null;
+ var DEFAULT_SHAPE_OBJECT_COUNT = 100;
+
+ function createParagraphNode() {
+ if (!templateParagraph) {
+ templateParagraph = document.createElement("p");
+ templateParagraph.innerHTML = "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam at turpis placerat sapien congue viverra nec sed felis.\
+ Aenean aliquam, justo eu condimentum pharetra, arcu eros blandit metus, nec lacinia nisi orci vitae nunc.\
+ Proin orci libero, accumsan non dignissim at, sodales in sapien. Curabitur dui nibh, venenatis vel tempus vel, accumsan nec velit.\
+ Nam sit amet tempor lacus. Sed mollis dolor nibh, non tempus leo. Donec magna odio, commodo id porta in, aliquam mollis eros.\
+ Pellentesque vulputate gravida ligula in elementum. Fusce lacinia massa justo, at porttitor orci.\
+ Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Donec odio quam, pulvinar ut porttitor ac, tempor vitae ligula.\
+ Cras aliquet sapien id sapien mollis nec pulvinar mauris adipiscing. Praesent porttitor consequat augue, sit amet mollis justo condimentum eu.\
+ Etiam ut erat pellentesque orci congue interdum. Nulla eu eros mi.\
+ Curabitur rutrum, lorem ac malesuada pellentesque, sapien risus consequat massa, eget pellentesque nunc nulla vel sem.";
+ templateParagraph.className = "contentParagraph";
+ }
+
+ var paragraph = templateParagraph.cloneNode(true);
+ return paragraph;
+ }
+
+ function createFloatingNode(width, height, shape) {
+ if (!templateFloatingNode) {
+ templateFloatingNode = document.createElement("div");
+ templateFloatingNode.className = "floatingObject";
+ }
+
+ var float = templateFloatingNode.cloneNode(false);
+ float.style.width = width;
+ float.style.height = height;
+ float.style.webkitShapeOutside = shape;
+ return float;
+ }
+
+ function addArticles(floatingObjects, paragraphCount) {
+ for (var i = 0; i < paragraphCount; ++i) {
+ floatingObjects.appendChild(createParagraphNode());
+ }
+ }
+
+ function createFloatingObjects(width, height, shape, floatingObjectCount) {
+ var testBox = document.createElement("div");
+ for (var i = 0; i < floatingObjectCount; ++i) {
+ testBox.appendChild(createFloatingNode(width, height, shape));
+ testBox.appendChild(createParagraphNode())
+ }
+ testBox.className = "testBox";
+ return testBox;
+ }
+
+ function applyFloating() {
+ var floatingObjects = document.getElementsByClassName('floatingObject');
+ for (i = 0; i < floatingObjects.length; ++i) {
+ floatingObjects[i].style.cssFloat = 'left';
+ }
+ }
+
+ function createShapeOutsideTest(width, height, shape, shapeObjectCount) {
+ shapeObjectCount = shapeObjectCount || DEFAULT_SHAPE_OBJECT_COUNT;
+
+ var floatingObjects = createFloatingObjects(width, height, shape, shapeObjectCount);
+ document.body.appendChild(floatingObjects);
+ return {
+ description: "Testing shapes with " + shape +" using " + shapeObjectCount + " shapes.",
+ run: function() {
+ applyFloating();
+ document.body.offsetTop;
+ },
+ setup: function() {
+ PerfTestRunner.resetRandomSeed();
+ document.body.offsetTop;
+ },
+ done: function() {
+ document.body.removeChild(floatingObjects);
+ templateParagraph = null;
+ }
+ };
+ }
+ </script>
+ </head>
+ <body>
+ <pre id="log"></pre>
+ <script>
+ var shape = "content-box";
+ PerfTestRunner.measureTime(createShapeOutsideTest("200px", "200px", shape, 1000));
+ </script>
+ </body>
+</html>