/*global availity, describe, it, beforeEach, expect, module*/

describe('dropdown', function() {

  'use strict';

  var $el;

  var fixtures = {
    'default': '<select class="form-control select2" placeholder="Select One" data-av-dropdown data-ng-model="demo.selected" data-ng-options="selection for selection in demo.selections"></select>'
  };

  beforeEach(function() {
    module('availity');
    module('availity.ui');
  });

  availity.mock.directiveSpecHelper();

  it('should create DOM structure', function () {
    $el = availity.mock.compileDirective(fixtures['default']);
    availity.mock.flush();
    expect($el.siblings().is('div.select2-container')).toBe(true);
  });

  describe('should update dropdown model', function() {

    it('for string array', function () {

      availity.mock.$scope.demo = {};
      availity.mock.$scope.demo.selections = ['first', 'second', 'third'];
      availity.mock.$scope.demo.selected = 'first';

      $el = availity.mock.compileDirective(fixtures['default']);

      availity.mock.flush();

      availity.mock.$scope.demo.selected = 'second';
      availity.mock.$scope.$apply();
      availity.mock.flush();
      expect($el.select2('val')).toBe('1');

    });

    it('for object array', function () {

      availity.mock.$scope.demo = {};
      availity.mock.$scope.demo.selections = [
        {
          id: 1,
          value: 'first'
        },
        {
          id: 2,
          value: 'second'
        },
        {
          id: 3,
          value: 'third'
        }
      ];
      availity.mock.$scope.demo.selected = availity.mock.$scope.demo.selections[0];

      $el = availity.mock.compileDirective(fixtures['default']);

      availity.mock.flush();

      availity.mock.$scope.demo.selected = availity.mock.$scope.demo.selections[1];
      availity.mock.$scope.$apply();
      availity.mock.flush();
      expect($el.select2('val')).toBe('1');

    });

    it('for null value', function () {

      availity.mock.$scope.demo = {};
      availity.mock.$scope.demo.selections = [
        {
          id: 1,
          value: 'first'
        },
        {
          id: 2,
          value: 'second'
        },
        {
          id: 3,
          value: 'third'
        }
      ];
      availity.mock.$scope.demo.selected = availity.mock.$scope.demo.selections[0];

      $el = availity.mock.compileDirective(fixtures['default']);

      availity.mock.flush();

      availity.mock.$scope.demo.selected = null;
      availity.mock.$scope.$apply();
      availity.mock.flush();
      expect($el.select2('val')).toBe('');

    });


  });



});

@@ -162,16 +162,34 @@
 '%3Cselect
+ name=%22demoSelect%22
  class=%22
@@ -698,16 +698,622 @@
 %0A  %7D);%0A%0A
+  describe('control should be in proper state ', function() %7B%0A%0A    it('to be $pristine on load', function() %7B%0A%0A      availity.mock.$scope.demo = %7B%7D;%0A      availity.mock.$scope.demo.selections = %5B'first', 'second', 'third'%5D;%0A      availity.mock.$scope.demo.selected = null;%0A%0A      $el = availity.mock.compileDirective(fixtures%5B'default'%5D);%0A      availity.mock.flush();%0A%0A      expect($el.data('$ngModelController').$pristine).toBe(true);%0A%0A      // this should update the model and control state%0A      $el.trigger('change');%0A      expect($el.data('$ngModelController').$pristine).toBe(false);%0A%0A    %7D);%0A  %7D);%0A%0A
   descri

add dropdown spec for $pristine state on init