I'm using Google Chrome 33.0.1729.3 dev on Linux (elementary os 0.2 based on Ubuntu 12.04)
I create a Chrome App and configured the manifest.json to grant bluetooth permissions:
{
"name": "App Name",
"description": "App Desc",
"version": "0.1.0",
"app": {
"background": {
"scripts": ["background.js"]
}
},
"permissions": ["bluetooth"],
"icons": { "16": "app-icon-16.png", "128": "app-icon-128.png" }
}
when I trigger this script on the app
chrome.bluetooth.getAdapterState( function( result ) {
console.log( result );
});
The result is an undefined
According to the documentation of Google Chrome Apps the method returns an AdapterState object to the callback.
What I'm doing wrong?
Try this:
chrome.bluetooth.getAdapterState( function( result ) {
if (result) {
console.log(result);
} else {
console.log(chrome.runtime.lastError);
}
});
Many of the chrome.* APIs use chrome.runtime.lastError to communicate errors to you. Even though it's not documented at http://developer.chrome.com/apps/bluetooth.html, it might work in this case.
Related
I have a chrome extension I need to access all the iframes on the attached page using the scripting API
{
"manifest_version": 3,
"name": "My example extension",
"version": "0.0.1",
"permissions": ["tabs", "scripting"],
"devtools_page": "devtools.html",
"host_permissions": [
"<all_urls>"
]
}
I can run the script on the inspectedWindow easily enough
// devtools.html -> js
chrome.devtools.panels.create("Sample Panel", "icon.png", "/panel.html", panel => {
// code invoked on panel creation
});
// panel.html -> js
chrome.scripting.executeScript({
target: { tabId: chrome.devtools.inspectedWindow.tabId },
injectImmediately: true,
func: () => {
console.log('foo')
}
})
I want this script to run on the page and all children iframes immediately (before anything else is run, just like a content_script).
It seems this only runs on the host page. When I try to query for child iframes, it doesn't seem to find anything
> await chrome.tabs.query({ windowId: chrome.devtools.inspectedWindow.tabId })
// []
Did I miss a permission?
I would like to use next-auth on a site that has a front-end as well as a backend. That is easy with next-auth, however, I can't figure out a way of authenticating users from a Chrome extension that would communicate with the backend.
The idea is to create data on the site and be able to use it with the Chrome extension for the user that created it.
I can't store secrets on the Chrome extension.
Any ideas?
I have an idea of authenticating users like on TVs and other devices.. they generate a code on the site and insert it on the Chrome extension. Of course, it would be valid for a short time.
But before I go on that road I would like to hear if someone has a better solution.
What worked for me was to make a request from the extension to the next-auth session endpoint: /api/auth/session
If a session doesn't exist, I'll open a new tab with the login page then go from there.
Here's what my manifest.json looks like:
{
"manifest_version": 3,
"name": "Timer Extension",
"version": "1.0.0",
"description": "Hello Chrome World!",
"icons": {
"16": "grin.png",
"48": "grin.png",
"128": "grin.png"
},
"action": {
"default_icon": {
"16": "grin.png",
"24": "grin.png",
"32": "grin.png"
},
"default_title": "Timer Extension Action Title",
"default_popup": "popup.html"
},
"background": {
"service_worker": "authCheck.js"
},
"host_permissions": [
"https://*/"
]
}
Here's the authCheck.js service worker:
chrome.runtime.onMessage.addListener(
function (request, sender, onSuccess) {
console.log("running check")
fetch("<your-domain>/api/auth/session", {
mode: 'cors',
})
.then(response => response.json())
.then((session) => {
if (Object.keys(session).length > 0) {
onSuccess(session)
} else {
onSuccess(null)
}
})
.catch(err => {
console.error(err);
onSuccess(null)
})
return true; // Will respond asynchronously.
}
);
Then in the js file for the default_popup html I have this:
chrome.runtime.sendMessage(
{action: 'AUTH_CHECK'},
(session) => {
if (session) {
//user is logged in
} else {
//no session means user not logged in
chrome.tabs.create({
url: '<link to your login page>'
});
}
}
);
I follow the 'Getting started' tutorial of chrome extensions, but I get the below error.
I search google, somebody say can't access 'executeScript' in content.js, but the error is from popup.js.
I had tried change 'chrome.scripting.executeScript' to 'chrome.tabs.executeScript', it didn't work too.
error image
manifest.json
{
"name": "Getting Started Example",
"version": "1.0",
"description": "Build an Extension!",
"permissions": ["storage", "declarativeContent", "activeTab"],
"background": {
"scripts": ["background.js"],
"persistent": false
},
"page_action": {
"default_popup": "popup.html"
},
"options_page": "options.html",
"manifest_version": 2
}
popup.js
let changeColor = document.getElementById('changeColor')
chrome.storage.sync.get('color', function(data) {
changeColor.style.backgroundColor = data.color;
changeColor.setAttribute('value', data.color)
});
changeColor.addEventListener('click', () =>
chrome.tabs.query({active: true, currentWindow: true}, function(tabs) {
chrome.scripting.executeScript(
tabs[0].id,
{ function: setColor })
})
);
async function setColor() {
let {color} = await chrome.storage.sync.get(['color']);
document.body.style.backgroundColor = color;
};
The whole extension code
reference: chrome developers -> Getting started
The permissions in your manifest.json is missing one item, which is "scripting".
It should look like this:
…
"permissions": ["storage", "declarativeContent", "activeTab", "scripting"],
…
This is actually seen on the Getting Started page here.
You need scripting permissions to access scripting APIs. Add scripting to your manifest.js file.
"permissions": ["scripting", ...]
You either need to migrate to manifest v3 or use chrome.tabs.executeScript instead of chrome.scripting.executeScript
In my case, the exception log "Cannot read property 'executeScript' of undefined" was pretty misleading.
With correct manifests, it happened, and it was because of typo in the to be injected function, like below.
document.body.style.backgrounColor = color;
corrected it to
document.body.style.backgroundColor = color;
and it worked.
Remove and load the extension back! Despite adding "permissions": ["scripting"] this is what I had to do.
I found that chrome.scripting.executeScript works in popup but not in content scripts.
This is a super simple popup example in React. You click on the button and it shows the page title.
export function Popup() {
const [title, setTitle] = useState("");
const onClick = async () => {
const [tab] = await chrome.tabs.query({ currentWindow: true, active: true });
const [res] = await chrome.scripting.executeScript({
target: { tabId: tab.id },
func: () => document.title,
});
setTitle(res.result);
};
return (
<div className="popup">
<button onClick={onClick}>Click</button>
{title}
</div>
);
}
Recently, it is reported that the context menu of my app is vanished. If you remove the app and reinstall it, it works. But the vanishment happens again.
I found an error. I'm not sure if the error causes the vanishment of the context menu. But I'd like to fix this matter, because all I found is this.
This app shows texts you select in a page. When you select texts in an ordinaly page and click browser action button, it works without error. But if you try it on Google Docs, you will get error "Unchecked runtime.lastError: Could not establish connection. Receiving end does not exist".
I'm afraid I don't know what to do with this. And I might have two problems. It'll be great help if you could give me some advice.
[manifest.js]
{
"manifest_version": 2,
"name": "Test Chrome Extension",
"short_name": "Test",
"version": "1.0",
"description": "This is a test.",
"icons": {
"128": "128.png"
},
"content_scripts": [{
"matches": ["<all_urls>"],
"js": ["googleDocsUtil.js", "content_scripts.js"]
}],
"background": {
"scripts": ["background.js"],
"persistent": true
},
"browser_action": {
"default_icon": {
"48": "48.png"
},
"default_title": "Test Chrome Extension"
},
"permissions": [
"contextMenus",
"tabs",
"background",
"http://*/*",
"https://*/*"
]
}
[background.js]
chrome.contextMenus.create({
type: 'normal',
id: 'testchromeextension',
title: 'Test Chrome Extension',
contexts:['selection']
});
chrome.contextMenus.onClicked.addListener(function(info,tab){
if( info.menuItemId == 'testchromeextension' ){
var selectedText = info.selectionText.replace(/ /g, "\n");
doSomething(selectedText);
}
});
chrome.browserAction.onClicked.addListener( function(tab) {
chrome.tabs.query({active: true, currentWindow: true}, function(tabs) {
chrome.tabs.sendMessage(tabs[0].id, {method: "getSelection"}, function(response) {
doSomething(response.data);
});
});
});
function doSomething(selectedText) {
console.log(selectedText);
}
[content_scripts.js]
chrome.runtime.onMessage.addListener( function(request, sender, sendResponse) {
if (request.method == "getSelection") {
var post_val = window.getSelection().toString();
if ( !post_val ) {
var googleDocument = googleDocsUtil.getGoogleDocument();
post_val = googleDocument.selectedText;
}
sendResponse({data: post_val});
}
});
I believe this error is caused when you update the local version of an extension and then try to use the extension with its old/not-updated source code.
The fix: after you reload your local extension at chrome://extensions/, make sure you refresh the page you're using the extension on. You should no longer see the error.
So I'm trying my hand at a google chrome extension which in theory should be extremely straight forward. I know there are tons of stack queries and I've tried a few, I've even copied and pasted direct solutions for testing and I have been unsuccessful. So here is the project. When a page loads, check the html content, and change the icon programmatically.
This is my content.js
chrome.tabs.onUpdated.addListener( function (tabId, changeInfo, tab) {
if (changeInfo.status == 'complete' && tab.active) {
var markup = document.documentElement.innerHTML;
var m = markup.indexOf("candy");
if (m > -1) {
chrome.browserAction.setIcon({path: "check.png"});
} else {
chrome.browserAction.setIcon({path: "cross.png"});
}
}
})
This is my manifest.json
{
"manifest_version": 2,
"name": "Tag Analyzer Plugin",
"description": "Check if tag exist on page",
"version": "1.0",
"browser_action": {
"default_icon": "cross.png"
},
"content_scripts": [
{
"matches": [
"<all_urls>"
],
"js": ["content.js"]
}
],
"permissions": ["<all_urls>"]
}
Right now I'm running this item as a content script because as a content script I can use the logic
var markup = document.documentElement.innerHTML;
var m = markup.indexOf("candy");
if (m > -1) {} else {}
However as a content script the chrome API stuff doesn't work. When I run this script as a background script the script works, except that
var markup = document.documentElement.innerHTML;
doesn't return the pages html, it returns the injected script html.
I've read this stack which was informative as to what the difference was and I've read and tested many stacks like here this, without much success. So obviously i'm missing something and doing something wrong. Thank in advanced for any help.
UPDATES:
So I've made some modifications, but it's still not working, though I think that it's closer to working.
As per the comments below I am now using a content script and background script. No errors are being thrown, however the background script isn't doesn't anything.
content.js
var markup = document.documentElement.innerHTML;
var m = markup.indexOf("candy");
if (m > -1) {
chrome.runtime.sendMessage({"found" : true});
} else {
chrome.runtime.sendMessage({"found": false});
}
background.js
chrome.runtime.onMessage.addListener(
function(request, sender, sendResponse) {
if request.found {
alert("HERE");
chrome.browserAction.setIcon({
path: "check.png",
tabId: sender.tab.id
});
} else {
alert("HERE2");
chrome.browserAction.setIcon({
path: "cross.png",
tabId: sender.tab.id
});
}
});
manifest.json
{
"manifest_version": 2,
"name": "Tag Analyzer Plugin",
"description": "find tag on page",
"version": "1.0",
"browser_action": {
"default_icon": "cross.png"
},
"background": {
"scripts": ["background.js"],
"persistent": false
},
"content_scripts": [
{
"matches": [
"<all_urls>"
],
"js": ["content.js"]
}
],
"permissions": ["<all_urls>"]
}
I've added some alerts on the background.js to see if it was being trigger and nothing, not does the icon change.