forked from boranton/testcafe-workshop
106 lines
2.7 KiB
JavaScript
106 lines
2.7 KiB
JavaScript
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(<test>).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 ==
|
|
})
|