diff --git a/examples/nested/index.html b/examples/nested/index.html
new file mode 100644
index 00000000000..a1fbea5a531
--- /dev/null
+++ b/examples/nested/index.html
@@ -0,0 +1,28 @@
+
+
+
+
+ Vue.js nested demo
+
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/examples/nested/nested.js b/examples/nested/nested.js
new file mode 100644
index 00000000000..a2530b28fff
--- /dev/null
+++ b/examples/nested/nested.js
@@ -0,0 +1,35 @@
+// define the child component
+Vue.component('child', {
+ template: '#child-template',
+ data: function () {
+ return {
+ state: {
+ created: false,
+ ready: false
+ }
+ }
+ },
+ created: function() {
+ this.state.created = true
+ },
+ ready: function() {
+ this.state.ready = true
+ }
+})
+
+// boot up the demo
+var parent = new Vue({
+ el: '#demo',
+ data: {
+ state: {
+ created: false,
+ ready: false
+ }
+ },
+ created: function() {
+ this.state.created = true
+ },
+ ready: function() {
+ this.state.ready = true
+ }
+})
diff --git a/test/e2e/nested.js b/test/e2e/nested.js
new file mode 100644
index 00000000000..e10d9c4413b
--- /dev/null
+++ b/test/e2e/nested.js
@@ -0,0 +1,15 @@
+casper.test.begin('nested', 5, function (test) {
+ casper
+ .start('../../examples/nested/index.html')
+ .then(function () {
+ test.assertElementCount('span', 4)
+ test.assertSelectorHasText('span.one', 'true')
+ test.assertSelectorHasText('span.two', 'true')
+ test.assertSelectorHasText('span.three', 'true')
+ test.assertSelectorHasText('span.four', 'true')
+ })
+ // run
+ .run(function () {
+ test.done()
+ })
+})