diff --git a/tests/todo.test.js b/tests/todo.test.js new file mode 100644 index 0000000..7d4db8c --- /dev/null +++ b/tests/todo.test.js @@ -0,0 +1,105 @@ +import { Selector, test } from 'testcafe' + +class TodoPage { + constructor() { + this.input = Selector('.new-todo') + this.editInput = Selector('.edit') + this.todoItems = Selector('.todo-list li') + this.firstTodoItem = Selector('.todo-list li:nth-child(1)') + this.completedTodos = Selector('.completed') + this.completeAll = Selector('.toggle-all') + this.deleteCompleted = Selector('.clear-completed') + this.showActiveLink = Selector('[href="#/active"]') + this.showCompletedLink = Selector('[href="#/completed"]') + } +} + +const todoPage = new TodoPage() + +// fixture('Test TodoMVC App') +// .page('http://todomvc.com/examples/vanillajs/') + + +// Test å lage en todo +// Hint: +// - todoPage.input er feltet du skriver inn i +// - todoPage.todoItems er listen over todos +test('Create todo', async t => { + // == Skriv test her == + + await t + .expect(todoPage.firstTodoItem.textContent) + .contains('Dette er min første todo!') +}) + +// Test å redigere en todo ved å velge første todo +// Hint: +// - Gjennomfør operasjonen med tast og museklikk først +test('Edit todo', async t => { + await t + .typeText(todoPage.input, 'Jeg liker mandager') + .pressKey('enter') + + // == Skriv test her == + + await t + .expect(todoPage.firstTodoItem.textContent) + .contains('Jeg liker fredager') +}) + + +// Test å slette en Todo +// Hint: +// - Du må finne selector for Slette-ikonet for å kunne klikke på det +test('Delete todo', async t => { + await t + .typeText(todoPage.input, 'Klem en sau') + .pressKey('enter') + + .typeText(todoPage.input, 'Klem en tiger') + .pressKey('enter') + + await t + .expect(todoPage.todoItems.count) + .eql(2) + + // == Skriv test her == + + await t + .expect(todoPage.todoItems.count) + .eql(1) + + await t + .expect(todoPage.firstTodoItem.textContent) + .contains('Klem en tiger') +}) + +// Gjennomfør 1 Todo og skriv en test som verifiserer at Todo er streket over +// Hint: +// - Du må finne og klikke på elementet som toggler +// - Testen vil kunne skrives som t.expect().ok() +test('Complete one todo', async t => { + await t + .typeText(todoPage.input, 'Lær javascript') + .pressKey('enter') + + .typeText(todoPage.input, 'Avinstaller ICQ') + .pressKey('enter') + + // == Skriv test her == +}) + + +// Test at Active/Completed visning fungerer +// Hint: +// - Du kan sette 1 Todo til aktive og en til fullfør først +test('Show active/completed todos', async t => { + await t + .typeText(todoPage.input, 'Lær javascript') + .pressKey('enter') + + .typeText(todoPage.input, 'Avinstaller ICQ') + .pressKey('enter') + + // == Skriv test her == +})