Merge pull request #367 from YutaGoto/add-index-page-testcase-20240712

✅ add link click and search sord testing
YutaGoto · Jul 26, 2024 · 13e71e7 · 13e71e7
2 parents f645251 + 00533d3
commit 13e71e7
Show file tree

Hide file tree

Showing 2 changed files with 16 additions and 0 deletions.
diff --git a/e2e/home.spec.ts b/e2e/home.spec.ts
@@ -6,4 +6,17 @@ test.describe('root page', async () => {
 
     await expect(page).toHaveTitle('自撮りハイラル図鑑');
   });
+
+  test('go detail page', async ({ page }) => {
+    await page.goto('/');
+    await page.click('text=モリイノシシ');
+    await expect(page).toHaveTitle('モリイノシシ - 自撮りハイラル図鑑');
+  });
+
+  test('search by name', async ({ page }) => {
+    await page.goto('/');
+    await page.fill('input[name="freeword"]', 'モリイノシシ');
+    await expect(page.getByText('モリイノシシ').first()).toBeVisible();
+    await expect(page.getByText('モリブリン').first()).not.toBeVisible();
+  });
 });
diff --git a/ui/SearchForm.tsx b/ui/SearchForm.tsx
@@ -50,6 +50,7 @@ export const SearchForm = () => {
       <label>
         <span className="text-sky-300">種類</span>
         <select
+          name="category"
           onChange={(e) => updateSearchParams('category', e.target.value)}
           value={selectedOptions.get('category') || ''}
           className="w-full bg-zinc-900 text-sky-300 rounded-lg border border-sky-300 px-4 py-3 hover:border-sky-700"
@@ -65,6 +66,7 @@ export const SearchForm = () => {
       <label>
         <span className="text-sky-300">場所</span>
         <select
+          name="location"
           onChange={(e) => updateSearchParams('location', e.target.value)}
           value={selectedOptions.get('location') || ''}
           className="w-full bg-zinc-900 text-sky-300 rounded-lg border border-sky-300 px-4 py-3 hover:border-sky-700"
@@ -81,6 +83,7 @@ export const SearchForm = () => {
       <label>
         <span className="text-sky-300">フリーワード</span>
         <input
+          name="freeword"
           onChange={(e) => onChangeSearchText(e.target.value)}
           defaultValue={searchText}
           className="w-full bg-zinc-900 text-sky-300 rounded-lg border border-sky-300 px-4 py-3 hover:border-sky-700"