From 34e2ba2811aaf4cccb51bb29182f1b63acd99ada Mon Sep 17 00:00:00 2001
From: Patrick Smith <pgwsmith@gmail.com>
Date: Tue, 30 Jan 2024 11:48:47 +1100
Subject: [PATCH] Calendar keyboard navigation tests

---
 src/roles/calendar.test.tsx | 50 +++++++++++++++++++++++++++++++++++++
 1 file changed, 50 insertions(+)

diff --git a/src/roles/calendar.test.tsx b/src/roles/calendar.test.tsx
index f70685e..a96cee8 100644
--- a/src/roles/calendar.test.tsx
+++ b/src/roles/calendar.test.tsx
@@ -1,6 +1,7 @@
 import * as React from 'react';
 import { Calendar } from './calendar';
 import { prettyDOM, render } from '@testing-library/react';
+import user from '@testing-library/user-event';
 import '@testing-library/jest-dom';
 import { CalendarSpectrum } from './Calendar-spectrum';
 import { screenTest } from '../screen';
@@ -71,6 +72,55 @@ describe('Calendar', () => {
           expect(dispatch).toHaveBeenCalledTimes(1);
         });
       });
+
+      describe('keyboard navigation', () => {
+        beforeEach(async () => {
+          await user.tab(); // Previous
+          await user.tab(); // Next
+          await user.tab(); // Cells in Grid
+        });
+
+        it('focuses on selected day', () => {
+          const selectedDay = screenTest(Calendar.dayGridCell().selected);
+          expect(screenTest(Calendar.dayButton(), selectedDay)).toHaveFocus();
+        });
+
+        it('can go left', async () => {
+          await user.keyboard('{ArrowLeft}');
+          expect(
+            screenTest(Calendar.dayButton(/February 2, 2020/))
+          ).toHaveFocus();
+        });
+
+        it('can go right', async () => {
+          await user.keyboard('{ArrowRight}');
+          expect(
+            screenTest(Calendar.dayButton(/February 4, 2020/))
+          ).toHaveFocus();
+        });
+
+        it('can select left with Enter key', async () => {
+          await user.keyboard('{ArrowLeft}{Enter}');
+          const selectedDay = screenTest(Calendar.dayGridCell().selected);
+          expect(
+            screenTest(Calendar.dayButton(/February 2, 2020/), selectedDay)
+          ).toHaveFocus();
+        });
+
+        it('can select right with Enter key', async () => {
+          await user.keyboard('{ArrowRight}{Enter}');
+          expect(
+            screenTest(Calendar.dayButton(/February 4, 2020/))
+          ).toHaveFocus();
+        });
+
+        it('focuses next week after pressing right arrow 7 times', async () => {
+          await user.keyboard(new Array(7).fill('{ArrowRight}').join(''));
+          expect(
+            screenTest(Calendar.dayButton(/February 10, 2020/))
+          ).toHaveFocus();
+        });
+      });
     }
   );
 });