In the code snippet below, we are checking whether the user is interacting with an input field, textarea, or contenteditable element. If any of these conditions are met, we should clear out the keys array and stop the script execution.
let keys: any[] = []
document.addEventListener('keypress', event => {
if (event.key === ' ') return
if (event.target === null) return // Should remove this?
if (event.target.nodeName === 'INPUT' ||
event.target.nodeName === 'TEXTAREA' ||
event.target.isContentEditable) {
keys = []
return
}
})
console.log(keys)
An error message related to TypeScript syntax pops up:
Property 'nodeName' does not exist on type 'EventTarget'.
Property 'nodeName' does not exist on type 'EventTarget'.
Property 'isContentEditable' does not exist on type 'EventTarget'.
What causes this error and what steps can be taken to resolve it?
View the live code example here: https://codesandbox.io/s/cover-image-forked-7n8z7w?file=/src/index.ts