add tests for dynamic view instance name changes

ruimgoncalves · Dec 1, 2014 · 013b5ef · 013b5ef
1 parent 760a6b1
commit 013b5ef
Show file tree

Hide file tree

Showing 3 changed files with 72 additions and 3 deletions.
diff --git a/package.json b/package.json
@@ -12,8 +12,8 @@
     "test": "./node_modules/.bin/mocha test/all/*.mocha.js; ./node_modules/.bin/jshint lib/*.js test/*.js"
   },
   "dependencies": {
-    "derby-parsing": "^0.3.0",
-    "derby-templates": "^0.2.2",
+    "derby-parsing": "^0.3.2",
+    "derby-templates": "^0.2.3",
     "html-util": "~0.2.1",
     "tracks": "^0.5.0",
     "racer": "0.6.0-alpha24",

diff --git a/test/browser/bindings.mocha.js b/test/browser/bindings.mocha.js
@@ -4,6 +4,75 @@ var derby = new DerbyStandalone();
 require('derby-parsing');
 
 describe('bindings', function() {
+  describe('dynamic view instances', function() {
+    it('simple dynamic view', function() {
+      var app = derby.createApp();
+      app.views.register('Body', '<view is="{{_page.view}}" optional></view>');
+      app.views.register('one', 'One');
+      app.views.register('two', 'Two');
+      var page = app.createPage();
+      var view = page.model.at('_page.view');
+      view.set('one');
+      var fragment = page.getFragment('Body');
+      expectHtml(fragment, 'One');
+      view.set('two');
+      expectHtml(fragment, 'Two');
+      view.del();
+      expectHtml(fragment, '');
+      view.set('one');
+      expectHtml(fragment, 'One');
+    });
+    it('bracketed dynamic view', function() {
+      var app = derby.createApp();
+      app.views.register('Body', '<view is="{{_page.names[_page.index]}}" optional></view>');
+      app.views.register('one', 'One');
+      app.views.register('two', 'Two');
+      app.views.register('three', 'Three');
+      var page = app.createPage();
+      page.model.set('_page.names', ['one', 'two']);
+      var index = page.model.at('_page.index');
+      index.set(0);
+      var fragment = page.getFragment('Body');
+      expectHtml(fragment, 'One');
+      index.set(1);
+      expectHtml(fragment, 'Two');
+      index.del();
+      expectHtml(fragment, '');
+      index.set(0);
+      expectHtml(fragment, 'One');
+      page.model.set('_page.names', ['two', 'one']);
+      expectHtml(fragment, 'Two');
+      page.model.unshift('_page.names', 'three');
+      expectHtml(fragment, 'Three');
+    });
+    it('only renders if the expression value changes', function() {
+      var app = derby.createApp();
+      var count = 0;
+      app.proto.count = function() {
+        return count++;
+      };
+      app.proto.lower = function(value) {
+        return value.toLowerCase();
+      };
+      app.views.register('Body', '<view is="{{lower(_page.view)}}"></view>');
+      app.views.register('one', 'One {{count()}}');
+      app.views.register('two', 'Two {{count()}}');
+      var page = app.createPage();
+      var view = page.model.at('_page.view');
+      view.set('one');
+      var fragment = page.getFragment('Body');
+      expectHtml(fragment, 'One 0');
+      view.set('two');
+      expectHtml(fragment, 'Two 1');
+      view.set('TWO');
+      expectHtml(fragment, 'Two 1');
+      view.set('ONE');
+      expectHtml(fragment, 'One 2');
+      view.set('one');
+      expectHtml(fragment, 'One 2');
+    });
+  });
+
   function testArray(itemTemplate, itemData) {
     it('each on path', function() {
       var app = derby.createApp();

diff --git a/test/public/index.html b/test/public/index.html
@@ -1,6 +1,6 @@
 <!DOCTYPE html>
 <meta charset="utf-8">
-<title>Saddle Tests</title>
+<title>Derby Tests</title>
 <link rel="stylesheet" href="/mocha.css">
 
 <body>