add tree view test case

test/functional/fixtures/tree.html

@@ -0,0 +1,82 @@
+<script src="../../../dist/vue.js"></script>
+<style>
+.item {
+    cursor: pointer;
+    font-family: monospace;
+    color: #999;
+}
+.item.folder {
+    color: #333;
+}
+</style>
+
+<div id="demo">
+    <ul id="root">
+        <li v-component="folder" v-with="model: treeData"></li>
+    </ul>
+</div>
+
+<script type="text/x-template" id="folder-template">
+    <div class="item folder" v-on="click: open = !open">
+        {{model.name}} [{{open ? '-' : '+'}}]
+    </div>
+    <ul v-show="open">
+        <li v-repeat="model: model.children | orderBy 'type'"
+            v-component="{{model.type}}">
+        </li>
+    </ul>
+</script>
+
+<script type="text/x-template" id="file-template">
+    <div class="item file">{{model.name}}</div>
+</script>
+
+<script>
+Vue.component('folder', {
+    template: '#folder-template',
+    data: {
+        open: false
+    }
+})
+
+Vue.component('file', {
+    template: '#file-template'
+})
+
+var menu = new Vue({
+    el: '#demo',
+    data: {
+        treeData: {
+            name: 'My Tree',
+            children: [
+                { type: 'file', name: 'hello' },
+                { type: 'file', name: 'wat' },
+                {
+                    type: 'folder',
+                    name: 'child folder',
+                    children: [
+                        {
+                            type: 'folder',
+                            name: 'child folder',
+                            children: [
+                                { type: 'file', name: 'hello' },
+                                { type: 'file', name: 'wat' }
+                            ]
+                        },
+                        { type: 'file', name: 'hello' },
+                        { type: 'file', name: 'wat' },
+                        {
+                            type: 'folder',
+                            name: 'child folder',
+                            children: [
+                                { type: 'file', name: 'hello' },
+                                { type: 'file', name: 'wat' }
+                            ]
+                        }
+                    ]
+                }
+            ]
+        }
+    }
+})
+</script>

test/functional/specs/tree.js

@@ -0,0 +1,28 @@
+casper.test.begin('Tree View', 11, function (test) {
+
+    casper
+    .start('./fixtures/tree.html')
+    .then(function () {
+        test.assertElementCount('.item', 12)
+        test.assertElementCount('ul', 5)
+        test.assertSelectorHasText('.item.folder', 'My Tree')
+        test.assertSelectorHasText('li:nth-child(1) .item.file', 'hello')
+        test.assertSelectorHasText('li:nth-child(2) .item.file', 'wat')
+        test.assertVisible('#root')
+        test.assertNotVisible('#root li > ul')
+    })
+    .thenClick('.item.folder', function () {
+        test.assertVisible('#root li > ul')
+        test.assertNotVisible('#root li > ul li > ul')
+    })
+    .thenClick('#root li > ul .item.folder', function () {
+        test.assertVisible('#root li > ul li > ul')
+    })
+    .thenClick('.item.folder', function () {
+        test.assertNotVisible('#root li > ul')
+    })
+    .run(function () {
+        test.done()
+    })
+
+})