JSFiddle - React, Tailwind, and code Playground

by textboxio

HTML

<script src="https://s3.amazonaws.com/ephox-static-ephox-com/jsfiddle/textboxio/textboxio.js"></script>
<h1>Bug: Delayed load event</h1>
<p>Press run and try to focus and type into the text field before the shadow text is set.</p>

<div id='article' style='height: 300px;'>
  <p><br/></p>
</div>

<script>
var ed = textboxio.replace('#article');
var showingShadowText = false;
ed.events.loaded.addListener(function() {
  ed.content.set('<p style="color:#aaa;">Shadow text</p>');
  showingShadowText = true;
});
ed.events.focus.addListener(function() {
  if (showingShadowText) {
    showingShadowText = false;
    ed.content.set('<p><br/></p>')
  }
})
</script>