<ul dir="auto">
<li>Electron version: Tested on 1.6.2 and 1.7.x</li>
<li>Operating system: MacOS</li>
</ul>
<p dir="auto">The webview canGoBack/canGoForward, and actual goBack/goForward actions, seem to get confused with Twitter.</p>
<p dir="auto">You can observe this by visiting twitter from a webview:</p>
<p dir="auto"><a target="_blank" rel="noopener noreferrer nofollow" href="https://user-images.githubusercontent.com/1270099/27463307-69f3e522-578c-11e7-9eab-0c1635a4693f.gif"><img src="https://user-images.githubusercontent.com/1270099/27463307-69f3e522-578c-11e7-9eab-0c1635a4693f.gif" alt="twitter-history-issue" data-animated-image="" style="max-width: 100%;"></a></p>
<p dir="auto">Demo: <a href="https://github.com/pfrazee/electron-bug-twitter-history">https://github.com/pfrazee/electron-bug-twitter-history</a></p>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="  $ git clone https://github.com/pfrazee/electron-bug-twitter-history
  $ cd electron-bug-twitter-history
  $ npm install
  $ npm start"><pre class="notranslate"><code class="notranslate">  $ git clone https://github.com/pfrazee/electron-bug-twitter-history
  $ cd electron-bug-twitter-history
  $ npm install
  $ npm start
</code></pre></div>
<ul dir="auto">
<li>Electron Version: 2.0.2</li>
<li>Operating System (Platform and Version): macOS 10.13.2</li>
<li>Last known working Electron version: N/A</li>
</ul>
<p dir="auto"><strong>Expected Behavior</strong><br>
WebView history remains correct after navigating with goBack()</p>
<p dir="auto"><strong>Actual behavior</strong><br>
Some webpages, such as <code class="notranslate">https://twitter.com/</code>, load a navigation upon <code class="notranslate">goBack()</code> being called, (in this case it is a navigation to <code class="notranslate">https://twitter.com/</code>), and this navigation triggers <code class="notranslate">this.webContents.on('navigation-entry-commited')</code> before the navigation from <code class="notranslate">goBack()</code> does, resulting in the wrong blocks code being executed and the WebView history to be messed up.</p>
<p dir="auto">Here's the relevant code in navigation-controller.js:</p>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="this.webContents.on('navigation-entry-commited', (event, url, inPage, replaceEntry) =&gt; {
      if (this.inPageIndex &gt; -1 &amp;&amp; !inPage) {
        // Navigated to a new page, clear in-page mark.
        this.inPageIndex = -1
      } else if (this.inPageIndex === -1 &amp;&amp; inPage &amp;&amp; !replaceEntry) {
        // Started in-page navigations.
        this.inPageIndex = this.currentIndex
      }
      if (this.pendingIndex &gt;= 0) {
        // Go to index.
        this.currentIndex = this.pendingIndex
        this.pendingIndex = -1
        this.history[this.currentIndex] = url
      } else if (replaceEntry) {
        // Non-user initialized navigation.
        this.history[this.currentIndex] = url
      } else {
        // Normal navigation. Clear history.
        this.history = this.history.slice(0, this.currentIndex + 1)
        this.currentIndex++
        this.history.push(url)
      }
    })"><pre class="notranslate"><code class="notranslate">this.webContents.on('navigation-entry-commited', (event, url, inPage, replaceEntry) =&gt; {
      if (this.inPageIndex &gt; -1 &amp;&amp; !inPage) {
        // Navigated to a new page, clear in-page mark.
        this.inPageIndex = -1
      } else if (this.inPageIndex === -1 &amp;&amp; inPage &amp;&amp; !replaceEntry) {
        // Started in-page navigations.
        this.inPageIndex = this.currentIndex
      }
      if (this.pendingIndex &gt;= 0) {
        // Go to index.
        this.currentIndex = this.pendingIndex
        this.pendingIndex = -1
        this.history[this.currentIndex] = url
      } else if (replaceEntry) {
        // Non-user initialized navigation.
        this.history[this.currentIndex] = url
      } else {
        // Normal navigation. Clear history.
        this.history = this.history.slice(0, this.currentIndex + 1)
        this.currentIndex++
        this.history.push(url)
      }
    })
</code></pre></div>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="NavigationController.prototype.goBack = function () {
    if (!this.canGoBack()) {
      return
    }
    this.pendingIndex = this.getActiveIndex() - 1
    if (this.inPageIndex &gt; -1 &amp;&amp; this.pendingIndex &gt;= this.inPageIndex) {
      return this.webContents._goBack()
    } else {
      return this.webContents._loadURL(this.history[this.pendingIndex], {})
    }
  }"><pre class="notranslate"><code class="notranslate">NavigationController.prototype.goBack = function () {
    if (!this.canGoBack()) {
      return
    }
    this.pendingIndex = this.getActiveIndex() - 1
    if (this.inPageIndex &gt; -1 &amp;&amp; this.pendingIndex &gt;= this.inPageIndex) {
      return this.webContents._goBack()
    } else {
      return this.webContents._loadURL(this.history[this.pendingIndex], {})
    }
  }
</code></pre></div>
<p dir="auto">And here's a log of what happens, with some edits to point out where it all goes wrong:</p>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="this.history: [ 'about:blank', 'https://www.google.com/?gws_rd=ssl', 'https://twitter.com/' ]
goBack() called:
    this.pendingIndex changed to 1
    loadURL(https://www.google.com/?gws_rd=ssl) called
this.webContents.on('navigation-entry-commited' event triggered: &lt;--- this should be from calling loadURL(https://www.google.com/?gws_rd=ssl), but it's not!
    &quot;// Go to index.&quot; block executed:
        this.currentIndex changed to 1
        this.pendingIndex changed to -1
        this.history[1] changed to: https://twitter.com/  &lt;--- !!!!!!! url is wrong! Expected to be https://www.google.com/?gws_rd=ssl
        this.history: [ 'about:blank', 'https://twitter.com/', 'https://twitter.com/' ] &lt;--- !!!!!!! Now this.history is messed up
this.webContents.on('navigation-entry-commited' event triggered: &lt;--- now this is from calling loadURL(https://www.google.com/?gws_rd=ssl), but it's after the previous weird navigation event
    &quot;// Normal navigation. Clear history.&quot; block executed: &lt;--- because of the previous event, this.pendingIndex was changed back to -1, so the wrong block of code is executed
        currentIndex is 1
        this.history sliced from 0 to (currentIndex + 1)
            this.history: [ 'about:blank', 'https://twitter.com/' ]
        currentIndex changed to 2
        &quot;https://www.google.com/?gws_rd=ssl&quot; pushed to history
            this.history: [ 'about:blank', 'https://twitter.com/', 'https://www.google.com/?gws_rd=ssl' ] &lt;--- now this.history is really messed up"><pre class="notranslate"><code class="notranslate">this.history: [ 'about:blank', 'https://www.google.com/?gws_rd=ssl', 'https://twitter.com/' ]
goBack() called:
    this.pendingIndex changed to 1
    loadURL(https://www.google.com/?gws_rd=ssl) called
this.webContents.on('navigation-entry-commited' event triggered: &lt;--- this should be from calling loadURL(https://www.google.com/?gws_rd=ssl), but it's not!
    "// Go to index." block executed:
        this.currentIndex changed to 1
        this.pendingIndex changed to -1
        this.history[1] changed to: https://twitter.com/  &lt;--- !!!!!!! url is wrong! Expected to be https://www.google.com/?gws_rd=ssl
        this.history: [ 'about:blank', 'https://twitter.com/', 'https://twitter.com/' ] &lt;--- !!!!!!! Now this.history is messed up
this.webContents.on('navigation-entry-commited' event triggered: &lt;--- now this is from calling loadURL(https://www.google.com/?gws_rd=ssl), but it's after the previous weird navigation event
    "// Normal navigation. Clear history." block executed: &lt;--- because of the previous event, this.pendingIndex was changed back to -1, so the wrong block of code is executed
        currentIndex is 1
        this.history sliced from 0 to (currentIndex + 1)
            this.history: [ 'about:blank', 'https://twitter.com/' ]
        currentIndex changed to 2
        "https://www.google.com/?gws_rd=ssl" pushed to history
            this.history: [ 'about:blank', 'https://twitter.com/', 'https://www.google.com/?gws_rd=ssl' ] &lt;--- now this.history is really messed up
</code></pre></div>
<p dir="auto"><strong>To Reproduce</strong><br>
see <a class="issue-link js-issue-link" data-error-text="Failed to load title" data-id="238019099" data-permission-text="Title is private" data-url="https://github.com/electron/electron/issues/9835" data-hovercard-type="issue" data-hovercard-url="/electron/electron/issues/9835/hovercard" href="https://github.com/electron/electron/issues/9835">#9835</a><br>
<strong>Screenshots</strong><br>
see <a class="issue-link js-issue-link" data-error-text="Failed to load title" data-id="238019099" data-permission-text="Title is private" data-url="https://github.com/electron/electron/issues/9835" data-hovercard-type="issue" data-hovercard-url="/electron/electron/issues/9835/hovercard" href="https://github.com/electron/electron/issues/9835">#9835</a></p>