Skip to content

con tests funcionando #3

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
cfsalguero wants to merge 2 commits into
base: master
Choose a base branch
from
Open

con tests funcionando #3

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
0ae2810
con tests funcionando
cfsalguero Nov 10, 2015
7e2aac0
deshabilita botones de edicion
cfsalguero Nov 10, 2015
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
120 changes: 120 additions & 0 deletions client/demo/todo-list-cs/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,120 @@
<html ng-app >
<head>
<script src="/bower_components/jquery/dist/jquery.js"></script>
<script src="/bower_components/angular/angular.js"></script>
<script src="/bower_components/bootstrap/dist/js/bootstrap.js"></script>
<script src="/bower_components/angular-bootstrap/ui-bootstrap-tpls.js"></script>
<link rel="stylesheet" href="/bower_components/bootstrap/dist/css/bootstrap.css">
<script src="/demo/todo-list-controller/todo-list.controller.js"></script>
</head>
<body ng-init="list=[];
isEditing=false;
index=-1;
itemTypes=['food', 'transportation', 'lodging', 'financial', 'sales', 'other'];">
<div class="container">
<div class="row">
<h2>Todo List #{{list.length}}</h2>
</div>

<div class="row">
<div class="col-md-1 text-right">
Date:
</div>
<div class="col-md-11">
<input id="date" type="text" ng-model="date">
</div>
<div class="col-md-1 text-right">
Type:
</div>
<div class="col-md-11">
<select id="type" ng-model="type">
<option ng-repeat="type in itemTypes" value="{{type}}">{{type}}</option>
</select>
</div>
<div class="col-md-1 text-right">
Description:
</div>
<div class="col-md-11">
<input id="description" type="text" ng-model="description">
</div>
<div class="col-md-1 text-right">
Amount:
</div>
<div class="col-md-11">
<input id="amount" type="number" ng-model="amount">
</div>
<div class="col-md-1 text-right">
</div>
<div class="col-md-11">
<input id="add-button" class="btn btn-default" type="button" value="Add"
ng-click="item={date:date, type: type, description: description, amount: amount};
date=''; type=''; description=''; amount='';
list.push(item);"
ng-hide="isEditing">

<input id="cancel-button" class="btn btn-default" type="button" value="Cancel"
ng-click="addBtnDisplay='inline'; updBtnDisplay='none';
date=''; type=''; description=''; amount='';
isEditing=false;"
ng-show="isEditing">

<input id="update-button" class="btn btn-default" type="button" value="Update"
ng-click="list[index]={date:date, type: type, description: description, amount: amount};
date=''; type=''; description=''; amount='';
isEditing=false;"
ng-show="isEditing">
</div>
</div>
<table class="table">
<thead>
<tr>
<th>Date</th>
<th>Type</th>
<th>Description</th>
<th>Amount</th>
<th>Action</th>
</tr>
</thead>
<tbody id="items-list">
<tr ng-repeat="item in list">
<td>{{item.date}}</td>
<td>{{item.type}}</td>
<td>{{item.description}}</td>
<td>{{item.amount}}</td>
<td>
<input class="btn btn-default btn-xs" type="button" value="X" id="delete-{{$index}}"
ng-click="list.splice(list.indexOf(item), 1)"
ng-hide="isEditing">

<input class="btn btn-xs" type="button" value="E" id="edit-{{$index}}"
ng-click="$parent.description=item.description;
$parent.date=item.date;
$parent.type=item.type;
$parent.amount=item.amount;
$parent.index=list.indexOf(item);
$parent.isEditing=true;"
ng-hide="isEditing">
</td>
</tr>
</tbody>
</table>
<table>
<thead>
<tr>
<th>Type</th>
<th>Total</th>
</tr>
</thead>
<tbody id="totals-list">
<tr ng-repeat="type in itemTypes">
<td>{{type}}</td>
<td ng-init="total=0;" ng-repeat="item in list | filter: type">{{total + item.amout * 1}}</td>
</tr>
<tbody>
</table>

<div>
</div>
</div>
</body>
</html>
170 changes: 170 additions & 0 deletions e2e/todo-list-cs/main.spec.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,170 @@
'use strict';

describe('Main View', function() {
var page;

beforeEach(function() {
browser.get('/demo/todo-list-cs/');
page = {};
});

it('should add item to table', function() {
page.date = element(by.id('date'));
page.date.sendKeys('01/01/1980');

page.type = element(by.cssContainingText('option', 'food')).click();

page.description = element(by.id('description'));
page.description.sendKeys('a description');

page.amount = element(by.id('amount'));
page.amount.sendKeys('79014');

page.button = element(by.id('add-button'));
page.button.click();

page.addButton = element(by.id('add-button'));
expect(page.addButton.getAttribute('class')).to.eventually.not.contains('ng-hide');

page.cancelButton = element(by.id('cancel-button'));
expect(page.cancelButton.getAttribute('class')).to.eventually.contains('ng-hide');

page.updateButton = element(by.id('update-button'));
expect(page.updateButton.getAttribute('class')).to.eventually.contains('ng-hide');

// Items in the main table (items in CRUD list)
var itemsList = element(by.id('items-list')).all(by.css('tr'));
expect(itemsList.count()).to.eventually.equal(1);

var itemsList = element(by.id('items-list')).all(by.css('tr')).then(function(rows) {
return rows[0].$$('td').then(function(cols) {
expect(cols[0].getText()).to.eventually.equal('01/01/1980');
expect(cols[1].getText()).to.eventually.equal('food');
expect(cols[2].getText()).to.eventually.equal('a description');
expect(cols[3].getText()).to.eventually.equal('79014');
/* left here just as an example
return cols[0].getText().then(function (text) {
console.log('text:', text);
});
*/

});
});

// Check totals table
var totalsList = element(by.id('totals-list')).all(by.css('tr'));
expect(totalsList.count()).to.eventually.equal(6); // 6 types

var totalsList = element(by.id('totals-list')).all(by.css('tr')).then(function(rows) {
return rows[0].$$('td').then(function(cols) {
expect(cols[1].getText()).to.eventually.equal('NaN');

});
});

// Check if input fields have been cleared
var desc = element(by.id('description'))
expect(desc.getAttribute('value')).to.eventually.equal('');

var date = element(by.id('date'))
expect(date.getAttribute('value')).to.eventually.equal('');

var amount = element(by.id('amount'))
expect(amount.getAttribute('value')).to.eventually.equal('');


// Check edit first item
page.button = element(by.id('edit-0'));
page.button.click();

var date = element(by.id('date'))
expect(date.getAttribute('value')).to.eventually.equal('01/01/1980');

var desc = element(by.id('description'))
expect(desc.getAttribute('value')).to.eventually.equal('a description');

var amount = element(by.id('amount'))
expect(amount.getAttribute('value')).to.eventually.equal('79014');


// Clickig on cancel must left all items unchanged and it must clear all
// the input fields again
page.button = element(by.id('cancel-button'));
page.button.click();

var itemsList = element(by.id('items-list')).all(by.css('tr')).then(function(rows) {
return rows[0].$$('td').then(function(cols) {
expect(cols[0].getText()).to.eventually.equal('01/01/1980');
expect(cols[1].getText()).to.eventually.equal('food');
expect(cols[2].getText()).to.eventually.equal('a description');
expect(cols[3].getText()).to.eventually.equal('79014');
});
});

var desc = element(by.id('description'))
expect(desc.getAttribute('value')).to.eventually.equal('');

var date = element(by.id('date'))
expect(date.getAttribute('value')).to.eventually.equal('');

var amount = element(by.id('amount'))
expect(amount.getAttribute('value')).to.eventually.equal('');

// Check button's states have been updated
page.addButton = element(by.id('add-button'));
expect(page.addButton.getAttribute('class')).to.not.eventually.contains('ng-hide');

page.cancelButton = element(by.id('cancel-button'));
expect(page.cancelButton.getAttribute('class')).to.eventually.contains('ng-hide');

page.updateButton = element(by.id('update-button'));
expect(page.updateButton.getAttribute('class')).to.eventually.contains('ng-hide');

// Edit the first item and change the date
// After updating the input fields should be cleared again
page.button = element(by.id('edit-0'));
page.button.click();

page.date = element(by.id('date'));
page.date.clear();
page.date.sendKeys('01/01/1981');

page.button = element(by.id('update-button'));
page.button.click();

var itemsList = element(by.id('items-list')).all(by.css('tr')).then(function(rows) {
return rows[0].$$('td').then(function(cols) {
expect(cols[0].getText()).to.eventually.equal('01/01/1981');
expect(cols[1].getText()).to.eventually.equal('food');
expect(cols[2].getText()).to.eventually.equal('a description');
expect(cols[3].getText()).to.eventually.equal('79014');
});
});

var desc = element(by.id('description'))
expect(desc.getAttribute('value')).to.eventually.equal('');

var date = element(by.id('date'))
expect(date.getAttribute('value')).to.eventually.equal('');

var amount = element(by.id('amount'))
expect(amount.getAttribute('value')).to.eventually.equal('');

// Check button's states have been updated
page.addButton = element(by.id('add-button'));
expect(page.addButton.getAttribute('class')).to.eventually.not.contains('ng-hide');

page.cancelButton = element(by.id('cancel-button'));
expect(page.cancelButton.getAttribute('class')).to.eventually.contains('ng-hide');

page.updateButton = element(by.id('update-button'));
expect(page.updateButton.getAttribute('class')).to.eventually.contains('ng-hide');
// Delete the first (and only) item.
page.button = element(by.id('delete-0'));
page.button.click();

var itemsList = element.all(by.repeater('item in list'));
expect(itemsList.count()).to.eventually.equal(0);

});
});