Pill bar below search: All | Projects | Notes | Events | People | Experiments | Procedures | Responsibilities. Clicking a pill filters the displayed entries by isA type. "All" resets the filter. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
83 lines
3.7 KiB
TypeScript
83 lines
3.7 KiB
TypeScript
import { test, expect } from '@playwright/test'
|
|
|
|
test.beforeEach(async ({ page }) => {
|
|
await page.goto('/')
|
|
await page.waitForTimeout(500) // Wait for mock data
|
|
})
|
|
|
|
test('All Notes shows all entries', async ({ page }) => {
|
|
const count = page.locator('.note-list__count')
|
|
await expect(count).toHaveText('12')
|
|
})
|
|
|
|
test('clicking People filter shows only people', async ({ page }) => {
|
|
await page.click('text=People')
|
|
await page.waitForTimeout(100)
|
|
const count = page.locator('.note-list__count')
|
|
await expect(count).toHaveText('1')
|
|
await expect(page.locator('.note-list__title', { hasText: 'Matteo Cellini' })).toBeVisible()
|
|
await page.screenshot({ path: 'test-results/filter-people.png' })
|
|
})
|
|
|
|
test('clicking Events filter shows only events', async ({ page }) => {
|
|
await page.click('text=Events')
|
|
await page.waitForTimeout(100)
|
|
const count = page.locator('.note-list__count')
|
|
await expect(count).toHaveText('1')
|
|
await expect(page.locator('.note-list__title', { hasText: 'Laputa App Design Session' })).toBeVisible()
|
|
await page.screenshot({ path: 'test-results/filter-events.png' })
|
|
})
|
|
|
|
test('clicking PROJECTS header shows all projects', async ({ page }) => {
|
|
await page.click('text=PROJECTS')
|
|
await page.waitForTimeout(100)
|
|
const count = page.locator('.note-list__count')
|
|
await expect(count).toHaveText('1')
|
|
await expect(page.locator('.note-list__title', { hasText: 'Build Laputa App' })).toBeVisible()
|
|
await page.screenshot({ path: 'test-results/filter-projects.png' })
|
|
})
|
|
|
|
test('clicking specific entity shows it pinned with children', async ({ page }) => {
|
|
await page.locator('.sidebar__item', { hasText: 'Build Laputa App' }).click()
|
|
await page.waitForTimeout(100)
|
|
// Pinned entity + children that belongTo this project
|
|
await expect(page.locator('.note-list__title', { hasText: 'Build Laputa App' })).toBeVisible()
|
|
await expect(page.locator('.note-list__title', { hasText: 'Facebook Ads Strategy' })).toBeVisible()
|
|
await expect(page.locator('.note-list__title', { hasText: 'Budget Allocation' })).toBeVisible()
|
|
await expect(page.locator('.note-list__item--pinned')).toBeVisible()
|
|
await page.screenshot({ path: 'test-results/filter-entity.png' })
|
|
})
|
|
|
|
test('clicking topic shows entries related to that topic', async ({ page }) => {
|
|
await page.locator('.sidebar__topic-item', { hasText: 'Software Development' }).click()
|
|
await page.waitForTimeout(100)
|
|
await expect(page.locator('.note-list__title', { hasText: 'Build Laputa App' })).toBeVisible()
|
|
await page.screenshot({ path: 'test-results/filter-topic.png' })
|
|
})
|
|
|
|
test('search bar filters by title substring', async ({ page }) => {
|
|
await page.fill('.note-list__search-input', 'budget')
|
|
await page.waitForTimeout(100)
|
|
const count = page.locator('.note-list__count')
|
|
await expect(count).toHaveText('1')
|
|
await expect(page.locator('.note-list__title', { hasText: 'Budget Allocation' })).toBeVisible()
|
|
await expect(page.locator('.note-list__title', { hasText: 'Build Laputa App' })).not.toBeVisible()
|
|
await page.screenshot({ path: 'test-results/search-budget.png' })
|
|
})
|
|
|
|
test('type filter pills narrow results', async ({ page }) => {
|
|
// Click "Projects" pill
|
|
await page.locator('.note-list__pill', { hasText: 'Projects' }).click()
|
|
await page.waitForTimeout(100)
|
|
const count = page.locator('.note-list__count')
|
|
await expect(count).toHaveText('1')
|
|
await expect(page.locator('.note-list__title', { hasText: 'Build Laputa App' })).toBeVisible()
|
|
await expect(page.locator('.note-list__title', { hasText: 'Matteo Cellini' })).not.toBeVisible()
|
|
await page.screenshot({ path: 'test-results/pill-projects.png' })
|
|
|
|
// Click "All" to reset
|
|
await page.locator('.note-list__pill', { hasText: 'All' }).click()
|
|
await page.waitForTimeout(100)
|
|
await expect(count).toHaveText('12')
|
|
})
|