diff options
Diffstat (limited to '')
| -rw-r--r-- | tests/todo-app.spec.ts | 47 |
1 files changed, 35 insertions, 12 deletions
diff --git a/tests/todo-app.spec.ts b/tests/todo-app.spec.ts index 2bdcdee..7fe7d2f 100644 --- a/tests/todo-app.spec.ts +++ b/tests/todo-app.spec.ts @@ -4,27 +4,50 @@ import { delay, loadHTMLFixture } from './util' describe('todo-app example', () => { describe('Add new task', () => { + let $textInput: HTMLInputElement + let $addBtn: HTMLButtonElement + + let $taskItems: Array<HTMLElement> = [] + + const submit = async (text: string) => { + $textInput.value = text + $addBtn.click() + + await delay(100) + $taskItems = [ + ...document.querySelectorAll<HTMLElement>( + '[data-instance="task-item"]', + ), + ] + } + beforeAll(async () => { await loadHTMLFixture('todo-app') - }) - it('should add new unchecked task', async () => { - const $textInput = getByTestId<HTMLInputElement>( + $textInput = getByTestId<HTMLInputElement>( document.body, 'add-task-input', ) - $textInput.value = 'Buy Milk' + $addBtn = getByTestId<HTMLButtonElement>(document.body, 'add-task-btn') + }) - const $addBtn = getByTestId<HTMLButtonElement>( - document.body, - 'add-task-btn', + it('should add new unchecked task', async () => { + // Add first item + await submit('Buy Milk') + expect($taskItems).toHaveLength(1) + expect(getComputedStyle($taskItems[0]).getPropertyValue('--text')).toBe( + 'Buy Milk', ) - $addBtn.click() - await delay(100) - - console.log(prettyDOM(document.getElementById('task-list')!)) - console.log('-------------------') + // Add the second item + await submit('Kill all the non-believers') + expect($taskItems).toHaveLength(2) + expect(getComputedStyle($taskItems[0]).getPropertyValue('--text')).toBe( + 'Buy Milk', + ) + expect(getComputedStyle($taskItems[1]).getPropertyValue('--text')).toBe( + 'Kill all the non-believers', + ) }) }) }) |