add some basic perf-o-matic tests for flexbox
authortony@chromium.org <tony@chromium.org@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Wed, 9 May 2012 22:45:20 +0000 (22:45 +0000)
committertony@chromium.org <tony@chromium.org@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Wed, 9 May 2012 22:45:20 +0000 (22:45 +0000)
https://bugs.webkit.org/show_bug.cgi?id=86017

Reviewed by Ryosuke Niwa.

Each of these tests take < 3s on my machine.

* Layout/flexbox-column-nowrap.html: Added.
* Layout/flexbox-column-wrap.html: Added.
* Layout/flexbox-row-nowrap.html: Added.
* Layout/flexbox-row-wrap.html: Added.

git-svn-id: http://svn.webkit.org/repository/webkit/trunk@116564 268f45cc-cd09-0410-ab3c-d52691b4dbfc

PerformanceTests/ChangeLog
PerformanceTests/Layout/flexbox-column-nowrap.html [new file with mode: 0644]
PerformanceTests/Layout/flexbox-column-wrap.html [new file with mode: 0644]
PerformanceTests/Layout/flexbox-row-nowrap.html [new file with mode: 0644]
PerformanceTests/Layout/flexbox-row-wrap.html [new file with mode: 0644]

index 4487b7e..b7be623 100644 (file)
@@ -1,3 +1,17 @@
+2012-05-09  Tony Chang  <tony@chromium.org>
+
+        add some basic perf-o-matic tests for flexbox
+        https://bugs.webkit.org/show_bug.cgi?id=86017
+
+        Reviewed by Ryosuke Niwa.
+
+        Each of these tests take < 3s on my machine.
+
+        * Layout/flexbox-column-nowrap.html: Added.
+        * Layout/flexbox-column-wrap.html: Added.
+        * Layout/flexbox-row-nowrap.html: Added.
+        * Layout/flexbox-row-wrap.html: Added.
+
 2012-05-05  Ilya Tikhonovsky  <loislo@chromium.org>
 
         Web Inspector: unreviewed followup fix for the performance test after r116218.
diff --git a/PerformanceTests/Layout/flexbox-column-nowrap.html b/PerformanceTests/Layout/flexbox-column-nowrap.html
new file mode 100644 (file)
index 0000000..6c523ee
--- /dev/null
@@ -0,0 +1,35 @@
+<!DOCTYPE html>
+<html>
+<head>
+<script src="../resources/runner.js"></script>
+</head>
+<body style="overflow-y: scroll">
+
+<div id="flexbox" style="height: 400px; -webkit-flex-direction: column; -webkit-flex-pack: center; -webkit-flex-align: center;">
+    <div style="-webkit-flex: 1 auto">1</div>
+    <div style="-webkit-flex: 2 auto">2 2</div>
+    <div style="-webkit-flex: 3 auto">3 3 3</div>
+    <div style="-webkit-flex: 4 auto">4 4 4 4</div>
+    <div style="-webkit-flex: 5 auto">5 5 5 5 5</div>
+    <div style="-webkit-flex: 6 auto">6 6 6 6 6 6</div>
+    <div style="-webkit-flex: 7 auto">7 7 7 7 7 7 7</div>
+    <div style="-webkit-flex: 8 auto">8 8 8 8 8 8 8 8</div>
+    <div style="-webkit-flex: 9 auto">9 9 9 9 9 9 9 9 9</div>
+    <div style="-webkit-flex: 10 auto">10 10 10 10 10 10 10 10 10</div>
+</div>
+
+</body>
+<script>
+function runTest()
+{
+    document.getElementById("flexbox").style.display = '-webkit-flexbox';
+    document.body.clientHeight;
+    document.getElementById("flexbox").style.display = '';
+    document.body.clientHeight;
+}
+
+PerfTestRunner.run(runTest, 180, 20, function() {
+    document.getElementById("flexbox").style.display = 'none';
+});
+</script>
+</html>
diff --git a/PerformanceTests/Layout/flexbox-column-wrap.html b/PerformanceTests/Layout/flexbox-column-wrap.html
new file mode 100644 (file)
index 0000000..78c6b6a
--- /dev/null
@@ -0,0 +1,35 @@
+<!DOCTYPE html>
+<html>
+<head>
+<script src="../resources/runner.js"></script>
+</head>
+<body style="overflow-y: scroll">
+
+<div id="flexbox" style="height: 400px; -webkit-flex-flow: column wrap; -webkit-flex-pack: center; -webkit-flex-align: center;">
+    <div style="-webkit-flex: 1 180px">1</div>
+    <div style="-webkit-flex: 2 auto">2 2</div>
+    <div style="-webkit-flex: 3 180px">3 3 3</div>
+    <div style="-webkit-flex: 4 auto">4 4 4 4</div>
+    <div style="-webkit-flex: 5 180px">5 5 5 5 5</div>
+    <div style="-webkit-flex: 6 auto">6 6 6 6 6 6</div>
+    <div style="-webkit-flex: 7 180px">7 7 7 7 7 7 7</div>
+    <div style="-webkit-flex: 8 auto">8 8 8 8 8 8 8 8</div>
+    <div style="-webkit-flex: 9 180px">9 9 9 9 9 9 9 9 9</div>
+    <div style="-webkit-flex: 10 auto">10 10 10 10 10 10 10 10 10</div>
+</div>
+
+</body>
+<script>
+function runTest()
+{
+    document.getElementById("flexbox").style.display = '-webkit-flexbox';
+    document.body.clientHeight;
+    document.getElementById("flexbox").style.display = '';
+    document.body.clientHeight;
+}
+
+PerfTestRunner.run(runTest, 180, 20, function() {
+    document.getElementById("flexbox").style.display = 'none';
+});
+</script>
+</html>
diff --git a/PerformanceTests/Layout/flexbox-row-nowrap.html b/PerformanceTests/Layout/flexbox-row-nowrap.html
new file mode 100644 (file)
index 0000000..b772dad
--- /dev/null
@@ -0,0 +1,35 @@
+<!DOCTYPE html>
+<html>
+<head>
+<script src="../resources/runner.js"></script>
+</head>
+<body style="overflow-y: scroll">
+
+<div id="flexbox" style="-webkit-flex-pack: center; -webkit-flex-align: center">
+    <div style="-webkit-flex: 1">1</div>
+    <div style="-webkit-flex: 2">2<br>2</div>
+    <div style="-webkit-flex: 3">3<br>3<br>3</div>
+    <div style="-webkit-flex: 4">4<br>4<br>4<br>4</div>
+    <div style="-webkit-flex: 5">5<br>5<br>5<br>5<br>5</div>
+    <div style="-webkit-flex: 6">6<br>6<br>6<br>6<br>6<br>6</div>
+    <div style="-webkit-flex: 7">7<br>7<br>7<br>7<br>7<br>7<br>7</div>
+    <div style="-webkit-flex: 8">8<br>8<br>8<br>8<br>8<br>8<br>8<br>8</div>
+    <div style="-webkit-flex: 9">9<br>9<br>9<br>9<br>9<br>9<br>9<br>9<br>9</div>
+    <div style="-webkit-flex: 10">10<br>10<br>10<br>10<br>10<br>10<br>10<br>10<br>10</div>
+</div>
+
+</body>
+<script>
+function runTest()
+{
+    document.getElementById("flexbox").style.display = '-webkit-flexbox';
+    document.body.clientHeight;
+    document.getElementById("flexbox").style.display = '';
+    document.body.clientHeight;
+}
+
+PerfTestRunner.run(runTest, 100, 20, function() {
+    document.getElementById("flexbox").style.display = 'none';
+});
+</script>
+</html>
diff --git a/PerformanceTests/Layout/flexbox-row-wrap.html b/PerformanceTests/Layout/flexbox-row-wrap.html
new file mode 100644 (file)
index 0000000..8eca105
--- /dev/null
@@ -0,0 +1,35 @@
+<!DOCTYPE html>
+<html>
+<head>
+<script src="../resources/runner.js"></script>
+</head>
+<body style="overflow-y: scroll">
+
+<div id="flexbox" style="width: 300px; -webkit-flex-wrap: wrap; -webkit-flex-pack: center; -webkit-flex-align: center">
+    <div style="-webkit-flex: 1 120px">1</div>
+    <div style="-webkit-flex: 2 auto">2<br>2</div>
+    <div style="-webkit-flex: 3 120px">3<br>3<br>3</div>
+    <div style="-webkit-flex: 4 auto">4<br>4<br>4<br>4</div>
+    <div style="-webkit-flex: 5 120px">5<br>5<br>5<br>5<br>5</div>
+    <div style="-webkit-flex: 6 auto">6<br>6<br>6<br>6<br>6<br>6</div>
+    <div style="-webkit-flex: 7 120px">7<br>7<br>7<br>7<br>7<br>7<br>7</div>
+    <div style="-webkit-flex: 8 auto">8<br>8<br>8<br>8<br>8<br>8<br>8<br>8</div>
+    <div style="-webkit-flex: 9 120px">9<br>9<br>9<br>9<br>9<br>9<br>9<br>9<br>9</div>
+    <div style="-webkit-flex: 10 auto">10<br>10<br>10<br>10<br>10<br>10<br>10<br>10<br>10</div>
+</div>
+
+</body>
+<script>
+function runTest()
+{
+    document.getElementById("flexbox").style.display = '-webkit-flexbox';
+    document.body.clientHeight;
+    document.getElementById("flexbox").style.display = '';
+    document.body.clientHeight;
+}
+
+PerfTestRunner.run(runTest, 100, 20, function() {
+    document.getElementById("flexbox").style.display = 'none';
+});
+</script>
+</html>