# TodoMVC demo

A public todo list for tests.

## 1. Navigate to TodoMVC demo

![Navigate to TodoMVC demo](shots/step-01.png)

Go to the TodoMVC demo page.

## 2. Add a todo

![Add a todo](shots/step-02.png)

Click the new todo input field.

## 3. Add a todo

![Add a todo](shots/step-03.png)

Type 'Buy milk' into the input.

## 4. Add a todo

![Add a todo](shots/step-04.png)

Press Enter to add the todo.

## 5. Add another todo

![Add another todo](shots/step-05.png)

Click the new todo input again.

## 6. Add another todo

![Add another todo](shots/step-06.png)

Type 'Walk the dog' into the input.

## 7. Add another todo

![Add another todo](shots/step-07.png)

Press Enter to add the second todo.

## 8. Complete a todo

![Complete a todo](shots/step-08.png)

Click the checkbox on the 'Buy milk' item to complete it.

## 9. Filter active

![Filter active](shots/step-09.png)

Click the 'Active' filter to show only incomplete todos.

## 10. Filter completed

![Filter completed](shots/step-10.png)

Click the 'Completed' filter to show only finished todos.

## 11. Show all

![Show all](shots/step-11.png)

Click the 'All' filter to see the full list again.

## 12. Clear completed

![Clear completed](shots/step-12.png)

Click the 'Clear completed' button to remove the finished todo.

Open the app: https://demo.playwright.dev/todomvc/