Filter buttons should match design

test/test_service_view.js

 'use strict';
 
 (function() {
   describe('juju service view', function() {
     var models, Y, container, service, db, conn, env, charm, ENTER, ESC,
         makeServiceView, makeServiceRelationsView, views, unit;
 
     before(function(done) {
       Y = YUI(GlobalConfig).use(
           'juju-views', 'juju-models', 'base', 'node', 'json-parse',
@@ skipping 354 matching lines @@
 
          test('.exposeService', '.unexposeService',
               Y.bind(view._exposeServiceCallback, view));
          test('.unexposeService', '.exposeService',
               Y.bind(view._unexposeServiceCallback, view));
        });
 
     it('should show proper tabs initially', function() {
       var view = makeServiceView(),
           active_navtabs = [];
-      container.all('.state-btn').each(
+      container.all('.state-title').each(
           function(n) {
-            active_navtabs.push([n.one('.state-title').get('text').trim(),
-                                 n.hasClass('btn-primary')]);
+            active_navtabs.push([n.get('text').trim(),
+                                 n.hasClass('active')]);
           });
       active_navtabs.should.eql(
           [['All', true],
            ['Running', false],
            ['Pending', false],
            ['Error', false]]);
     });
 
     it('should show zero running units when filtered', function() {
       // All units are pending.
       var view = makeServiceView({state: 'running'}),
           active_navtabs = [];
-      container.all('.state-btn').each(
+      container.all('.state-title').each(
           function(n) {
-            active_navtabs.push([n.one('.state-title').get('text').trim(),
-                                 n.hasClass('btn-primary')]);
+            active_navtabs.push([n.get('text').trim(),
+                                 n.hasClass('active')]);
           });
       active_navtabs.should.eql(
           [['All', false],
            ['Running', true],
            ['Pending', false],
            ['Error', false]]);
       container.all('div.thumbnail').get('id').length.should.equal(0);
     });
 
     it('should show some running units when filtered', function() {
       db.units.getById('mysql/0').agent_state = 'started';
       // 1 is pending.
       db.units.getById('mysql/2').agent_state = 'started';
       var view = makeServiceView({state: 'running'});
       var rendered_names = container.one(
           'ul.thumbnails').all('div.unit').get('id');
       rendered_names.should.eql(['mysql/0', 'mysql/2']);
     });
 
     it('should show zero pending units when filtered', function() {
       db.units.getById('mysql/0').agent_state = 'install-error';
       db.units.getById('mysql/1').agent_state = 'error';
       db.units.getById('mysql/2').agent_state = 'started';
       var view = makeServiceView({state: 'pending'}),
           active_navtabs = [];
-      container.all('.state-btn').each(
+      container.all('.state-title').each(
           function(n) {
-            active_navtabs.push([n.one('.state-title').get('text').trim(),
-                                 n.hasClass('btn-primary')]);
+            active_navtabs.push([n.get('text').trim(),
+                                 n.hasClass('active')]);
           });
       active_navtabs.should.eql(
           [['All', false],
            ['Running', false],
            ['Pending', true],
            ['Error', false]]);
       container.all('div.thumbnail').get('id').length.should.equal(0);
     });
 
     it('should show some pending units when filtered', function() {
       // 0 is pending already.
       db.units.getById('mysql/1').agent_state = 'started';
       // We include  installed with pending.
       db.units.getById('mysql/2').agent_state = 'installed';
       var view = makeServiceView({state: 'pending'});
       var rendered_names = container.one(
           'ul.thumbnails').all('div.unit').get('id');
       rendered_names.should.eql(['mysql/0', 'mysql/2']);
     });
 
     it('should show zero error units when filtered', function() {
       var view = makeServiceView({state: 'error'}),
           active_navtabs = [];
-      container.all('.state-btn').each(
+      container.all('.state-title').each(
           function(n) {
-            active_navtabs.push([n.one('.state-title').get('text').trim(),
-                                 n.hasClass('btn-primary')]);
+            active_navtabs.push([n.get('text').trim(),
+                                 n.hasClass('active')]);
           });
       active_navtabs.should.eql(
           [['All', false],
            ['Running', false],
            ['Pending', false],
            ['Error', true]]);
       container.all('div.thumbnail').get('id').length.should.equal(0);
     });
 
     it('should show some error units when filtered', function() {
@@ skipping 201 matching lines @@
         agent_state: 'error'
       }], filtered = views.service.prototype.filterUnits('error', units);
 
       assert.equal(2, filtered.length);
       assert.equal('error1', filtered[0].testKey);
       assert.equal('error2', filtered[1].testKey);
     });
 
   });
 }) ();