diff --git a/.changeset/mean-cherries-press.md b/.changeset/mean-cherries-press.md
new file mode 100644
index 0000000000..ecb7905e50
--- /dev/null
+++ b/.changeset/mean-cherries-press.md
@@ -0,0 +1,7 @@
+---
+"@khanacademy/wonder-blocks-clickable": major
+"@khanacademy/wonder-blocks-dropdown": major
+"@khanacademy/wonder-blocks-core": major
+---
+
+Fixes keyboard tests in Dropdown and Clickable with specific key events. We now check `event.key` instead of `event.which` or `event.keyCode` to remove deprecated event properties and match the keys returned from Testing Library/userEvent.
diff --git a/__docs__/wonder-blocks-dropdown/single-select.accessibility.stories.tsx b/__docs__/wonder-blocks-dropdown/single-select.accessibility.stories.tsx
index 08b81b89bc..2a0db8647a 100644
--- a/__docs__/wonder-blocks-dropdown/single-select.accessibility.stories.tsx
+++ b/__docs__/wonder-blocks-dropdown/single-select.accessibility.stories.tsx
@@ -57,3 +57,29 @@ export const UsingAriaAttributes = {
     render: SingleSelectAccessibility.bind({}),
     name: "Using aria attributes",
 };
+
+// This story exists for debugging automated unit tests.
+const SingleSelectKeyboardSelection = () => {
+    const [selectedValue, setSelectedValue] = React.useState("");
+    return (
+        <View>
+            <SingleSelect
+                placeholder="Choose"
+                onChange={setSelectedValue}
+                selectedValue={selectedValue}
+            >
+                <OptionItem label="apple" value="apple" />
+                <OptionItem label="orange" value="orange" />
+                <OptionItem label="pear" value="pear" />
+            </SingleSelect>
+        </View>
+    );
+};
+
+export const UsingKeyboardSelection = {
+    render: SingleSelectKeyboardSelection.bind({}),
+    name: "Using the keyboard",
+    parameters: {
+        chromatic: {disableSnapshot: true},
+    },
+};
diff --git a/packages/wonder-blocks-clickable/src/components/__tests__/clickable-behavior.test.tsx b/packages/wonder-blocks-clickable/src/components/__tests__/clickable-behavior.test.tsx
index 774126f502..16e1fed0f8 100644
--- a/packages/wonder-blocks-clickable/src/components/__tests__/clickable-behavior.test.tsx
+++ b/packages/wonder-blocks-clickable/src/components/__tests__/clickable-behavior.test.tsx
@@ -4,17 +4,12 @@ import * as React from "react";
 import {render, screen, fireEvent, waitFor} from "@testing-library/react";
 import {MemoryRouter, Switch, Route} from "react-router-dom";
 import {userEvent} from "@testing-library/user-event";
+import {keys} from "@khanacademy/wonder-blocks-core";
 
 import getClickableBehavior from "../../util/get-clickable-behavior";
 import ClickableBehavior from "../clickable-behavior";
 import type {ClickableState} from "../clickable-behavior";
 
-const keyCodes = {
-    tab: 9,
-    enter: 13,
-    space: 32,
-} as const;
-
 const labelForState = (state: ClickableState): string => {
     const labels: Array<any> = [];
     if (state.hovered) {
@@ -195,8 +190,8 @@ describe("ClickableBehavior", () => {
         );
         const button = await screen.findByRole("button");
         expect(button).not.toHaveTextContent("focused");
-        fireEvent.keyDown(button, {keyCode: keyCodes.space});
-        fireEvent.keyUp(button, {keyCode: keyCodes.space});
+        fireEvent.keyDown(button, {key: keys.space});
+        fireEvent.keyUp(button, {key: keys.space});
         // NOTE(kevinb): await userEvent.click() fires other events that we don't want
         // affecting this test case.
         fireEvent.click(button);
@@ -219,8 +214,8 @@ describe("ClickableBehavior", () => {
         );
         const button = await screen.findByRole("button");
         expect(button).not.toHaveTextContent("focused");
-        fireEvent.keyDown(button, {keyCode: keyCodes.space});
-        fireEvent.keyUp(button, {keyCode: keyCodes.space});
+        await userEvent.tab();
+        await userEvent.keyboard(" ");
         // NOTE(kevinb): await userEvent.click() fires other events that we don't want
         // affecting this test case.
         fireEvent.click(button);
@@ -244,14 +239,14 @@ describe("ClickableBehavior", () => {
         );
         const button = await screen.findByRole("button");
         expect(button).not.toHaveTextContent("pressed");
-        fireEvent.keyDown(button, {keyCode: keyCodes.space});
+        fireEvent.keyDown(button, {key: keys.space});
         expect(button).toHaveTextContent("pressed");
-        fireEvent.keyUp(button, {keyCode: keyCodes.space});
+        fireEvent.keyUp(button, {key: keys.space});
         expect(button).not.toHaveTextContent("pressed");
 
-        fireEvent.keyDown(button, {keyCode: keyCodes.enter});
+        fireEvent.keyDown(button, {key: keys.enter});
         expect(button).toHaveTextContent("pressed");
-        fireEvent.keyUp(button, {keyCode: keyCodes.enter});
+        fireEvent.keyUp(button, {key: keys.enter});
         expect(button).not.toHaveTextContent("pressed");
     });
 
@@ -280,14 +275,14 @@ describe("ClickableBehavior", () => {
         );
         const link = await screen.findByRole("link");
         expect(link).not.toHaveTextContent("pressed");
-        fireEvent.keyDown(link, {keyCode: keyCodes.enter});
+        fireEvent.keyDown(link, {key: keys.enter});
         expect(link).toHaveTextContent("pressed");
-        fireEvent.keyUp(link, {keyCode: keyCodes.enter});
+        fireEvent.keyUp(link, {key: keys.enter});
         expect(link).not.toHaveTextContent("pressed");
 
-        fireEvent.keyDown(link, {keyCode: keyCodes.space});
+        fireEvent.keyDown(link, {key: keys.space});
         expect(link).not.toHaveTextContent("pressed");
-        fireEvent.keyUp(link, {keyCode: keyCodes.space});
+        fireEvent.keyUp(link, {key: keys.space});
         expect(link).not.toHaveTextContent("pressed");
     });
 
@@ -462,19 +457,19 @@ describe("ClickableBehavior", () => {
 
         expect(button).not.toHaveTextContent("focused");
         fireEvent.keyUp(button, {
-            keyCode: keyCodes.tab,
+            key: keys.tab,
         });
         expect(button).not.toHaveTextContent("focused");
-        fireEvent.keyDown(button, {keyCode: keyCodes.tab});
+        fireEvent.keyDown(button, {key: keys.tab});
         expect(button).not.toHaveTextContent("focused");
 
         expect(button).not.toHaveTextContent("pressed");
-        fireEvent.keyDown(button, {keyCode: keyCodes.space});
+        fireEvent.keyDown(button, {key: keys.space});
         expect(button).not.toHaveTextContent("pressed");
-        fireEvent.keyUp(button, {keyCode: keyCodes.space});
+        fireEvent.keyUp(button, {key: keys.space});
         expect(button).not.toHaveTextContent("pressed");
 
-        fireEvent.keyDown(button, {keyCode: keyCodes.space});
+        fireEvent.keyDown(button, {key: keys.space});
         fireEvent.blur(button);
         expect(button).not.toHaveTextContent("pressed");
 
@@ -501,9 +496,9 @@ describe("ClickableBehavior", () => {
 
         const anchor = await screen.findByRole("link");
         expect(anchor).not.toHaveTextContent("pressed");
-        fireEvent.keyDown(anchor, {keyCode: keyCodes.enter});
+        fireEvent.keyDown(anchor, {key: keys.enter});
         expect(anchor).not.toHaveTextContent("pressed");
-        fireEvent.keyUp(anchor, {keyCode: keyCodes.enter});
+        fireEvent.keyUp(anchor, {key: keys.enter});
         expect(anchor).not.toHaveTextContent("pressed");
     });
 
@@ -525,16 +520,16 @@ describe("ClickableBehavior", () => {
         await userEvent.click(button);
         expect(onClick).toHaveBeenCalledTimes(1);
 
-        fireEvent.keyDown(button, {keyCode: keyCodes.space});
-        fireEvent.keyUp(button, {keyCode: keyCodes.space});
+        fireEvent.keyDown(button, {key: keys.space});
+        fireEvent.keyUp(button, {key: keys.space});
         expect(onClick).toHaveBeenCalledTimes(2);
 
-        fireEvent.keyDown(button, {keyCode: keyCodes.enter});
-        fireEvent.keyUp(button, {keyCode: keyCodes.enter});
+        fireEvent.keyDown(button, {key: keys.enter});
+        fireEvent.keyUp(button, {key: keys.enter});
         expect(onClick).toHaveBeenCalledTimes(3);
 
-        fireEvent.touchStart(button, {keyCode: keyCodes.space});
-        fireEvent.touchEnd(button, {keyCode: keyCodes.space});
+        fireEvent.touchStart(button, {key: keys.space});
+        fireEvent.touchEnd(button, {key: keys.space});
         fireEvent.click(button);
         expect(onClick).toHaveBeenCalledTimes(4);
     });
@@ -600,21 +595,21 @@ describe("ClickableBehavior", () => {
             const link = await screen.findByRole("link");
 
             // Space press should not trigger the onClick
-            fireEvent.keyDown(link, {keyCode: keyCodes.space});
-            fireEvent.keyUp(link, {keyCode: keyCodes.space});
+            fireEvent.keyDown(link, {key: keys.space});
+            fireEvent.keyUp(link, {key: keys.space});
             expect(onClick).toHaveBeenCalledTimes(0);
 
             // Navigation didn't happen with space
             expect(window.location.assign).toHaveBeenCalledTimes(0);
 
             // Enter press should trigger the onClick after keyup
-            fireEvent.keyDown(link, {keyCode: keyCodes.enter});
+            fireEvent.keyDown(link, {key: keys.enter});
             expect(onClick).toHaveBeenCalledTimes(0);
 
             // Navigation doesn't happen until after enter is released
             expect(window.location.assign).toHaveBeenCalledTimes(0);
 
-            fireEvent.keyUp(link, {keyCode: keyCodes.enter});
+            fireEvent.keyUp(link, {key: keys.enter});
             expect(onClick).toHaveBeenCalledTimes(1);
 
             // Navigation happened after enter click
@@ -730,14 +725,14 @@ describe("ClickableBehavior", () => {
 
         // Enter press should not do anything
         const checkbox = await screen.findByRole("checkbox");
-        fireEvent.keyDown(checkbox, {keyCode: keyCodes.enter});
+        fireEvent.keyDown(checkbox, {key: keys.enter});
         expect(onClick).toHaveBeenCalledTimes(0);
-        fireEvent.keyUp(checkbox, {keyCode: keyCodes.enter});
+        fireEvent.keyUp(checkbox, {key: keys.enter});
         expect(onClick).toHaveBeenCalledTimes(0);
 
         // Space press should trigger the onClick
-        fireEvent.keyDown(checkbox, {keyCode: keyCodes.space});
-        fireEvent.keyUp(checkbox, {keyCode: keyCodes.space});
+        fireEvent.keyDown(checkbox, {key: keys.space});
+        fireEvent.keyUp(checkbox, {key: keys.space});
         expect(onClick).toHaveBeenCalledTimes(1);
     });
 
@@ -757,15 +752,15 @@ describe("ClickableBehavior", () => {
 
         // Enter press
         const button = await screen.findByRole("button");
-        fireEvent.keyDown(button, {keyCode: keyCodes.enter});
+        fireEvent.keyDown(button, {key: keys.enter});
         expect(onClick).toHaveBeenCalledTimes(0);
-        fireEvent.keyUp(button, {keyCode: keyCodes.enter});
+        fireEvent.keyUp(button, {key: keys.enter});
         expect(onClick).toHaveBeenCalledTimes(1);
 
         // Space press
-        fireEvent.keyDown(button, {keyCode: keyCodes.space});
+        fireEvent.keyDown(button, {key: keys.space});
         expect(onClick).toHaveBeenCalledTimes(1);
-        fireEvent.keyUp(button, {keyCode: keyCodes.space});
+        fireEvent.keyUp(button, {key: keys.space});
         expect(onClick).toHaveBeenCalledTimes(2);
     });
 
@@ -794,10 +789,10 @@ describe("ClickableBehavior", () => {
         }
 
         // Enter press on a div
-        fireEvent.keyDown(clickableDiv, {keyCode: keyCodes.enter});
+        fireEvent.keyDown(clickableDiv, {key: keys.enter});
         expect(onClick).toHaveBeenCalledTimes(expectedNumberTimesCalled);
         fireEvent.keyUp(clickableDiv, {
-            keyCode: keyCodes.enter,
+            key: keys.enter,
         });
         expectedNumberTimesCalled += 1;
         expect(onClick).toHaveBeenCalledTimes(expectedNumberTimesCalled);
@@ -808,9 +803,9 @@ describe("ClickableBehavior", () => {
         expect(onClick).toHaveBeenCalledTimes(expectedNumberTimesCalled);
 
         // Space press on a div
-        fireEvent.keyDown(clickableDiv, {keyCode: keyCodes.space});
+        fireEvent.keyDown(clickableDiv, {key: keys.space});
         expect(onClick).toHaveBeenCalledTimes(expectedNumberTimesCalled);
-        fireEvent.keyUp(clickableDiv, {keyCode: keyCodes.space});
+        fireEvent.keyUp(clickableDiv, {key: keys.space});
         expectedNumberTimesCalled += 1;
         expect(onClick).toHaveBeenCalledTimes(expectedNumberTimesCalled);
 
@@ -885,10 +880,10 @@ describe("ClickableBehavior", () => {
 
         const checkbox = await screen.findByRole("checkbox");
         // Enter press should not do anything
-        fireEvent.keyDown(checkbox, {keyCode: keyCodes.enter});
+        fireEvent.keyDown(checkbox, {key: keys.enter});
         // This element still wants to have a click on enter press
         fireEvent.click(checkbox);
-        fireEvent.keyUp(checkbox, {keyCode: keyCodes.enter});
+        fireEvent.keyUp(checkbox, {key: keys.enter});
         expect(onClick).toHaveBeenCalledTimes(0);
     });
 
diff --git a/packages/wonder-blocks-clickable/src/components/clickable-behavior.ts b/packages/wonder-blocks-clickable/src/components/clickable-behavior.ts
index da76b31338..aea9e7d5e3 100644
--- a/packages/wonder-blocks-clickable/src/components/clickable-behavior.ts
+++ b/packages/wonder-blocks-clickable/src/components/clickable-behavior.ts
@@ -1,4 +1,5 @@
 import * as React from "react";
+import {keys} from "@khanacademy/wonder-blocks-core";
 
 // NOTE: Potentially add to this as more cases come up.
 export type ClickableRole =
@@ -229,11 +230,6 @@ const disabledHandlers = {
     onKeyUp: () => void 0,
 } as const;
 
-const keyCodes = {
-    enter: 13,
-    space: 32,
-} as const;
-
 const startState: ClickableState = {
     hovered: false,
     focused: false,
@@ -560,13 +556,12 @@ export default class ClickableBehavior extends React.Component<
         if (onKeyDown) {
             onKeyDown(e);
         }
-
-        const keyCode = e.which || e.keyCode;
+        const keyName = e.key;
         const {triggerOnEnter, triggerOnSpace} =
             getAppropriateTriggersForRole(role);
         if (
-            (triggerOnEnter && keyCode === keyCodes.enter) ||
-            (triggerOnSpace && keyCode === keyCodes.space)
+            (triggerOnEnter && keyName === keys.enter) ||
+            (triggerOnSpace && keyName === keys.space)
         ) {
             // This prevents space from scrolling down. It also prevents the
             // space and enter keys from triggering click events. We manually
@@ -574,7 +569,7 @@ export default class ClickableBehavior extends React.Component<
             // handleKeyUp instead.
             e.preventDefault();
             this.setState({pressed: true});
-        } else if (!triggerOnEnter && keyCode === keyCodes.enter) {
+        } else if (!triggerOnEnter && keyName === keys.enter) {
             // If the component isn't supposed to trigger on enter, we have to
             // keep track of the enter keydown to negate the onClick callback
             this.enterClick = true;
@@ -587,17 +582,17 @@ export default class ClickableBehavior extends React.Component<
             onKeyUp(e);
         }
 
-        const keyCode = e.which || e.keyCode;
+        const keyName = e.key;
         const {triggerOnEnter, triggerOnSpace} =
             getAppropriateTriggersForRole(role);
         if (
-            (triggerOnEnter && keyCode === keyCodes.enter) ||
-            (triggerOnSpace && keyCode === keyCodes.space)
+            (triggerOnEnter && keyName === keys.enter) ||
+            (triggerOnSpace && keyName === keys.space)
         ) {
             this.setState({pressed: false, focused: true});
 
             this.runCallbackAndMaybeNavigate(e);
-        } else if (!triggerOnEnter && keyCode === keyCodes.enter) {
+        } else if (!triggerOnEnter && keyName === keys.enter) {
             this.enterClick = false;
         }
     };
diff --git a/packages/wonder-blocks-core/src/index.ts b/packages/wonder-blocks-core/src/index.ts
index be714657cb..758a117a7c 100644
--- a/packages/wonder-blocks-core/src/index.ts
+++ b/packages/wonder-blocks-core/src/index.ts
@@ -15,3 +15,4 @@ export {RenderStateRoot} from "./components/render-state-root";
 export {RenderState} from "./components/render-state-context";
 export type {AriaRole, AriaAttributes} from "./util/aria-types";
 export type {AriaProps, StyleType, PropsFor} from "./util/types";
+export {keys} from "./util/keys";
diff --git a/packages/wonder-blocks-core/src/util/keys.ts b/packages/wonder-blocks-core/src/util/keys.ts
new file mode 100644
index 0000000000..d953433cfe
--- /dev/null
+++ b/packages/wonder-blocks-core/src/util/keys.ts
@@ -0,0 +1,12 @@
+/**
+ * Key value mapping reference:
+ * https://developer.mozilla.org/en-US/docs/Web/API/UI_Events/Keyboard_event_key_values
+ */
+export const keys = {
+    enter: "Enter",
+    escape: "Escape",
+    tab: "Tab",
+    space: " ",
+    up: "ArrowUp",
+    down: "ArrowDown",
+} as const;
diff --git a/packages/wonder-blocks-dropdown/src/components/__tests__/action-menu.test.tsx b/packages/wonder-blocks-dropdown/src/components/__tests__/action-menu.test.tsx
index 61388ddaa0..cdbc18bd88 100644
--- a/packages/wonder-blocks-dropdown/src/components/__tests__/action-menu.test.tsx
+++ b/packages/wonder-blocks-dropdown/src/components/__tests__/action-menu.test.tsx
@@ -38,9 +38,7 @@ describe("ActionMenu", () => {
         ).toBeInTheDocument();
     });
 
-    // TODO(FEI-5533): Key press events aren't working correctly with
-    // user-event v14. We need to investigate and fix this.
-    it.skip("opens the menu on enter", async () => {
+    it("opens the menu on enter", async () => {
         // Arrange
         render(
             <ActionMenu
@@ -57,7 +55,7 @@ describe("ActionMenu", () => {
 
         // Act
         await userEvent.tab();
-        await userEvent.keyboard("{enter}");
+        await userEvent.keyboard("{Enter}");
 
         // Assert
         expect(
@@ -65,9 +63,7 @@ describe("ActionMenu", () => {
         ).toBeInTheDocument();
     });
 
-    // TODO(FEI-5533): Key press events aren't working correctly with
-    // user-event v14. We need to investigate and fix this.
-    it.skip("closes itself on escape", async () => {
+    it("closes itself on escape", async () => {
         // Arrange
         render(
             <ActionMenu
@@ -83,18 +79,16 @@ describe("ActionMenu", () => {
         );
 
         await userEvent.tab();
-        await userEvent.keyboard("{enter}");
+        await userEvent.keyboard("{Enter}");
 
         // Act
-        await userEvent.keyboard("{escape}");
+        await userEvent.keyboard("{Escape}");
 
         // Assert
         expect(screen.queryByRole("menu")).not.toBeInTheDocument();
     });
 
-    // TODO(FEI-5533): Key press events aren't working correctly with
-    // user-event v14. We need to investigate and fix this.
-    it.skip("closes itself on tab", async () => {
+    it("closes itself on tab", async () => {
         // Arrange
         render(
             <ActionMenu
@@ -110,7 +104,7 @@ describe("ActionMenu", () => {
         );
 
         await userEvent.tab();
-        await userEvent.keyboard("{enter}");
+        await userEvent.keyboard("{Enter}");
 
         // Act
         await userEvent.tab();
diff --git a/packages/wonder-blocks-dropdown/src/components/__tests__/combobox.test.tsx b/packages/wonder-blocks-dropdown/src/components/__tests__/combobox.test.tsx
index cb33014611..2c8e207f95 100644
--- a/packages/wonder-blocks-dropdown/src/components/__tests__/combobox.test.tsx
+++ b/packages/wonder-blocks-dropdown/src/components/__tests__/combobox.test.tsx
@@ -280,7 +280,7 @@ describe("Combobox", () => {
         await userEvent.type(screen.getByRole("combobox"), "3");
 
         // Act
-        await userEvent.keyboard("{enter}");
+        await userEvent.keyboard("{Enter}");
 
         // Assert
         expect(screen.getByRole("combobox")).toHaveValue("option 3");
diff --git a/packages/wonder-blocks-dropdown/src/components/__tests__/dropdown-core.test.tsx b/packages/wonder-blocks-dropdown/src/components/__tests__/dropdown-core.test.tsx
index 3f247da6fb..e54972b673 100644
--- a/packages/wonder-blocks-dropdown/src/components/__tests__/dropdown-core.test.tsx
+++ b/packages/wonder-blocks-dropdown/src/components/__tests__/dropdown-core.test.tsx
@@ -73,9 +73,7 @@ describe("DropdownCore", () => {
         expect(item).toHaveFocus();
     });
 
-    // TODO(FEI-5533): Key press events aren't working correctly with
-    // user-event v14. We need to investigate and fix this.
-    it.skip("handles basic keyboard navigation as expected", async () => {
+    it("handles basic keyboard navigation as expected", async () => {
         // Arrange
         const dummyOpener = <button />;
         const openChanged = jest.fn();
@@ -95,8 +93,8 @@ describe("DropdownCore", () => {
 
         // Act
         // navigate down two times
-        await userEvent.keyboard("{arrowdown}"); // 0 -> 1
-        await userEvent.keyboard("{arrowdown}"); // 1 -> 2
+        await userEvent.keyboard("{ArrowDown}"); // 0 -> 1
+        await userEvent.keyboard("{ArrowDown}"); // 1 -> 2
 
         // Assert
         expect(
@@ -104,9 +102,7 @@ describe("DropdownCore", () => {
         ).toHaveFocus();
     });
 
-    // TODO(FEI-5533): Key press events aren't working correctly with
-    // user-event v14. We need to investigate and fix this.
-    it.skip("keyboard works backwards as expected", async () => {
+    it("keyboard works backwards as expected", async () => {
         // Arrange
         render(
             <DropdownCore
@@ -124,13 +120,13 @@ describe("DropdownCore", () => {
 
         // Act
         // navigate down tree times
-        await userEvent.keyboard("{arrowdown}"); // 0 -> 1
-        await userEvent.keyboard("{arrowdown}"); // 1 -> 2
-        await userEvent.keyboard("{arrowdown}"); // 2 -> 0
+        await userEvent.keyboard("{ArrowDown}"); // 0 -> 1
+        await userEvent.keyboard("{ArrowDown}"); // 1 -> 2
+        await userEvent.keyboard("{ArrowDown}"); // 2 -> 0
 
         // navigate up back two times
-        await userEvent.keyboard("{arrowup}"); // 0 -> 2
-        await userEvent.keyboard("{arrowup}"); // 2 -> 1
+        await userEvent.keyboard("{ArrowUp}"); // 0 -> 2
+        await userEvent.keyboard("{ArrowUp}"); // 2 -> 1
 
         // Assert
         expect(
@@ -138,9 +134,7 @@ describe("DropdownCore", () => {
         ).toHaveFocus();
     });
 
-    // TODO(FEI-5533): Key press events aren't working correctly with
-    // user-event v14. We need to investigate and fix this.
-    it.skip("keyboard works backwards with the search field included", async () => {
+    it("keyboard works backwards with the search field included", async () => {
         // Arrange
         render(
             <DropdownCore
@@ -160,15 +154,15 @@ describe("DropdownCore", () => {
 
         // Act
         // navigate down four times
-        await userEvent.keyboard("{arrowdown}"); // 0 -> 1
-        await userEvent.keyboard("{arrowdown}"); // 1 -> 2
-        await userEvent.keyboard("{arrowdown}"); // 2 -> search field
-        await userEvent.keyboard("{arrowdown}"); // search field -> 0
+        await userEvent.keyboard("{ArrowDown}"); // 0 -> 1
+        await userEvent.keyboard("{ArrowDown}"); // 1 -> 2
+        await userEvent.keyboard("{ArrowDown}"); // 2 -> search field
+        await userEvent.keyboard("{ArrowDown}"); // search field -> 0
 
         // navigate up back three times
-        await userEvent.keyboard("{arrowup}"); // 0 -> search field
-        await userEvent.keyboard("{arrowup}"); // search field -> 2
-        await userEvent.keyboard("{arrowup}"); // 2 -> 1
+        await userEvent.keyboard("{ArrowUp}"); // 0 -> search field
+        await userEvent.keyboard("{ArrowUp}"); // search field -> 2
+        await userEvent.keyboard("{ArrowUp}"); // 2 -> 1
 
         // Assert
         expect(
@@ -179,7 +173,7 @@ describe("DropdownCore", () => {
     // NOTE(john): This fails after upgrading to user-event v14, it's not clear
     // what's wrong exactly, but tabbing no longer triggers the change, which
     // makes me think that the initial focus is different now.
-    it.skip("closes on tab as expected", async () => {
+    it("closes on tab as expected", async () => {
         // Arrange
         const handleOpenChangedMock = jest.fn();
 
@@ -204,9 +198,7 @@ describe("DropdownCore", () => {
         expect(handleOpenChangedMock).toHaveBeenNthCalledWith(1, false);
     });
 
-    // TODO(FEI-5533): Key press events aren't working correctly with
-    // user-event v14. We need to investigate and fix this.
-    it.skip("closes on escape as expected", async () => {
+    it("closes on escape as expected", async () => {
         // Arrange
         const handleOpenChangedMock = jest.fn();
 
@@ -225,7 +217,7 @@ describe("DropdownCore", () => {
 
         // Act
         // close the dropdown by pressing "Escape"
-        await userEvent.keyboard("{escape}");
+        await userEvent.keyboard("{Escape}");
 
         // Assert
         expect(handleOpenChangedMock).toHaveBeenNthCalledWith(1, false);
@@ -284,9 +276,7 @@ describe("DropdownCore", () => {
         expect(handleOpenChangedMock).toHaveBeenCalledTimes(0);
     });
 
-    // TODO(FEI-5533): Key press events aren't working correctly with
-    // user-event v14. We need to investigate and fix this.
-    it.skip("opens on down key as expected", async () => {
+    it("opens on down key as expected", async () => {
         // Arrange
         const handleOpenChangedMock = jest.fn();
         const opener = <button data-testid="opener" />;
@@ -308,7 +298,7 @@ describe("DropdownCore", () => {
         openerElement.focus();
 
         // Act
-        await userEvent.keyboard("{arrowdown}");
+        await userEvent.keyboard("{ArrowDown}");
 
         // Assert
         expect(handleOpenChangedMock).toHaveBeenNthCalledWith(1, true);
@@ -374,9 +364,7 @@ describe("DropdownCore", () => {
         expect(firstItem).toHaveFocus();
     });
 
-    // TODO(FEI-5533): Key press events aren't working correctly with
-    // user-event v14. We need to investigate and fix this.
-    it.skip("selects correct item when starting off at a different index", async () => {
+    it("selects correct item when starting off at a different index", async () => {
         // Arrange
         render(
             <DropdownCore
@@ -393,7 +381,7 @@ describe("DropdownCore", () => {
 
         // Act
         // navigate down
-        await userEvent.keyboard("{arrowdown}"); // 2 -> 0
+        await userEvent.keyboard("{ArrowDown}"); // 2 -> 0
 
         // Assert
         expect(
@@ -401,9 +389,7 @@ describe("DropdownCore", () => {
         ).toHaveFocus();
     });
 
-    // TODO(FEI-5533): Key press events aren't working correctly with
-    // user-event v14. We need to investigate and fix this.
-    it.skip("focuses correct item with clicking/pressing with initial focused of not 0", async () => {
+    it("focuses correct item with clicking/pressing with initial focused of not 0", async () => {
         // Arrange
         render(
             <DropdownCore
@@ -423,7 +409,7 @@ describe("DropdownCore", () => {
             await screen.findByRole("option", {name: "item 1"}),
         );
         // navigate down
-        await userEvent.keyboard("{arrowdown}"); // 1 -> 2
+        await userEvent.keyboard("{ArrowDown}"); // 1 -> 2
 
         // Assert
         expect(
@@ -431,9 +417,7 @@ describe("DropdownCore", () => {
         ).toHaveFocus();
     });
 
-    // TODO(FEI-5533): Key press events aren't working correctly with
-    // user-event v14. We need to investigate and fix this.
-    it.skip("focuses correct item with a disabled item", async () => {
+    it("focuses correct item with a disabled item", async () => {
         // Arrange
         render(
             <DropdownCore
@@ -477,7 +461,7 @@ describe("DropdownCore", () => {
 
         // Act
         // navigate down
-        await userEvent.keyboard("{arrowdown}"); // 0 -> 2 (1 is disabled)
+        await userEvent.keyboard("{ArrowDown}"); // 0 -> 2 (1 is disabled)
 
         // Assert
         expect(
diff --git a/packages/wonder-blocks-dropdown/src/components/__tests__/multi-select.test.tsx b/packages/wonder-blocks-dropdown/src/components/__tests__/multi-select.test.tsx
index 3bf0ad1e35..eda4bdf7b4 100644
--- a/packages/wonder-blocks-dropdown/src/components/__tests__/multi-select.test.tsx
+++ b/packages/wonder-blocks-dropdown/src/components/__tests__/multi-select.test.tsx
@@ -85,17 +85,15 @@ describe("MultiSelect", () => {
             ).toBeInTheDocument();
         });
 
-        // TODO(FEI-5533): Key press events aren't working correctly with
-        // user-event v14. We need to investigate and fix this.
-        it.skip("closes the select on {escape}", async () => {
+        it("closes the select on {Escape}", async () => {
             // Arrange
             const {userEvent} = doRender(uncontrolledMultiSelect);
 
             await userEvent.tab();
-            await userEvent.keyboard("{enter}"); // open
+            await userEvent.keyboard("{Enter}"); // open
 
             // Act
-            await userEvent.keyboard("{escape}");
+            await userEvent.keyboard("{Escape}");
 
             // Assert
             expect(onChange).not.toHaveBeenCalled();
@@ -432,7 +430,7 @@ describe("MultiSelect", () => {
             ).not.toBeInTheDocument();
         });
 
-        // NOTE(john): After upgrading to user-event v14 this test is failing.
+        // NOTE(john) FEI-5533: After upgrading to user-event v14 this test is failing.
         // We are unale to find the option with the specified text, even though
         // it exists in the document.
         it.skip("selects on item as expected", async () => {
@@ -790,7 +788,7 @@ describe("MultiSelect", () => {
             expect(options[0]).toHaveTextContent("item 1");
         });
 
-        // NOTE(john): This isn't working after upgrading to user-event v14,
+        // NOTE(john) FEI-5533: This isn't working after upgrading to user-event v14,
         // the focus is moving to the body instead of the Clear search button.
         it.skip("should move focus to the dismiss button after pressing {tab} on the text input", async () => {
             // Arrange
@@ -893,7 +891,7 @@ describe("MultiSelect", () => {
             expect(filteredOption).toBeInTheDocument();
         });
 
-        // NOTE(john): After upgrading to user-event v14, this test is failing.
+        // NOTE(john) FEI-5533: After upgrading to user-event v14, this test is failing.
         // The Venus option is still in the document.
         it.skip("should filter out an option if it's not part of the results", async () => {
             // Arrange
@@ -1537,9 +1535,7 @@ describe("MultiSelect", () => {
             expect(container).toHaveTextContent("3 schools");
         });
 
-        // NOTE(john): This fails after upgrading to user-event v14. The text
-        // output is now: "2 planets0 items".
-        it.skip("should change the number of options after using the search filter", async () => {
+        it("should change the number of options after using the search filter", async () => {
             // Arrange
             const labels: Labels = {
                 ...builtinLabels,
@@ -2809,10 +2805,10 @@ describe("MultiSelect", () => {
                         />,
                     );
                     await userEvent.tab();
-                    await userEvent.keyboard("{enter}"); // Open the dropdown
+                    await userEvent.keyboard("{Enter}"); // Open the dropdown
 
                     // Act
-                    await userEvent.keyboard("{escape}"); // Close the dropdown
+                    await userEvent.keyboard("{Escape}"); // Close the dropdown
 
                     // Assert
                     expect(onValidate).toHaveBeenCalledExactlyOnceWith(
@@ -2827,10 +2823,10 @@ describe("MultiSelect", () => {
                         <ControlledMultiSelect required={requiredMessage} />,
                     );
                     await userEvent.tab();
-                    await userEvent.keyboard("{enter}"); // Open the dropdown
+                    await userEvent.keyboard("{Enter}"); // Open the dropdown
 
                     // Act
-                    await userEvent.keyboard("{escape}"); // Close the dropdown
+                    await userEvent.keyboard("{Escape}"); // Close the dropdown
 
                     // Assert
                     expect(await screen.findByRole("button")).toHaveAttribute(
diff --git a/packages/wonder-blocks-dropdown/src/components/__tests__/select-opener.test.tsx b/packages/wonder-blocks-dropdown/src/components/__tests__/select-opener.test.tsx
index 5bfeb047a6..1267bdf06a 100644
--- a/packages/wonder-blocks-dropdown/src/components/__tests__/select-opener.test.tsx
+++ b/packages/wonder-blocks-dropdown/src/components/__tests__/select-opener.test.tsx
@@ -1,6 +1,7 @@
 import * as React from "react";
 import {fireEvent, render, screen} from "@testing-library/react";
 import {userEvent} from "@testing-library/user-event";
+import {keys} from "@khanacademy/wonder-blocks-core";
 
 import SelectOpener from "../select-opener";
 
@@ -57,11 +58,11 @@ describe("SelectOpener", () => {
             // the default behavior of the button.
             // eslint-disable-next-line testing-library/prefer-user-event
             fireEvent.keyDown(button, {
-                key: " ",
+                key: keys.space,
             });
             // eslint-disable-next-line testing-library/prefer-user-event
             fireEvent.keyUp(button, {
-                key: " ",
+                key: keys.space,
             });
 
             // Assert
diff --git a/packages/wonder-blocks-dropdown/src/components/__tests__/single-select.test.tsx b/packages/wonder-blocks-dropdown/src/components/__tests__/single-select.test.tsx
index a622a3202f..10db7ff449 100644
--- a/packages/wonder-blocks-dropdown/src/components/__tests__/single-select.test.tsx
+++ b/packages/wonder-blocks-dropdown/src/components/__tests__/single-select.test.tsx
@@ -1,6 +1,12 @@
 /* eslint-disable max-lines */
 import * as React from "react";
-import {fireEvent, render, screen, within} from "@testing-library/react";
+import {
+    fireEvent,
+    render,
+    screen,
+    within,
+    waitFor,
+} from "@testing-library/react";
 import {
     userEvent as ue,
     PointerEventsCheckLevel,
@@ -21,6 +27,19 @@ const doRender = (element: React.ReactElement) => {
     };
 };
 
+jest.mock("react-popper", () => ({
+    ...jest.requireActual("react-popper"),
+    Popper: jest.fn().mockImplementation(({children}) => {
+        // Mock `isReferenceHidden` to always return false (or true for testing visibility)
+        return children({
+            ref: jest.fn(),
+            style: {},
+            placement: "bottom",
+            isReferenceHidden: false, // Mocking isReferenceHidden
+        });
+    }),
+}));
+
 describe("SingleSelect", () => {
     const onChange = jest.fn();
 
@@ -268,9 +287,7 @@ describe("SingleSelect", () => {
                 jest.useFakeTimers();
             });
 
-            // TODO(FEI-5533): Key press events aren't working correctly with
-            // user-event v14. We need to investigate and fix this.
-            describe.skip.each([{key: "{enter}"}, {key: "{space}"}])(
+            describe.each([{key: "{Enter}"}, {key: " "}])(
                 "$key",
                 ({key}: any) => {
                     it("should open when pressing the key when the default opener is focused", async () => {
@@ -282,9 +299,8 @@ describe("SingleSelect", () => {
                         await userEvent.keyboard(key);
 
                         // Assert
-                        expect(
-                            await screen.findByRole("listbox"),
-                        ).toBeInTheDocument();
+                        const listbox = await screen.findByRole("listbox");
+                        expect(listbox).toBeInTheDocument();
                     });
 
                     it("should focus the first item in the dropdown", async () => {
@@ -304,40 +320,83 @@ describe("SingleSelect", () => {
                 },
             );
 
-            // TODO(FEI-5533): Key press events aren't working correctly with
-            // user-event v14. We need to investigate and fix this.
-            it.skip("should select an item when pressing {enter}", async () => {
+            it("should focus on the first option when pressing {Enter} on the opener", async () => {
+                // Arrange
+                const {userEvent} = doRender(uncontrolledSingleSelect);
+                await userEvent.tab();
+
+                // Act
+                await userEvent.keyboard("{Enter}"); // open
+
+                // Ensure first option is focused, not the opener
+                const firstItem = await screen.findByRole("option", {
+                    name: /item 1/,
+                });
+                // Assert
+                expect(firstItem).toHaveFocus();
+            });
+
+            it("should select an item when pressing {Enter}", async () => {
                 // Arrange
                 const {userEvent} = doRender(uncontrolledSingleSelect);
                 await userEvent.tab();
-                await userEvent.keyboard("{enter}"); // open
+                await userEvent.keyboard("{Enter}"); // open
 
                 // Act
-                await userEvent.keyboard("{enter}");
+                await userEvent.keyboard("{Enter}");
 
                 // Assert
                 expect(onChange).toHaveBeenCalledWith("1");
-                expect(screen.queryByRole("listbox")).not.toBeInTheDocument();
+
+                await waitFor(() =>
+                    expect(
+                        screen.queryByRole("listbox"),
+                    ).not.toBeInTheDocument(),
+                );
             });
 
-            // TODO(FEI-5533): Key press events aren't working correctly with
-            // user-event v14. We need to investigate and fix this.
-            it.skip("should select an item when pressing {space}", async () => {
+            it("should focus on the first option when pressing {Space} on the opener", async () => {
                 // Arrange
                 const {userEvent} = doRender(uncontrolledSingleSelect);
                 await userEvent.tab();
-                await userEvent.keyboard("{enter}"); // open
 
                 // Act
-                await userEvent.keyboard("{space}");
+                await userEvent.keyboard(" "); // open
+
+                // Ensure first option is focused, not the opener
+                const firstItem = await screen.findByRole("option", {
+                    name: /item 1/,
+                });
+
+                // Assert
+                expect(firstItem).toHaveFocus();
+            });
+
+            it("should select an item when pressing {Space}", async () => {
+                // Arrange
+                const {userEvent} = doRender(uncontrolledSingleSelect);
+                await userEvent.tab();
+                await userEvent.keyboard("{Enter}"); // open
+
+                const firstItem = await screen.findByRole("option", {
+                    name: /item 1/,
+                });
+                expect(firstItem).toHaveFocus();
+
+                // Act
+                await userEvent.keyboard(" ");
 
                 // Assert
                 expect(onChange).toHaveBeenCalledWith("1");
-                expect(screen.queryByRole("listbox")).not.toBeInTheDocument();
+                await waitFor(() => {
+                    expect(
+                        screen.queryByRole("listbox"),
+                    ).not.toBeInTheDocument();
+                });
             });
 
             /*
-            The keyboard events (I tried .keyboard and .type) are not working as
+            TODO (FEI-5533): The keyboard events (I tried .keyboard and .type) are not working as
             needed. From what I can tell, they are going to the wrong element or
             otherwise not getting handled as they would in a non-test world.
             We had this issue with elsewhere too and haven't resolved it (since
@@ -392,14 +451,14 @@ describe("SingleSelect", () => {
                 expect(onChange).not.toHaveBeenCalled();
             });
 
-            it("should dismiss the dropdown when pressing {escape}", async () => {
+            it("should dismiss the dropdown when pressing {Escape}", async () => {
                 // Arrange
                 const {userEvent} = doRender(uncontrolledSingleSelect);
                 await userEvent.tab();
-                await userEvent.keyboard("{enter}"); // open
+                await userEvent.keyboard("{Enter}"); // open
 
                 // Act
-                await userEvent.keyboard("{escape}");
+                await userEvent.keyboard("{Escape}");
 
                 // Assert
                 expect(onChange).not.toHaveBeenCalled();
@@ -805,10 +864,7 @@ describe("SingleSelect", () => {
             expect(searchInput.textContent).toEqual("");
         });
 
-        // NOTE(john): This is no longer working after upgrading to user-events v14
-        // The .tab() call just moves focus to the body, rather than the Clear
-        // search (which does exist in the page).
-        it.skip("should move focus to the dismiss button after pressing {tab} on the text input", async () => {
+        it("should move focus to the dismiss button after pressing {tab} on the text input", async () => {
             // Arrange
             const {userEvent} = doRender(
                 <SingleSelect
@@ -976,7 +1032,9 @@ describe("SingleSelect", () => {
     });
 
     describe("a11y > Live region", () => {
-        it("should change the number of options after using the search filter", async () => {
+        // TODO (WB-1757.2): Enable this test once the LiveRegion component
+        // is refactored.
+        it.skip("should change the number of options after using the search filter", async () => {
             // Arrange
             const {userEvent} = doRender(
                 <SingleSelect
@@ -2241,8 +2299,8 @@ describe("SingleSelect", () => {
 
                     // Act
                     await userEvent.tab();
-                    await userEvent.keyboard("{enter}"); // Open the dropdown
-                    await userEvent.keyboard("{escape}"); // Close the dropdown
+                    await userEvent.keyboard("{Enter}"); // Open the dropdown
+                    await userEvent.keyboard("{Escape}"); // Close the dropdown
 
                     // Assert
                     expect(onValidate).toHaveBeenCalledExactlyOnceWith(
@@ -2259,8 +2317,8 @@ describe("SingleSelect", () => {
 
                     // Act
                     await userEvent.tab();
-                    await userEvent.keyboard("{enter}"); // Open the dropdown
-                    await userEvent.keyboard("{escape}"); // Close the dropdown
+                    await userEvent.keyboard("{Enter}"); // Open the dropdown
+                    await userEvent.keyboard("{Escape}"); // Close the dropdown
 
                     // Assert
                     expect(await screen.findByRole("button")).toHaveAttribute(
diff --git a/packages/wonder-blocks-dropdown/src/components/dropdown-core.tsx b/packages/wonder-blocks-dropdown/src/components/dropdown-core.tsx
index e61e7021fb..aef5b65e80 100644
--- a/packages/wonder-blocks-dropdown/src/components/dropdown-core.tsx
+++ b/packages/wonder-blocks-dropdown/src/components/dropdown-core.tsx
@@ -9,7 +9,7 @@ import {VariableSizeList as List} from "react-window";
 
 import {fade, color, spacing} from "@khanacademy/wonder-blocks-tokens";
 
-import {addStyle, PropsFor, View} from "@khanacademy/wonder-blocks-core";
+import {addStyle, PropsFor, View, keys} from "@khanacademy/wonder-blocks-core";
 import SearchField from "@khanacademy/wonder-blocks-search-field";
 import {LabelMedium} from "@khanacademy/wonder-blocks-typography";
 import {withActionScheduler} from "@khanacademy/wonder-blocks-timing";
@@ -18,7 +18,7 @@ import type {AriaProps, StyleType} from "@khanacademy/wonder-blocks-core";
 import type {WithActionSchedulerProps} from "@khanacademy/wonder-blocks-timing";
 import DropdownCoreVirtualized from "./dropdown-core-virtualized";
 import SeparatorItem from "./separator-item";
-import {defaultLabels, keys} from "../util/constants";
+import {defaultLabels} from "../util/constants";
 import type {DropdownItem} from "../util/types";
 import DropdownPopper from "./dropdown-popper";
 import {debounce, getLabel, getStringForKey} from "../util/helpers";
diff --git a/packages/wonder-blocks-dropdown/src/components/option-item.tsx b/packages/wonder-blocks-dropdown/src/components/option-item.tsx
index c85070ed0b..0d60e5d97b 100644
--- a/packages/wonder-blocks-dropdown/src/components/option-item.tsx
+++ b/packages/wonder-blocks-dropdown/src/components/option-item.tsx
@@ -269,6 +269,7 @@ export default class OptionItem extends React.Component<OptionProps> {
     render(): React.ReactNode {
         const {disabled, focused, parentComponent, role, selected} = this.props;
 
+        // Only used for Combobox component, not SingleSelect/MultiSelect
         if (parentComponent === "listbox") {
             return (
                 <StyledListItem
diff --git a/packages/wonder-blocks-dropdown/src/components/select-opener.tsx b/packages/wonder-blocks-dropdown/src/components/select-opener.tsx
index 5f9e58bb4d..ac49b35e76 100644
--- a/packages/wonder-blocks-dropdown/src/components/select-opener.tsx
+++ b/packages/wonder-blocks-dropdown/src/components/select-opener.tsx
@@ -1,7 +1,7 @@
 import * as React from "react";
 import {StyleSheet} from "aphrodite";
 
-import type {AriaProps} from "@khanacademy/wonder-blocks-core";
+import {keys, type AriaProps} from "@khanacademy/wonder-blocks-core";
 
 import {mix} from "@khanacademy/wonder-blocks-tokens";
 import {addStyle} from "@khanacademy/wonder-blocks-core";
@@ -107,21 +107,21 @@ export default class SelectOpener extends React.Component<
     };
 
     handleKeyDown: (e: React.KeyboardEvent) => void = (e) => {
-        const keyCode = e.key;
+        const keyName = e.key;
         // Prevent default behavior for Enter key. Without this, the select
         // is only open while the Enter key is pressed.
         // Prevent default behavior for Space key. Without this, Safari stays in
         // active state visually
-        if (keyCode === "Enter" || keyCode === " ") {
+        if (keyName === keys.enter || keyName === keys.space) {
             this.setState({pressed: true});
             e.preventDefault();
         }
     };
 
     handleKeyUp: (e: React.KeyboardEvent) => void = (e) => {
-        const keyCode = e.key;
+        const keyName = e.key;
         // On key up for Enter and Space, trigger the click handler
-        if (keyCode === "Enter" || keyCode === " ") {
+        if (keyName === keys.enter || keyName === keys.space) {
             this.setState({pressed: false});
             this.handleClick(e);
         }
diff --git a/packages/wonder-blocks-dropdown/src/util/constants.ts b/packages/wonder-blocks-dropdown/src/util/constants.ts
index 72a3be9ff7..4f6d9b2017 100644
--- a/packages/wonder-blocks-dropdown/src/util/constants.ts
+++ b/packages/wonder-blocks-dropdown/src/util/constants.ts
@@ -1,18 +1,6 @@
 import {spacing} from "@khanacademy/wonder-blocks-tokens";
 import {ComboboxLabels} from "./types";
 
-/**
- * Key value mapping reference:
- * https://developer.mozilla.org/en-US/docs/Web/API/UI_Events/Keyboard_event_key_values
- */
-export const keys = {
-    escape: "Escape",
-    tab: "Tab",
-    space: " ",
-    up: "ArrowUp",
-    down: "ArrowDown",
-} as const;
-
 export const selectDropdownStyle = {
     marginTop: spacing.xSmall_8,
     marginBottom: spacing.xSmall_8,