How to add empty space characters in a TextArea

Question

When I press the TAB key I would like my text to append four empty spaces from where I selected my text, but my code doesn't seem to work and instead is glitching my TextArea.

document.getElementById('code-area').addEventListener('keydown', function(event) {
if (event.key == 'Tab') {
event.preventDefault();

this.value += ' ';
}
});

Answer 1

tried to call event.preventDefault() at begin?