This question already has answers here:
Copy to Clipboard in Chrome Extension
(11 answers)
How can I use navigator.clipboard.readText() in a Chrome extension?
(1 answer)
Closed 2 years ago.
I'm trying to achieve a simple action on a Google Chrome extension: when user is on a tab, it could click on the extension icon, and something (like a string) will be copied into its clipboard.
The only thing that I don't know how to deal with in this process is the copy action to the clipboard. Can you help me on this?
What I've done so far:
- added the clipboardWrite permission to my manifest.json
- added the browser_action section to my manifest.json to handle click on the icon extension
- added something like this into my background.js file:
chrome.browserAction.onClicked.addListener((tab) => {
console.log(tab.url);
const string = "something";
// Here I need to add code to copy `string` to clipboard, looking for a way to do it
});
Any help on this would be useful :)
Related
This question already has answers here:
onclick or inline script isn't working in extension
(5 answers)
Closed 3 years ago.
I'm making a chrome extension where the user can press a button and text will get copied to their clipboard. I've written the HTML and Javascript to do this and the code works when I open the HTML file in my browser. The issue is that when I open the extension (running that same HTML file), the button won't copy any text to the clipboard. I do have the permission "clipboardWrite" enabled in my manifest.json file and chrome://extensions also says "Modify data you copy and paste" when I go to details > permissions.
To try to fix the issue, I've reloaded the extension, deleted and re-added the unpacked folder, and restarted my computer; none of which solved my problem. I've also tested it in multiple browsers and it fails to work in all of them.
Here's some code that re-creates the issue I'm getting:
popup.html:
<!DOCTYPE html><html>
<body>
<script>
/*Function that copies text. This works fine in a browser but not in the extension*/
function clip(string) {
const ta = document.createElement('textarea'); //creates a constant of a textarea
ta.value = string; //adds 'string' parameter into the textarea
ta.setAttribute("id", "temptextarea");
document.body.appendChild(ta); //adds an instance of the textarea
ta.select(); //selects the text in the textarea (may be the issue for chrome extension)
document.execCommand('Copy'); //copies the selected text
document.body.removeChild(ta); //removes the instance of the textarea
}
</script>
<!--Button that copies text.-->
<button onclick="clip('This text gets copied')">Copy Text!</button>
</body>
</html>
manifest.json:
{
"manifest_version": 2,
"name": "My Extenstion Name",
"version": "1.0.0",
"permissions": [
"clipboardWrite"
],
"browser_action": {
"default_popup": "popup.html",
"default_title": "My Extension Name"
}
}
When running this code snippet in a browser tab, you'll get the expected result: it will copy "This text gets copied" to your clipboard when you click the button. For whatever reason, when you put those two files into a folder and upload it to chrome://extenstions, the text doesn't get copied to your clipboard. This confuses me because logically, the only reason it wouldn't be able to work in the extension is because of insufficient permissions, but as I stated earlier, it does have permission to write to the clipboard.
Thanks in advance!
The reason this code isn't working is because chrome extensions throw an exception if you use onclick="". You need to use an event listener in this case.
This question already has answers here:
How do I click this link using nightmare?
(2 answers)
Closed 4 years ago.
Here is everything involving the link:
<a class="selected" data-images="{"detail_url":"//assets.supremenewyork.com/148393/ma/hBwFmRXhVKI.jpg","zoomed_url":"//assets.supremenewyork.com/148393/zo/hBwFmRXhVKI.jpg"}" data-style-name="Black" data-style-id="19033" data-sold-out="false" data-description="null" href="/shop/bags/lkav6jh17/xfdbgpiea" data-no-tubolink="data-no-tubolink"><img width="32" height="32" src="//d17ol771963kd3.cloudfront.net/148393/sw/hBwFmRXhVKI.jpg" alt="Hbwfmrxhvki"></a>
I use nightmare with node coded in atom and would like to click on the black bookbag from the url: http://www.supremenewyork.com/shop/bags/lkav6jh17/p9ylgt8vm
using the "data-style-name="Black" found in the elements.
I've tried:
.click("data-style-name ='Black'")
which gave me the error:
Failed to execute 'querySelector' on 'Document': 'data-style-name ='Black'' is not a valid selector.
Not sure what to do to click but any help would be great.
to click what I wanted I did:
.click('a[data-style-name="Tan"]')
It was an attribute so i needed to specify that.
I have a created a desktop notification using google extension which works great:
icon = '';
var popup = window.webkitNotifications.createNotification(my notification');
icon, 'Awesome title', 'Click here to view more. ');
popup.show();
Is there a way to launch the actual google extension popup.html (as shown on the image below), when the user click on the the desktop notification?
Thanks.
Short answer is that you can't, but if you want to open the popup in a new tab instead, this is how you would do it:
Put this before you call show
popup.onclick = function() {
chrome.tabs.create({url : "popup.html"});
popup.cancel();
}
I wanted to add to the comment that Miscreant posted.
One approach that might work would be to setup a keyboard shortcut for
the pop up in the extension's manifest, then use an executable file to
artificially trigger that keyboard shortcut. See Native Messaging for
more info about how to communicate with an executable file from an
extension
This is how you set up a shortcut key that opens your extension.
...
"commands": {
"_execute_browser_action": {
"suggested_key": {
"default": "Ctrl+Shift+Y"
}
}
Here's the API on 'commands'.
I want to build a chrome extension that hides a specific div (with id) from page on load.
I want to know how to edit the source?
Just use jQuery, and write this code in your content script:
$("#you_div_id").hide();
It's so easy：）
This question already has answers here:
"Cannot read property of undefined" when using chrome.tabs or other chrome API in content script
(4 answers)
Closed 1 year ago.
I tried to look for this in the chrome documentation but I didn't see anything, especially in the "Security" section in the chrome.tabs documentation. The typical approach in examples I've seen is to send a message to the background page. The background page then calls chrome.tabs.executeScript(). If I can do it from the content script that would be a little easier.
Content scripts cannot call any Chrome API methods except couple from chrome.extension.* package.
Unless you are doing this to save content script filesize, why not just have that code you are planning to execute in a content script from the beginning?