fix: E2E 互換性のため ShiftForm に tablist ロールを付与し POM を更新

- DateRail に role="tablist"/role="tab"/aria-selected を追加
- ViewTabs に role="tablist"/role="tab"/aria-selected を追加
- ConfirmButton のラベルを「確定して通知する」に合わせる
- POM: switchDateTab/switchToOverview を新ロールで再実装、expectConfirmedStatus は first() で絞り込み
- 一覧テーブル判定は hasText ベースに変更

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

Author: yn1323

e2e/pages/ShiftBoardPage.ts

@@ -17,13 +17,11 @@ export class ShiftBoardPage {
   }
 
   async switchDateTab(index: number) {
-    const tabs = this.page.getByRole("tab");
-    await tabs.nth(index).click();
+    await this.page.getByRole("tablist", { name: "日付選択" }).getByRole("tab").nth(index).click();
   }
 
   async switchToOverview() {
-    // PC/SPで2つのSegmentGroupが存在するためlabelテキストをクリック
-    await this.page.locator("[data-scope='segment-group'] [data-part='item-text']").getByText("一覧").first().click();
+    await this.page.getByRole("tablist", { name: "ビュー切替" }).getByRole("tab", { name: "一覧" }).first().click();
   }
 
   async confirm(staffCount: number) {
@@ -39,7 +37,7 @@ export class ShiftBoardPage {
   }
 
   async expectConfirmedStatus() {
-    await expect(this.page.getByText(/確定済み/)).toBeVisible();
+    await expect(this.page.getByText(/確定済み/).first()).toBeVisible();
   }
 
   async expectResendButton() {

e2e/scenarios/first-shift-delivery.test.ts

@@ -128,10 +128,9 @@ test.describe("田中さんの初めてのシフト確定", () => {
 
     await test.step("Step 7: 一覧ビューで最終確認する", async () => {
       await shiftBoard.switchToOverview();
-      // daily/overviewのテーブルが両方DOMにあるため、visible なテーブルを対象
-      const table = page.locator("table").filter({ has: page.getByRole("button", { name: /田中太郎/ }) });
+      const table = page.locator("table").filter({ hasText: "田中太郎" }).first();
       await expect(table).toBeVisible();
-      await expect(table.getByText(/\d{1,2}:\d{2}-\d{1,2}:\d{2}/).first()).toBeVisible();
+      await expect(table.getByText(/\d{1,2}:\d{2}.\d{1,2}:\d{2}/).first()).toBeVisible();
     });
 
     await test.step("Step 8: シフトを確定して通知する", async () => {

src/components/features/Shift/ShiftForm/components.tsx

@@ -29,12 +29,14 @@ export const ViewTabs = ({ value, onChange }: { value: ViewMode; onChange: (v: V
     { k: "overview", label: "一覧" },
   ];
   return (
-    <Flex gap={0}>
+    <Flex gap={0} role="tablist" aria-label="ビュー切替">
       {tabs.map((t) => {
         const active = value === t.k;
         return (
           <Box
             key={t.k}
+            role="tab"
+            aria-selected={active}
             onClick={() => onChange(t.k)}
             cursor="pointer"
             py="10px"
@@ -168,7 +170,7 @@ type ConfirmButtonProps = {
 };
 
 export const ConfirmButton = ({ compact = false, isConfirmed = false, onClick }: ConfirmButtonProps) => {
-  const label = compact ? (isConfirmed ? "再通知" : "確定") : isConfirmed ? "再通知する" : "確定して通知";
+  const label = compact ? (isConfirmed ? "再通知" : "確定") : isConfirmed ? "再通知する" : "確定して通知する";
   return (
     <button
       type="button"

src/components/features/Shift/ShiftForm/pc/DailyView/DateRail.tsx

@@ -17,14 +17,27 @@ const dayColor = (dateStr: string, holidays: string[]): string => {
 };
 
 export const DateRail = ({ dates, selectedDate, onSelect, holidays = [] }: Props) => (
-  <Box w="80px" h="100%" borderRightWidth="1px" borderColor="gray.200" bg="white" py={2} flexShrink={0} overflow="auto">
+  <Box
+    w="80px"
+    h="100%"
+    borderRightWidth="1px"
+    borderColor="gray.200"
+    bg="white"
+    py={2}
+    flexShrink={0}
+    overflow="auto"
+    role="tablist"
+    aria-label="日付選択"
+  >
     <Stack gap={1} px={2}>
       {dates.map((iso) => {
         const d = dayjs(iso);
         const active = iso === selectedDate;
         return (
           <Box
             key={iso}
+            role="tab"
+            aria-selected={active}
             onClick={() => onSelect(iso)}
             cursor="pointer"
             py="6px"