空格<code> and back to line

Question

My javascript enable to "write" in <code> (without content editable property, behind there is a hidden <textarea> and javascript catch keyboard events...) and while i'm writing in this hidden <textarea>, text goes in line and a horizontal scroll bar appear : I want to prevent this and make text back to line (like default <textarea> behaviour).

I've tried to add in my css the property white-space : pre-wrap; but I got this : (textarea visible with red text color, to compare <textarea> behaviour and my <code>'s)

How to fix this and make my <code> behave like a <textarea> ? Thanks for answers :)