Merge pull request #9687 from brave/9686

Check for no frame info in tab content components

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

@@ -4,6 +4,7 @@
 
 const React = require('react')
 const {StyleSheet, css} = require('aphrodite/no-important')
+const Immutable = require('immutable')
 
 // Components
 const ReduxComponent = require('../../reduxComponent')
@@ -43,7 +44,10 @@ class AudioTabIcon extends React.Component {
 
   mergeProps (state, ownProps) {
     const currentWindow = state.get('currentWindow')
-    const frame = frameStateUtil.getFrameByKey(currentWindow, ownProps.frameKey)
+
+    // AudioIcon will never be created if there is no frameKey, but for consistency
+    // across other components I added teh || Immutable.Map()
+    const frame = frameStateUtil.getFrameByKey(currentWindow, ownProps.frameKey) || Immutable.Map()
 
     const props = {}
     // used in other functions

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

@@ -4,6 +4,7 @@
 
 const React = require('react')
 const {StyleSheet, css} = require('aphrodite/no-important')
+const Immutable = require('immutable')
 
 // Components
 const ReduxComponent = require('../../reduxComponent')
@@ -51,7 +52,7 @@ class CloseTabIcon extends React.Component {
   mergeProps (state, ownProps) {
     const currentWindow = state.get('currentWindow')
     const isPinnedTab = frameStateUtil.isPinned(currentWindow, ownProps.frameKey)
-    const frame = frameStateUtil.getFrameByKey(currentWindow, ownProps.frameKey)
+    const frame = frameStateUtil.getFrameByKey(currentWindow, ownProps.frameKey) || Immutable.Map()
 
     const props = {}
     // used in renderer

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

@@ -4,6 +4,7 @@
 
 const React = require('react')
 const {StyleSheet, css} = require('aphrodite/no-important')
+const Immutable = require('immutable')
 
 // Components
 const ReduxComponent = require('../../reduxComponent')
@@ -25,7 +26,7 @@ const newSessionSvg = require('../../../../extensions/brave/img/tabs/new_session
 class NewSessionIcon extends React.Component {
   mergeProps (state, ownProps) {
     const currentWindow = state.get('currentWindow')
-    const frame = frameStateUtil.getFrameByKey(currentWindow, ownProps.frameKey)
+    const frame = frameStateUtil.getFrameByKey(currentWindow, ownProps.frameKey) || Immutable.Map()
     const partition = frame.get('partitionNumber')
 
     const props = {}

app/renderer/components/tabs/tab.js

@@ -4,6 +4,7 @@
 
 const React = require('react')
 const {StyleSheet, css} = require('aphrodite')
+const Immutable = require('immutable')
 
 // Components
 const ReduxComponent = require('../reduxComponent')
@@ -230,7 +231,7 @@ class Tab extends React.Component {
 
   mergeProps (state, ownProps) {
     const currentWindow = state.get('currentWindow')
-    const frame = frameStateUtil.getFrameByKey(currentWindow, ownProps.frameKey)
+    const frame = frameStateUtil.getFrameByKey(currentWindow, ownProps.frameKey) || Immutable.Map()
     const notifications = state.get('notifications')
     const notificationOrigins = notifications ? notifications.map(bar => bar.get('frameOrigin')) : false
     const notificationBarActive = frame.get('location') && notificationOrigins &&

test/unit/app/renderer/components/tabs/content/audioTabIconTest.js

@@ -13,6 +13,7 @@ require('../../../../../braveUnit')
 
 const tabId = 1
 const frameKey = 1
+const invalidFrameKey = 71
 
 const fakeAppStoreRenderer = {
   state: Immutable.fromJS({
@@ -95,6 +96,12 @@ describe('Tabs content - AudioTabIcon', function () {
       const wrapper = mount(<Tab frameKey={frameKey} />)
       assert.equal(wrapper.find('AudioTabIcon TabIcon').props().symbol, globalStyles.appIcons.volumeOff)
     })
+    it('passing in a frame key which does not exist does not fail', function () {
+      windowStore.state = defaultWindowStore
+      const wrapper = mount(<Tab frameKey={invalidFrameKey} />)
+      // No audio icon is rendered in this case so just check for Tab
+      assert(wrapper.find('Tab'))
+    })
   })
 
   describe('should not show', function () {

test/unit/app/renderer/components/tabs/content/closeTabIconTest.js

@@ -12,6 +12,7 @@ require('../../../../../braveUnit')
 
 const tabId = 1
 const frameKey = 1
+const invalidFrameKey = 71
 
 const fakeAppStoreRenderer = {
   state: Immutable.fromJS({
@@ -135,6 +136,12 @@ describe('Tabs content - CloseTabIcon', function () {
       const wrapper = mount(<CloseTabIcon frameKey={frameKey} />)
       assert.equal(wrapper.find('TabIcon').props()['data-test2-id'], 'close-icon-on')
     })
+
+    it('passing in a frame key which does not exist does not fail', function () {
+      windowStore.state = defaultWindowStore
+      const wrapper = mount(<CloseTabIcon frameKey={invalidFrameKey} />)
+      assert.equal(wrapper.find('TabIcon').props()['data-test2-id'], 'close-icon-off')
+    })
   })
 
   describe('should not show icon', function () {

test/unit/app/renderer/components/tabs/content/newSessionIconTest.js

@@ -13,6 +13,7 @@ require('../../../../../braveUnit')
 
 const tabId = 1
 const frameKey = 1
+const invalidFrameKey = 71
 
 const fakeAppStoreRenderer = {
   state: Immutable.fromJS({
@@ -145,6 +146,11 @@ describe('Tabs content - NewSessionIcon', function () {
       const wrapper = mount(<NewSessionIcon frameKey={frameKey} />)
       assert.equal(wrapper.find('TabIcon').props().symbolContent, tabs.maxAllowedNewSessions)
     })
+    it('passing in a frame key which does not exist does not fail', function () {
+      windowStore.state = defaultWindowStore
+      const wrapper = mount(<NewSessionIcon frameKey={invalidFrameKey} />)
+      assert(wrapper.find('TabIcon'))
+    })
   })
 
   describe('should not show icon', function () {

test/unit/app/renderer/components/tabs/content/tabTitleTest.js

@@ -15,6 +15,7 @@ const url1 = 'https://brave.com'
 const pageTitle1 = 'Brave Software'
 const tabId = 1
 const frameKey = 1
+const invalidFrameKey = 71
 
 const fakeAppStoreRenderer = {
   state: Immutable.fromJS({
@@ -138,6 +139,11 @@ describe('Tabs content - Title', function () {
       const wrapper = mount(<Tab frameKey={frameKey} />)
       assert.equal(wrapper.find('TabTitle div').text(), pageTitle1)
     })
+    it('passing in a frame key which does not exist does not fail', function () {
+      windowStore.state = defaultWindowStore
+      const wrapper = mount(<Tab frameKey={invalidFrameKey} />)
+      assert.equal(wrapper.find('TabTitle div').text(), '')
+    })
   })
 
   describe('should not show text', function () {