<!doctype html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Example - example-ngChange-directive-production</title>
  

  <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.4.0/angular.min.js"></script>
  

  
</head>
<body ng-app="changeExample">
  <script>
  angular.module('changeExample', [])
    .controller('ExampleController', ['$scope', function($scope) {
      $scope.selects = [
        {name: "1"},
        {name: "2"}
      ];
      $scope.counter = 0;
  
      $scope.change = function() {
        $scope.counter++;
      };
      $scope.sendMessage = function() {
        $scope.message = "Message sent";
      }
  
      $scope.confirmed = true;
      $scope.mySelectBox = $scope.selects[1];
    }]);
  </script>
<div ng-controller="ExampleController">
  <select ng-model="mySelectBox"
          ng-options="item.name for item in selects track by item.name"
          ng-change="sendMessage()">
  </select>
  <input type="checkbox" ng-model="confirmed" ng-change="change()" id="ng-change-example1" />
  <input type="checkbox" ng-model="confirmed" id="ng-change-example2" />
  <label for="ng-change-example2">Confirmed</label><br />
  <tt>debug = {{confirmed}}</tt><br/>
  <tt>counter = {{counter}}</tt><br/>
  <tt>message = {{message}}</tt><br/>
</div>
</body>
</html>
var counter = element(by.binding('counter'));
var debug = element(by.binding('confirmed'));

it('should evaluate the expression if changing from view', function() {
  expect(counter.getText()).toContain('0');

  element(by.id('ng-change-example1')).click();

  expect(counter.getText()).toContain('1');
  expect(debug.getText()).toContain('true');
});

it('should not evaluate the expression if changing from model', function() {
  element(by.id('ng-change-example2')).click();

  expect(counter.getText()).toContain('0');
  expect(debug.getText()).toContain('true');
});