[Source Tabs] context menu copy source url + view source

[jasonLaster]

Users should be able to right click on a source tab and either copy the source url to their clipboard or open the source in a new tab. Screenshots below

Patch 1: adding the context menu items

diff --git a/src/components/SourceTabs.js b/src/components/SourceTabs.js
index 20a7e8e..bafd76f 100644
--- a/src/components/SourceTabs.js
+++ b/src/components/SourceTabs.js
@@ -106,6 +106,14 @@ const SourceTabs = React.createClass({
       }
     };

+    function copyToTheClipbloard(url) {
+      // need to research https://clipboardjs.com
+    }
+
+    function viewSource(url) {
+      // need to research
+    }
+
     const closeAllTabsMenuItem = {
       id: "node-menu-close-all-tabs",
       label: closeAllTabsLabel,
@@ -114,12 +122,31 @@ const SourceTabs = React.createClass({
       click: () => closeTabs(tabs)
     };

+    const copySourceUrl = {
+      id: "node-menu-close-tabs-to-right",
+      label: closeTabsToRightLabel,
+      accesskey: "R",
+      disabled: false,
+      click: () => copyToTheClipboard(tab.url)
+    };
+
+    const viewSource = {
+      id: "node-menu-close-all-tabs",
+      label: closeAllTabsLabel,
+      accesskey: "A",
+      disabled: false,
+      click: () => viewSource(tab.url)
+    };
+
     showMenu(e, buildMenu([
       { item: closeTabMenuItem },
       { item: closeOtherTabsMenuItem, hidden: () => tabs.size === 1 },
       { item: closeTabsToRightMenuItem, hidden: () =>
          tabs.some((t, i) => t === tab && (tabs.size - 1) === i) },
-      { item: closeAllTabsMenuItem }
+      { item: closeAllTabsMenuItem },
+      { type: "separator" },
+      { item: copySourceUrl },
+      { item: viewSource }
     ]));
   },

patch 2: connecting the items to panel functions

• this will require adding some modules to m-c
• it's sufficient for this PR to just add the shim modules and we can add the devtools-modules later

https://gist.github.com/jasonLaster/fdae80aad9c6391c98206eee7318b0cd

curl https://gist.githubusercontent.com/jasonLaster/fdae80aad9c6391c98206eee7318b0cd/raw/9f83e83e37c537c13830e7ac1aec15e0c29a64c1/foo.diff | git apply

privileges

• copying to the clipboard
  • there's a clipboardHelper with a simple copyString api
• showing a source
  • the panel function is BrowserViewSourceOfDocument
  • here's where the panel calls BrowserViewSourceOfDocument

Firefox Sources

Chrome Tab

[arthur801031]

@jasonLaster I will take a look at it :)

[jasonLaster]

Great!

Two things:

1. Lets try and land this incrementally - as in lets restrict to first pass to just patch 1 which ignores the panel.
2. I found this article on using the clipboard - https://hacks.mozilla.org/2015/09/flash-free-clipboard-for-the-web/. It should just work for you in the click handler!

[arthur801031]

Hi @jasonLaster

I got patch 1 working, but for the clipboard function, I'm using the copyString function from https://dxr.mozilla.org/mozilla-central/source/devtools/shared/platform/content/clipboard.js, which you provided in your post under the privileges section.

I will make a PR right now. Thank you! :)

[jasonLaster]

Cool. Yea. Let's see it! Was wanting this feature today!

…

On Thu, Dec 8, 2016 at 8:49 PM I-Chun (Arthur) Liu ***@***.***> wrote: Hi @jasonLaster <https://github.com/jasonLaster> I got patch 1 working, but for the clipboard function, I'm using the copyString function from https://dxr.mozilla.org/mozilla-central/source/devtools/shared/platform/content/clipboard.js, which you provided in your post under the *privileges* section. I will make a PR right now. Thank you! :) — You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub <#1336 (comment)>, or mute the thread <https://github.com/notifications/unsubscribe-auth/AAPiYro4LyNSf8pjCJ40InD93nYbzdj9ks5rGPnmgaJpZM4K-a5D> .

[arthur801031]

@jasonLaster

Please check. Thank you!

[jasonLaster]

Closing this issue as we've done the copy source url feature. I'll open a new more focused issue for viewing source later. It's less important though and there's plenty of other work to go around.