KeyboardEvent.keyCode está en desuso. ¿Qué significa esto en la práctica?

Según MDN, definitivamente no deberíamos utilizar la .keyCodepropiedad. Está en desuso:

https://developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent/keyCode

En la escuela W3, este hecho se minimiza y solo hay una nota al margen que dice que .keyCodese proporciona solo por compatibilidad y que la última versión de la Especificación de eventos DOM recomienda usar la .keypropiedad en su lugar.

El problema es que .keyno es compatible con los navegadores, entonces, ¿qué deberíamos usar? ¿Se me escapa algo?

Feb 15 '16 00:02 Jason210

Tienes tres formas de manejarlo, como está escrito en el enlace que compartiste.

if (event.key !== undefined) {

} else if (event.keyIdentifier !== undefined) {

} else if (event.keyCode !== undefined) {

}

deberías contemplarlos, esa es la forma correcta si deseas compatibilidad con varios navegadores.

Podría ser más fácil si implementas algo como esto.

var dispatchForCode = function(event, callback) {
  var code;

  if (event.key !== undefined) {
    code = event.key;
  } else if (event.keyIdentifier !== undefined) {
    code = event.keyIdentifier;
  } else if (event.keyCode !== undefined) {
    code = event.keyCode;
  }

  callback(code);
};

Feb 14 '2016 17:02 Miguel Lattuada

TLDR: Le sugiero que utilice las propiedades nuevas event.keyy event.codeen lugar de las heredadas. IE y Edge admiten estas propiedades, pero aún no admiten los nuevos nombres de clave. Para ellos, hay un pequeño polyfill que les permite generar los nombres de clave/código estándar:

https://github.com/shvaikalesh/shim-keyboard-event-key

Llegué a esta pregunta buscando el motivo de la misma advertencia de MDN que OP. Después de buscar un poco más, el problema keyCodese vuelve más claro:

El problema con el uso keyCodees que los teclados que no están en inglés pueden producir resultados diferentes e incluso los teclados con diseños diferentes pueden producir resultados inconsistentes. Además, se dio el caso de

Si lee las especificaciones del W3C: https://www.w3.org/TR/uievents/#interface-keyboardevent

En la práctica, keyCode y charCode son inconsistentes en todas las plataformas e incluso en la misma implementación en diferentes sistemas operativos o en diferentes localizaciones.

Profundiza en la descripción del problema keyCode: https://www.w3.org/TR/uievents/#legacy-key-attributes

Estas características nunca se especificaron formalmente y las implementaciones actuales del navegador varían de manera significativa. La gran cantidad de contenido heredado, incluidas las bibliotecas de scripts, que depende de la detección del agente de usuario y de actuar en consecuencia significa que cualquier intento de formalizar estos atributos y eventos heredados correría el riesgo de romper tanto contenido como el que arreglaría o habilitaría. Además, estos atributos no son adecuados para el uso internacional ni abordan problemas de accesibilidad.

Entonces, después de establecer el motivo por el cual se reemplazó el código clave heredado, veamos lo que debe hacer hoy:

1. Todos los navegadores modernos admiten las nuevas propiedades ( keyy code).
2. IE y Edge admiten una versión anterior de la especificación, que tiene nombres diferentes para algunas claves. Puedes usar una cuña para ello: https://github.com/shvaikalesh/shim-keyboard-event-key (o enrolla la tuya propia; de todos modos, es bastante pequeña)
3. Edge solucionó este error en la última versión (probablemente se lanzará en abril de 2018): https://developer.microsoft.com/en-us/microsoft-edge/platform/issues/8860571/
4. Consulte la lista de claves de eventos que puede utilizar: https://www.w3.org/TR/uievents-key/

Apr 18 '2018 15:04 kumarharsh