add clone tab support

app/extensions/brave/locales/en-US/menu.properties

@@ -90,6 +90,7 @@ editBookmark=Edit Bookmark...
 deleteFolder=Delete Folder
 deleteBookmark=Delete Bookmark
 stop=Stop
+cloneTab=Clone Tab
 reloadTab=Reload
 unpinTab=Unpin
 pinTab=Pin

app/locale.js

@@ -92,6 +92,7 @@ var rendererIdentifiers = function () {
     'reloadTab',
     'cleanReload',
     'reload',
+    'cloneTab',
     'readingView',
     'tabManager',
     'textEncoding',

docs/windowActions.md

@@ -219,14 +219,16 @@ Dispatches a message to the store to create a new frame
 
 
 
-### cloneFrame(frameProps) 
+### cloneFrame(frameProps, guestInstanceId) 
 
-Dispatches a message to the store to create a new frame similar to the passed arg.
+Dispatches a message to the store to clone an existing frame
 
 **Parameters**
 
 **frameProps**: `Object`, The properties of the frame to clone
 
+**guestInstanceId**: `number`, The guestInstanceId of the cloned webcontents
+
 
 
 ### closeFrame(frames, frameProps) 

js/actions/windowActions.js

@@ -290,16 +290,18 @@ const windowActions = {
   },
 
   /**
-   * Dispatches a message to the store to create a new frame similar to the passed arg.
+   * Dispatches a message to the store to clone an existing frame
    *
    * @param {Object} frameProps - The properties of the frame to clone
+   * @param {number} guestInstanceId - The guestInstanceId of the cloned webcontents
    */
-  cloneFrame: function (frameProps) {
-    this.newFrame({
-      location: frameProps.get('location'),
-      isPrivate: frameProps.get('isPrivate'),
-      partitionNumber: frameProps.get('partitionNumber')
-    }, false)
+  cloneFrame: function (frameProps, guestInstanceId, openInForeground) {
+    dispatch({
+      actionType: WindowConstants.WINDOW_CLONE_FRAME,
+      frameOpts: frameProps.toJS ? frameProps.toJS() : frameProps,
+      guestInstanceId,
+      openInForeground
+    })
   },
 
   /**

js/components/frame.js

@@ -334,6 +334,14 @@ class Frame extends ImmutableComponent {
         }
         this.webview.reloadIgnoringCache()
         break
+      case 'clone':
+        if (this.isAboutPage()) {
+          break
+        }
+        const newGuest = this.webview.clone()
+        const newGuestInstanceId = newGuest.getWebPreferences().guestInstanceId
+        windowActions.cloneFrame(this.props.frame, newGuestInstanceId)
+        break
       case 'explicitLoadURL':
         this.webview.loadURL(location)
         break

js/constants/messages.js

@@ -12,6 +12,7 @@ const messages = {
   SHORTCUT_ACTIVE_FRAME_STOP: _,
   SHORTCUT_ACTIVE_FRAME_RELOAD: _,
   SHORTCUT_ACTIVE_FRAME_CLEAN_RELOAD: _,
+  SHORTCUT_ACTIVE_FRAME_CLONE: _,
   SHORTCUT_ACTIVE_FRAME_ZOOM_IN: _,
   SHORTCUT_ACTIVE_FRAME_ZOOM_OUT: _,
   SHORTCUT_ACTIVE_FRAME_ZOOM_RESET: _,

js/constants/windowConstants.js

@@ -9,6 +9,7 @@ const windowConstants = {
   WINDOW_SET_URL: _,
   WINDOW_SET_NAVBAR_INPUT: _,
   WINDOW_NEW_FRAME: _,
+  WINDOW_CLONE_FRAME: _,
   WINDOW_CLOSE_FRAME: _,
   WINDOW_SET_ACTIVE_FRAME: _,
   WINDOW_SET_FOCUSED_FRAME: _,

js/contextMenus.js

@@ -834,6 +834,15 @@ function mainTemplateInit (nodeProps, frame) {
               }
             }
           },
+          {
+            label: locale.translation('cloneTab'),
+            click: (item, focusedWindow) => {
+              if (focusedWindow) {
+                focusedWindow.webContents.send(messages.SHORTCUT_ACTIVE_FRAME_CLONE)
+              }
+            }
+          },
+
           CommonMenu.separatorMenuItem,
           addBookmarkMenuItem('bookmarkPage', siteUtil.getDetailFromFrame(frame, siteTags.BOOKMARK), false), {
             label: locale.translation('find'),

js/state/frameStateUtil.js

@@ -172,26 +172,6 @@ function getFramePropsIndex (frames, frameProps) {
   return frames.findIndex(matchFrame.bind(null, queryInfo))
 }
 
-/**
- * Converts a feature string into an object.
- * @param {String} featureStr A string like, arg=val,arg2=val2
- */
-function getFeatures (featureStr) {
-  return String(featureStr)
-    .split(',')
-    .reduce((acc, feature) => {
-      feature = feature
-        .split('=')
-        .map((featureElem) => featureElem.trim())
-      if (feature.length !== 2) {
-        return acc
-      }
-
-      acc[decodeURIComponent(feature[0])] = decodeURIComponent(feature[1])
-      return acc
-    }, {})
-}
-
 /**
  * Determines if the specified frame was opened from the specified
  * ancestorFrameKey.
@@ -233,27 +213,63 @@ function getPartition (frameOpts) {
   }
   return partition
 }
+
+function cloneFrame (frameOpts, guestInstanceId) {
+  const cloneableAttributes = [
+    'audioMuted',
+    'canGoBack',
+    'canGoForward',
+    'icon',
+    'title',
+    'isPrivate',
+    'partitionNumber',
+    'themeColor',
+    'computedThemeColor'
+  ]
+  let clone = {}
+  cloneableAttributes.forEach((attr) => {
+    clone[attr] = frameOpts[attr]
+  })
+
+  clone.guestInstanceId = guestInstanceId
+  // copy the history
+  clone.history = frameOpts.history.slice(0)
+  // location is loaded by the webcontents
+  clone.delayedLoadUrl = frameOpts.location
+  clone.location = 'about:blank'
+  clone.src = 'about:blank'
+  clone.parentFrameKey = frameOpts.key
+  return clone
+}
+
 /**
  * Adds a frame specified by frameOpts and newKey and sets the activeFrameKey
  * @return Immutable top level application state ready to merge back in
  */
 function addFrame (frames, frameOpts, newKey, partitionNumber, activeFrameKey) {
   const url = frameOpts.location || config.defaultUrl
+
+  // delayedLoadUrl is used as a placeholder when the new frame is created
+  // from a renderer initiated navigation (window.open, cmd/ctrl-click, etc...)
+  const delayedLoadUrl = frameOpts.delayedLoadUrl
+  delete frameOpts.delayedLoadUrl
   const navbarFocus = activeFrameKey === newKey &&
                       url === config.defaultUrl &&
-                      frameOpts.delayedLoadUrl === undefined
-  const location = frameOpts.delayedLoadUrl || url // page url
+                      delayedLoadUrl === undefined
+  const location = delayedLoadUrl || url // page url
 
   // Only add pin requests if it's not already added
-  if (frameOpts.isPinned) {
+  const isPinned = frameOpts.isPinned
+  delete frameOpts.isPinned
+  if (isPinned) {
     const alreadyPinnedFrameProps = frames.find((frame) =>
       frame.get('pinnedLocation') === location && frame.get('partitionNumber') === partitionNumber)
     if (alreadyPinnedFrameProps) {
       return {}
     }
   }
 
-  const frame = Immutable.fromJS({
+  const frame = Immutable.fromJS(Object.assign({
     zoomLevel: config.zoom.defaultValue,
     audioMuted: false, // frame is muted
     canGoBack: false,
@@ -263,21 +279,17 @@ function addFrame (frames, frameOpts, newKey, partitionNumber, activeFrameKey) {
     src: url, // what the iframe src should be
     tabId: -1,
     // if this is a delayed load then go ahead and start the loading indicator
-    loading: !!frameOpts.delayedLoadUrl,
-    startLoadTime: frameOpts.delayedLoadUrl ? new Date().getTime() : null,
+    loading: !!delayedLoadUrl,
+    startLoadTime: delayedLoadUrl ? new Date().getTime() : null,
     endLoadTime: null,
-    isPrivate: frameOpts.isPrivate || false,
+    isPrivate: false,
     partitionNumber,
-    element: frameOpts.element,
-    features: getFeatures(frameOpts.features),
-    pinnedLocation: frameOpts.isPinned ? url : undefined,
+    pinnedLocation: isPinned ? url : undefined,
     key: newKey,
-    parentFrameKey: frameOpts.parentFrameKey,
-    guestInstanceId: frameOpts.guestInstanceId,
     navbar: {
       focused: navbarFocus,
       urlbar: {
-        location: frameOpts.delayedLoadUrl || url,
+        location: delayedLoadUrl || url,
         urlPreview: '',
         suggestions: {
           selectedIndex: 0,
@@ -300,7 +312,7 @@ function addFrame (frames, frameOpts, newKey, partitionNumber, activeFrameKey) {
     },
     unloaded: frameOpts.unloaded,
     history: []
-  })
+  }, frameOpts))
 
   // Find the closest index to the current frame's index which has
   // a different ancestor frame key.
@@ -461,8 +473,8 @@ module.exports = {
   findDisplayIndexForFrameKey,
   getFramePropsIndex,
   getFrameKeysByDisplayIndex,
-  getFeatures,
   getPartition,
+  cloneFrame,
   addFrame,
   undoCloseFrame,
   removeFrame,

js/stores/windowStore.js

@@ -152,6 +152,51 @@ const addToHistory = (frameProps) => {
   return history.slice(-10)
 }
 
+const newFrame = (frameOpts, openInForeground) => {
+  if (frameOpts === undefined) {
+    frameOpts = {}
+  }
+  if (openInForeground === undefined) {
+    openInForeground = true
+  }
+  frameOpts.location = frameOpts.location || config.defaultUrl
+  if (frameOpts.location && UrlUtil.isURL(frameOpts.location)) {
+    frameOpts.location = UrlUtil.getUrlFromInput(frameOpts.location)
+  } else {
+    const defaultURL = windowStore.getState().getIn(['searchDetail', 'searchURL'])
+    if (defaultURL) {
+      frameOpts.location = defaultURL
+        .replace('{searchTerms}', encodeURIComponent(frameOpts.location))
+    } else {
+      // Bad URLs passed here can actually crash the browser
+      frameOpts.location = ''
+    }
+  }
+
+  const nextKey = incrementNextKey()
+  let nextPartitionNumber = 0
+  if (frameOpts.partitionNumber) {
+    nextPartitionNumber = frameOpts.partitionNumber
+    if (currentPartitionNumber < nextPartitionNumber) {
+      currentPartitionNumber = nextPartitionNumber
+    }
+  } else if (frameOpts.isPartitioned) {
+    nextPartitionNumber = incrementPartitionNumber()
+  }
+  frameOpts.location = setPDFLocation(frameOpts.location)
+  windowState = windowState.merge(FrameStateUtil.addFrame(windowState.get('frames'), frameOpts,
+    nextKey, nextPartitionNumber, openInForeground ? nextKey : windowState.get('activeFrameKey')))
+  if (openInForeground) {
+    const activeFrame = FrameStateUtil.getActiveFrame(windowState)
+    updateTabPageIndex(activeFrame)
+    // For about:newtab we want to have the urlbar focused, not the new frame.
+    // Otherwise we want to focus the new tab when it is a new frame in the foreground.
+    if (activeFrame.get('location') !== 'about:newtab') {
+      focusWebview(activeFrameStatePath())
+    }
+  }
+}
+
 const windowStore = new WindowStore()
 const emitChanges = debounce(windowStore.emitChanges.bind(windowStore), 5)
 
@@ -315,48 +360,10 @@ const doAction = (action) => {
       }
       break
     case WindowConstants.WINDOW_NEW_FRAME:
-      if (action.frameOpts === undefined) {
-        action.frameOpts = {}
-      }
-      if (action.openInForeground === undefined) {
-        action.openInForeground = true
-      }
-      action.frameOpts.location = action.frameOpts.location || config.defaultUrl
-      if (action.frameOpts.location && UrlUtil.isURL(action.frameOpts.location)) {
-        action.frameOpts.location = UrlUtil.getUrlFromInput(action.frameOpts.location)
-      } else {
-        const defaultURL = windowStore.getState().getIn(['searchDetail', 'searchURL'])
-        if (defaultURL) {
-          action.frameOpts.location = defaultURL
-            .replace('{searchTerms}', encodeURIComponent(action.frameOpts.location))
-        } else {
-          // Bad URLs passed here can actually crash the browser
-          action.frameOpts.location = ''
-        }
-      }
-
-      const nextKey = incrementNextKey()
-      let nextPartitionNumber = 0
-      if (action.frameOpts.partitionNumber) {
-        nextPartitionNumber = action.frameOpts.partitionNumber
-        if (currentPartitionNumber < nextPartitionNumber) {
-          currentPartitionNumber = nextPartitionNumber
-        }
-      } else if (action.frameOpts.isPartitioned) {
-        nextPartitionNumber = incrementPartitionNumber()
-      }
-      action.frameOpts.location = setPDFLocation(action.frameOpts.location)
-      windowState = windowState.merge(FrameStateUtil.addFrame(windowState.get('frames'), action.frameOpts,
-        nextKey, nextPartitionNumber, action.openInForeground ? nextKey : windowState.get('activeFrameKey')))
-      if (action.openInForeground) {
-        const activeFrame = FrameStateUtil.getActiveFrame(windowState)
-        updateTabPageIndex(activeFrame)
-        // For about:newtab we want to have the urlbar focused, not the new frame.
-        // Otherwise we want to focus the new tab when it is a new frame in the foreground.
-        if (activeFrame.get('location') !== 'about:newtab') {
-          focusWebview(activeFrameStatePath())
-        }
-      }
+      newFrame(action.frameOpts, action.openInForeground)
+      break
+    case WindowConstants.WINDOW_CLONE_FRAME:
+      newFrame(FrameStateUtil.cloneFrame(action.frameOpts, action.guestInstanceId), action.openInForeground)
       break
     case WindowConstants.WINDOW_CLOSE_FRAME:
       const currentWindow = require('electron').remote.getCurrentWindow()
@@ -662,7 +669,7 @@ ipc.on(messages.IMPORT_BOOKMARKS, () => {
   }
 })
 
-const frameShortcuts = ['stop', 'reload', 'zoom-in', 'zoom-out', 'zoom-reset', 'toggle-dev-tools', 'clean-reload', 'view-source', 'mute', 'save', 'print', 'show-findbar', 'copy', 'find-next', 'find-prev']
+const frameShortcuts = ['stop', 'reload', 'zoom-in', 'zoom-out', 'zoom-reset', 'toggle-dev-tools', 'clean-reload', 'view-source', 'mute', 'save', 'print', 'show-findbar', 'copy', 'find-next', 'find-prev', 'clone']
 frameShortcuts.forEach((shortcut) => {
   // Listen for actions on the active frame
   ipc.on(`shortcut-active-frame-${shortcut}`, () => {