Revert "Merge remote-tracking branch 'origin/tabsbar/preview-timing' …

…into tabsbar/preview-timing"

This reverts commit 6edd5e8, reversing
changes made to f5f1c9a.

app/renderer/components/navigation/navigationBar.js

@@ -158,7 +158,6 @@ class NavigationBar extends React.Component {
     props.activeTabShowingMessageBox = activeTabShowingMessageBox
     props.locationInfo = state.get('locationInfo')
     props.titleMode = titleMode
-    props.activeTabId = activeTabId
 
     return props
   }
@@ -206,9 +205,7 @@ class NavigationBar extends React.Component {
       {
         !this.props.titleMode && getSetting(settings.SHOW_HOME_BUTTON)
         ? <span className='navigationButtonContainer'>
-          <button
-            data-test-id='homeButton'
-            data-l10n-id='homeButton'
+          <button data-l10n-id='homeButton'
             className='normalizeButton navigationButton homeButton'
             onClick={this.onHome} />
         </span>

app/renderer/components/navigation/urlBar.js

@@ -311,17 +311,13 @@ class UrlBar extends React.Component {
 
   select () {
     if (this.urlInput) {
-      setImmediate(() => {
-        this.urlInput.select()
-      })
+      this.urlInput.select()
     }
   }
 
   focus () {
     if (this.urlInput) {
-      setImmediate(() => {
-        this.urlInput.focus()
-      })
+      this.urlInput.focus()
     }
   }
 

app/renderer/components/reduxComponent.js

@@ -20,20 +20,20 @@ class ReduxComponent extends ImmutableComponent {
     super(props)
     this.componentType = props.componentType
     this.state = {}
-    this.internalState = props
     this.checkForUpdates = debounce(this.checkForUpdates.bind(this), 5)
     this.dontCheck = false
   }
 
   checkForUpdates () {
-    if (!this.dontCheck && this.shouldComponentUpdate(this.props)) {
+    if (!this.dontCheck && this.shouldComponentUpdate(this.props, this.buildProps())) {
       this.forceUpdate()
     }
   }
 
   componentDidMount () {
     appStore.addChangeListener(this.checkForUpdates)
     windowStore.addChangeListener(this.checkForUpdates)
+    this.internalState = this.buildProps(this.props)
   }
 
   componentWillUnmount () {
@@ -42,6 +42,10 @@ class ReduxComponent extends ImmutableComponent {
     windowStore.removeChangeListener(this.checkForUpdates)
   }
 
+  componentDidUpdate () {
+    this.internalState = this.buildProps(this.props)
+  }
+
   checkParam (old, next, prop) {
     return isList(next[prop])
       ? !isSameHashCode(next[prop], old[prop])
@@ -50,11 +54,7 @@ class ReduxComponent extends ImmutableComponent {
 
   shouldComponentUpdate (nextProps, nextState) {
     nextState = this.buildProps(nextProps)
-    const shouldUpdate = Object.keys(nextState).some((prop) => this.checkParam(this.internalState, nextState, prop))
-    if (shouldUpdate) {
-      this.internalState = nextState
-    }
-    return shouldUpdate
+    return Object.keys(nextState).some((prop) => this.checkParam(this.internalState, nextState, prop))
   }
 
   mergeProps (stateProps, dispatchProps, ownProps) {
@@ -66,7 +66,7 @@ class ReduxComponent extends ImmutableComponent {
   }
 
   render () {
-    return React.createElement(this.componentType, this.internalState)
+    return React.createElement(this.componentType, this.buildProps())
   }
 }
 

app/renderer/components/tabs/content/audioTabIcon.js

@@ -15,16 +15,16 @@ const tabStyles = require('../../styles/tab')
 
 class AudioTabIcon extends ImmutableComponent {
   get pageCanPlayAudio () {
-    return !!this.props.frame.get('audioPlaybackActive')
+    return !!this.props.tab.get('audioPlaybackActive')
   }
 
   get shouldShowAudioIcon () {
     // We switch to blue top bar for all breakpoints but default
-    return this.props.frame.get('breakpoint') === 'default'
+    return this.props.tab.get('breakpoint') === 'default'
   }
 
   get mutedState () {
-    return this.pageCanPlayAudio && !!this.props.frame.get('audioMuted')
+    return this.pageCanPlayAudio && !!this.props.tab.get('audioMuted')
   }
 
   get audioIcon () {
@@ -37,8 +37,7 @@ class AudioTabIcon extends ImmutableComponent {
     return this.pageCanPlayAudio && this.shouldShowAudioIcon
       ? <TabIcon
         className={css(tabStyles.icon, styles.audioIcon)}
-        symbol={this.audioIcon}
-        onClick={this.props.onClick} />
+        symbol={this.audioIcon} onClick={this.props.onClick} />
       : null
   }
 }

app/renderer/components/tabs/content/closeTabIcon.js

@@ -19,7 +19,7 @@ const closeTabSvg = require('../../../../extensions/brave/img/tabs/close_btn_nor
 
 class CloseTabIcon extends ImmutableComponent {
   get isPinned () {
-    return !!this.props.frame.get('pinnedLocation')
+    return !!this.props.tab.get('pinnedLocation')
   }
 
   render () {

app/renderer/components/tabs/content/favIcon.js

@@ -20,7 +20,7 @@ const loadingIconSvg = require('../../../../extensions/brave/img/tabs/loading.sv
 
 class Favicon extends ImmutableComponent {
   get favicon () {
-    return !this.props.isLoading && this.props.frame.get('icon')
+    return !this.props.isLoading && this.props.tab.get('icon')
   }
 
   get defaultIcon () {
@@ -30,12 +30,12 @@ class Favicon extends ImmutableComponent {
   }
 
   get narrowView () {
-    return this.props.frame.get('breakpoint') === 'smallest'
+    return this.props.tab.get('breakpoint') === 'smallest'
   }
 
   get shouldHideFavicon () {
     return (hasBreakpoint(this.props, 'extraSmall') && this.props.isActive) ||
-      this.props.frame.get('location') === 'about:newtab'
+      this.props.tab.get('location') === 'about:newtab'
   }
 
   render () {
@@ -57,7 +57,7 @@ class Favicon extends ImmutableComponent {
         className={css(
           tabStyles.icon,
           this.favicon && iconStyles.favicon,
-          !this.props.frame.get('pinnedLocation') && this.narrowView && styles.faviconNarrowView
+          !this.props.tab.get('pinnedLocation') && this.narrowView && styles.faviconNarrowView
         )}
         symbol={
           (this.props.isLoading && css(styles.loadingIcon, iconStyles.loadingIconColor)) ||

app/renderer/components/tabs/content/newSessionIcon.js

@@ -21,7 +21,7 @@ const newSessionSvg = require('../../../../extensions/brave/img/tabs/new_session
 
 class NewSessionIcon extends ImmutableComponent {
   get partitionNumber () {
-    let partition = this.props.frame.get('partitionNumber')
+    let partition = this.props.tab.get('partitionNumber')
     // Persistent partitions opened by `target="_blank"` will have
     // *partition-* string first, which causes bad UI. We don't need it for tabs
     if (typeof partition === 'string') {

app/renderer/components/tabs/content/privateIcon.js

@@ -25,7 +25,7 @@ class PrivateIcon extends ImmutableComponent {
       }
     })
 
-    return this.props.frame.get('isPrivate') && hasVisibleSecondaryIcon(this.props)
+    return this.props.tab.get('isPrivate') && hasVisibleSecondaryIcon(this.props)
       ? <TabIcon data-test-id='privateIcon'
         className={css(tabStyles.icon, styles.secondaryIcon, privateStyles.icon)}
       />

app/renderer/components/tabs/content/tabTitle.js

@@ -18,11 +18,11 @@ const globalStyles = require('../../styles/global')
 class TabTitle extends ImmutableComponent {
   get isActiveOrHasSecondaryIcon () {
     return this.props.isActive ||
-      (!!this.props.frame.get('isPrivate') || !!this.props.frame.get('partitionNumber'))
+      (!!this.props.tab.get('isPrivate') || !!this.props.tab.get('partitionNumber'))
   }
 
   get isPinned () {
-    return !!this.props.frame.get('pinnedLocation')
+    return !!this.props.tab.get('pinnedLocation')
   }
 
   get shouldHideTitle () {

app/renderer/components/tabs/pinnedTabs.js

@@ -45,10 +45,10 @@ class PinnedTabs extends ImmutableComponent {
     // will cause the onDragEnd to never run
     setTimeout(() => {
       const key = sourceDragData.get('key')
-      let droppedOnTab = dnd.closestFromXOffset(this.tabRefs.filter((node) => node && node.props.frame.get('key') !== key), clientX).selectedRef
+      let droppedOnTab = dnd.closestFromXOffset(this.tabRefs.filter((node) => node && node.props.tab.get('frameKey') !== key), clientX).selectedRef
       if (droppedOnTab) {
         const isLeftSide = dnd.isLeftSide(ReactDOM.findDOMNode(droppedOnTab), clientX)
-        const droppedOnFrameProps = windowStore.getFrame(droppedOnTab.props.frame.get('key'))
+        const droppedOnFrameProps = windowStore.getFrame(droppedOnTab.props.tab.get('frameKey'))
         windowActions.moveTab(sourceDragData, droppedOnFrameProps, isLeftSide)
         if (!sourceDragData.get('pinnedLocation')) {
           appActions.tabPinned(sourceDragData.get('tabId'), true)
@@ -73,14 +73,14 @@ class PinnedTabs extends ImmutableComponent {
       onDrop={this.onDrop}>
       {
          this.props.pinnedTabs
-           .map((frame) =>
+           .map((tab) =>
              <Tab ref={(node) => this.tabRefs.push(node)}
                dragData={this.props.dragData}
-               frame={frame}
-               key={'tab-' + frame.get('key')}
+               tab={tab}
+               key={'tab-' + tab.get('frameKey')}
                paintTabs={this.props.paintTabs}
                previewTabs={this.props.previewTabs}
-               isActive={this.props.activeFrameKey === frame.get('key')}
+               isActive={this.props.activeFrameKey === tab.get('frameKey')}
                partOfFullPageSet={this.props.partOfFullPageSet} />)
       }
     </div>