Manage profile skills with a tag input
Medium50 pts~2 min
- Tag inputs
- Keyboard input
- Validation messages
- Collections
Practice app · ConnectIn
A professional network: a 3-step sign-up wizard, a feed with likes, comments and lazy-loaded posts, a notifications dropdown, a messaging drawer with auto-replies, job search with filters and a multi-step Easy Apply modal, member profiles with connect/withdraw, a skills tag input and company pages that open a careers site in a new tab.
Your starter code already declares TEST_URL — never hardcode a host.
Objective
On your profile, add two skills with the Enter key, remove one, and verify that a duplicate skill is rejected with a message.
Your task
- 1Open TEST_URL (you are already signed in) and open your profile (#nav-me).
- 2Type “Playwright” into #skill-input and press Enter, then do the same for “TypeScript”.
- 3Remove the Java skill with its × button (.skill-remove inside [data-testid="skill-chip"][data-skill="java"]).
- 4Type “selenium” (lower case) into #skill-input and press Enter.
- 5Assert #skill-error says the skill is already in your skills, 4 chips remain (Selenium, API Testing, Playwright, TypeScript) and #skill-count reads “4/10 skills”.
Acceptance criteria
- Playwright and TypeScript are added as skill chips.
- Java has been removed.
- The duplicate “selenium” is rejected with an error message.
- The skill counter reads 4/10 skills.
- The test makes at least three assertions.
Fixtures
- alex@connectin.test
- Password
- Connect@2026
- Account name
- Alex Morgan
- Password rules
- 8+ characters with an uppercase letter, a number and a special character
- Locations
- Bengaluru, India · Berlin, Germany · London, UK · New York, US · Toronto, Canada
- Featured company
- Northwind Labs (#/company/northwind-labs)
Selenium WebDriver 4 · Selenium Challenges · ConnectIn