title: cordova inappbrowser plugin
body: <p>I have a Vue Js app, and I am using Cordova for wrapping it into android application.</p>
  
  <p>the app contains 2 pages, <code>landing page</code> which contains items, and <code>details page</code> which shows details about an item. when you click on an item on <code>landing page</code>, the <code>details page</code> appears.</p>
  
  <p>I have a <code>button</code> on the <code>details page</code>, when clicking it, it goes to another<code>component</code>, and this <code>component</code> on <code>mounted()</code> event, it displays a html content from the local storage of the phone using <code>inappbrowser</code> plugin from Cordova.</p>
  
  <p>the problem is, after the <code>inappbrowser</code> shows the contents, if I press the back button of the phone, it redirects me to the <code>details page</code>, then if I press the back button of the phone again, it redirects me to the <code>inappbrowser</code>! instead of the <code>landing page</code>. and if I press it again, it will redirect me to the <code>details page</code>, then if I press the back button again, it will show the <code>innappbrowser</code> and so on....</p>
  
  <p>here is the code of the <code>component</code> which on <code>mounted()</code> event, it shows the <code>innappbrowser</code></p>
  
  <pre><code>&lt;template&gt;
    &lt;div&gt;      
        &lt;h1&gt;Loading &gt;&gt;&lt;/h1&gt;
    &lt;/div&gt;
  &lt;/template&gt;
  
  &lt;script&gt;
  import Vue from 'vue'
  
  export default 
  {
    mounted()
    {
       Vue.cordova.on("deviceReady", () =&gt; {
          var ref = window.open('file:///storage/emulated/0/tin/story.html', '_self');
       });
    }
  }
  &lt;/script&gt;
  
  &lt;style&gt;
  
  &lt;/style&gt;
  </code></pre>
  
  <p>I tried to add the <code>hardwareback=no</code> to the options of <code>inappbrowser</code> but it didn't work.</p>
  
  <p>what should I do to remove the <code>inappbrowser</code> from the stack history when pressing the back button.</p>