diff --git a/static/js/dropdown_list_widget.js b/static/js/dropdown_list_widget.js
index fe4ec6736f..12d335e547 100644
--- a/static/js/dropdown_list_widget.js
+++ b/static/js/dropdown_list_widget.js
@@ -64,7 +64,7 @@ export const DropdownListWidget = function ({
             function (e) {
                 const setting_elem = $(this).closest(`.${CSS.escape(widget_name)}_setting`);
                 if (e.type === "keypress") {
-                    if (e.which === 13) {
+                    if (e.key === "Enter") {
                         setting_elem.find(".dropdown-menu").dropdown("toggle");
                     } else {
                         return;
@@ -129,15 +129,17 @@ export const DropdownListWidget = function ({
         });
 
         search_input.on("keydown", (e) => {
-            if (!/(38|40|27)/.test(e.keyCode)) {
+            const {key, keyCode, which} = e;
+            if (!/(ArrowUp|ArrowDown|Escape)/.test(key)) {
                 return;
             }
             e.preventDefault();
             e.stopPropagation();
-            const custom_event = new $.Event("keydown.dropdown.data-api", {
-                keyCode: e.keyCode,
-                which: e.keyCode,
-            });
+
+            // We pass keyCode instead of key here because the outdated
+            // bootstrap library we have at static/third/ still uses the
+            // deprecated keyCode & which properties.
+            const custom_event = new $.Event("keydown.dropdown.data-api", {keyCode, which});
             dropdown_toggle.trigger(custom_event);
         });