hansifer / tab-copy

A browser extension that copies tabs to the clipboard in a variety of formats.

Tab Copy

A browser extension for copying tabs to the clipboard in a variety of formats

 

 

Available for Chrome

Developing

Setup

1. Ensure you're on Node.js version 18 or newer
2. Run npm install
3. Run npm run dev to generate build folder output
4. Open chrome://extensions/
5. Ensure Developer mode is toggled on
6. Click Load unpacked and select the build folder

Running

npm run dev

Debugging

Access the popup or options page directly with:

• chrome-extension://replaceWithExtensionId/popup.html
• chrome-extension://replaceWithExtensionId/options.html

Known issues

• npm run dev fails to:
  • copy all /public files to /build (/icons and some /img files are missed)
  • output pages listed in vite config's build.rollupOptions.input

Tech notes

This project was scaffolded with create-chrome-ext

Direct DOM calls vs React

The popup is implemented with static HTML and vanilla JS/direct DOM calls. The original intent was to optimize load speed, but the ultimate performance benefit and maintenance tradeoffs are open to question.

The options page is implemented in React for better maintainability and support for complex interactions like drag-drop list re-ordering.

tab-copy's Issues

Keyboard shortcut for second format

I use this extension a lot, mainly to grab formatted links to put in emails and other messages but occasionally I need it in Markdown format instead. I mostly use a keyboard shortcut for getting the formatted link but in order to get it in my second format I have to use the context menu, etc. It would be great if I could bind the 2nd format to a keyboard shortcut too (e.g. Shift+Option+C on my macOS to accompany Option+C which I use for the first format). Thank you.

Add support for "text/html"

I really like this extension and I use it frequently for copying links to be used in StackOverflow and other places that accept various kinds of markup, etc. The one place where it is a bit of a pain to use is when I am composing an email, document, etc. that support rich text.

TabCopy Options supports various "text/plain" formats but what I want is "text/html" format too so that when I paste my data into a document I get "Example Domain" instead of "Example Domain".

This can be done by setting additional clipboard data in addition to the plain text:

function copy(text, url) {
  document.oncopy = function(event) {
    event.clipboardData.setData('text/plain', text);
    event.clipboardData.setData('text/html', '<a href="' + url + '">' + text + '</a>');
    event.preventDefault();
  };
  document.execCommand('copy');
}

copy('http://www.example.com/', 'Example Domain')

Here's a live demo: https://jsfiddle.net/L40a2h4s/3/

Can support for this be added?

Thanks.

Customize plain-text separate from html

I love the "Link" format… well, except for when I'm pasting to somewhere that doesn't support rich text. Is there a way to make "Link" fallback to "Markdown" for plain text?

e.g.

instead of

public.html:<meta charset='utf-8'><a href="https://www.google.com/">Google</a>
public.utf8-plain-text:Google

I want

public.html:<meta charset='utf-8'><a href="https://www.google.com/">Google</a>
public.utf8-plain-text:[Google](https://www.google.com/)

that when we I paste into apps like Notion, GitHub, etc. that support Markdown it will get linkified, etc.

thanks!

GitHub behind Chrome Web Store

I wanted to see if I could add a feature to TabCopy but it looks like the version in the Chrome Web Store is out of sync with this repo. Is the source for that version elsewhere?

Add possibility to set shortuct

I'd be really helpful to be able to add shortcut for TabCopy. Chrome already provides UI for that, so it shouldn't be too difficult.