title: Wait for DOM to finalize manipulations before calling prompt
body: <p>The page needs to be rendered before the prompt is called. In current implementation, <code>prompt(...)</code> interrupts DOM manipulation and <code>hint</code> is shown only after user clicks OK on prompt message box.</p>
  
  <p>Although <code>el.innerHTML = 'Please, reply to prompt';</code> is called before <code>var res = prompt('Hello world');</code>, the HTML element with <code>id='hint'</code> won't be updated until user hits OK on prompt message box.   </p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;script type="text/javascript"&gt;
      function callNativeApp() {
          console.log('callNativeApp called');
          try {
              // Show hint message
              var el = document.getElementById('hint'); 
              el.innerHTML = 'Please, reply to prompt';
  
              // Call prompt            
              var res = prompt('Hello world');
  
              // Write result of prompt reply to html
              document.getElementById('prompt-call-output').innerHTML = res;
          } catch(err) {
              console.log('The native context does not exist yet');
          }
      }
  &lt;/script&gt;
  &lt;html&gt;
      &lt;head&gt;
      &lt;/head&gt;
      &lt;body&gt;
          &lt;button onclick="callNativeApp()"&gt;Call native app&lt;/button&gt;
          &lt;p id="hint"&gt;&lt;/p&gt;
          &lt;p id="prompt-call-output"&gt;&lt;/p&gt;
      &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>How to change current code, so the page renders first. And only after that prompt is called()? E.g. Somehow force DOM tree to update(refresh) before prompt call?</p>
  
  <p>Timeout solution for calling <code>var res = prompt('Hello world');</code> like</p>
  
  <pre><code>setTimeout(function() {
      var res = prompt('Hello world');
      document.getElementById('prompt-call-output').innerHTML = res;
  }, 100);
  </code></pre>
  
  <p>is not applicable as our current codebase relies on sequence of commands that goes after <code>prompt(...)</code> call.</p>
  
  <p>Screen that shows that <code>hint</code> is not shown when prompt is called, even though text hint setting is called before calling prompt:
  <a href="https://i.stack.imgur.com/nac55.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/nac55.png" alt="enter image description here"></a></p>
  
  <p>And <code>hint</code> is only shown when prompt window is closed:</p>
  
  <p><a href="https://i.stack.imgur.com/PfsB9.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/PfsB9.png" alt="enter image description here"></a></p>