Can one override accent keys behavior in javascript?

For certain foreign keyboards (German, Swedish) when one wants to write accented letters (á, ñ, ê) one would first press one of the accent keys (<kbd>´</kbd>, <kbd>~</kbd>, <kbd>^</kbd>) followed by the letter to have that accent. But if one presses it once no input is sent until one either presses it again or another letter, and the input gets that combination. What I'd like to know is if there is some way to detect when one of these... "sticky keys" are pressed then override the default behavior and "un-stick" the key, and display the accent on its own?

You can use event listeners on the input element:

For ` you can do something like:

document.getElementById("input").addEventListener("keydown",(event)=>{
  console.log(event.keyCode)
})

Then you can test it and see what the desired keycode is for your key and then adjust the code to something like this:

document.getElementById("input").addEventListener("keydown",(event)=>{
  if(event.keyCode==x){ //x is your keycode
    //do something
  }
})

The keycode of ` is 192.

For the other two it is harder because you need to keep track if shift is being pressed:

  let shiftPressed = false;
  document.getElementById("input").addEventListener("keydown",(event)=>{
    if (event.keyCode == 16){ //shift
      shiftPressed=true
    }
    if (event.keyCode == 54 && shiftPressed){ // for ^
      // ^
      // do some things
    }
    if (event.keyCode == 192 && shiftPressed){ // for ~
      // ~
      // do some things
    }
  })
  document.getElementById("input").addEventListener("keyup",(event)=>{
    if (event.keyCode == 16){ //shift
      shiftPressed=false
    }
  })

To add them on their own you can change the value of the input element like this:

document.getElementById("input").value +="`"

Edit:

To prevent the browser from adding another set of `` you can call event.preventDefault.

This gives the total code (reformatted for variable input instead of calling document.getElementById multiple times):

let shiftPressed = false;
const input = document.getElementById("input")
input.addEventListener("keydown",(event)=>{
  if (event.keyCode == 16){ //shift
    shiftPressed=true
  }
  if (event.keyCode == 54 && shiftPressed){ // for ^
    event.preventDefault()
    input.value+= "^"
  }
  if (event.keyCode == 192 && shiftPressed){ // for ~
    event.preventDefault()
    input.value+= "~"
  }
  else if(event.keyCode == 192){
    event.preventDefault()
    input.value+= "`"
  }
})
input.addEventListener("keyup",(event)=>{
  if (event.keyCode == 16){ //shift
    shiftPressed=false
  }
})