I copied and pasted the JavaScript code you provided and called the {smiley face}. It worked.
I added the backdrop style to the var section and it worked too. Both with playing and testing.
I’m assuming your page just displays {smiley face} as straight code (not rendered, no errors).
There is this issue that is still open on the Chapbook github. Maybe Chris @klembot can provide some clarity and the best way to avoid the problem.
I’m a little fuzzy about it all though since I haven’t had to deal with it for a very long time. Here’s the explanation Greyelf @Greyelf provided…
…I just cleared my browser’s entire cache/cookies and it worked to reset things, but Greyelf explains how to target that specific local storage variable. Also, his take on the order of adding the var section variables and extending the custom inserts is spot on.
I really like Chapbook, but this issue needs more light shed on it for new users.
Let us know if you need any further guidance. 