I've seen a bunch of posts about this question, but none of the solutions seem to have worked for me. I have a simple manifest with a background, popup.html, and popup.js. It looks like the script isn't doing anything (just trying to get an alert). I'm trying to figure out if there's something I'm missing somewhere (and hoping I haven't just made a really stupid mistake).
manifest.json
{
"name": "ext",
"version": "1.0",
"description":"ext",
"permissions": ["declarativeContent", "activeTab"],
"background": {
"scripts": ["background.js"],
"persistent":false
},
"browser_action": {
"default_popup": "popup.html",
"default_icon": {
"16": "16_px_icon.ico"
}
},
"icons": {
"16": "16_px_icon.ico"
},
"manifest_version": 2
}
background.js
chrome.runtime.onInstalled.addListener(function() {
chrome.storage.sync.set({saves:[]} );
});
chrome.declarativeContent.onPageChanged.removeRules(undefined, function() {
chrome.declarativeContent.onPageChanged.addRules([{
conditions: [new chrome.declarativeContent.PageStateMatcher({
pageUrl: {hostEquals: 'developer.chrome.com'},
})
],
actions: [new chrome.declarativeContent.ShowPageAction()]
}]);
});
popup.html
<!DOCTYPE html>
<html>
<head>
<style>
button {
height: 30px;
width: 60px;
outline:none;
}
</style>
<script type="text/javascript" scr="popup.js" ></script>
</head>
<body>
<input type="text" id="Fd">
<button id="Btn">
Search</button>
<span id="Msg"></span>
</body>
</html>
popup.js
function search() {
alert('A')
}
window.onload = function() {
//document.getElementById('Btn').addEventListener('click', search); tried this
document.getElementById('Btn').onclick = search;
}
Related
I'm trying to develop a google chrome extension which can block specific URL. For this with the help of google I've made following code, but the code is not work perfectly.
The code :
manifest.json
{
"manifest_version": 2,
"name": "Zitu-LinkBlocker",
"description": "A link blocker extension!",
"permissions": [
"tabs"
],
"version": "1.0",
"icons": {
"128": "icon128.png",
"48": "icon48.png",
"16": "icon16.png"
},
"browser_action": {
"default_icon": "icon16.png",
"default_popup": "popup.html"
}
}
popup.js
$(document).ready(function() {
chrome.tabs.query(null, function (tab) {
var link = document.createElement('a');
link.href = tab.url;
$('#host').html("Host : "+link.hostname);
})
});
popup.html
<!doctype html>
<html>
<head>
<title>Getting Started Extension's Popup</title>
<style>
body {
min-width: 357px;
overflow-x: hidden;
}
</style>
<script src="jquery-3.5.1.min.js"></script>
<script src="popup.js"></script>
</head>
<body>
Yo Man
<div id="host"></div>
</body>
</html>
I think you need to pass { active: true, currentWindow: true } instead of null in chrome.tabs.query method. The tab parameter inside the callback will be an array and you need to access the URL using tab[0].url.
manifest.json
{
"manifest_version": 2,
"name": "Zitu-LinkBlocker",
"description": "A link blocker extension!",
"permissions": [
"tabs"
],
"version": "1.0",
"browser_action": {
"default_popup": "popup.html"
}
}
popup.html
<!doctype html>
<html>
<head>
<title>Getting Started Extension's Popup</title>
<style>
body {
min-width: 357px;
overflow-x: hidden;
}
</style>
<script src="jquery.min.js"></script>
<script src="popup.js"></script>
</head>
<body>
Yo Man
<div id="host"></div>
</body>
</html>
popup.js
$(document).ready(function () {
chrome.tabs.query({ active: true, currentWindow: true }, (tab) => {
console.log(tab)
var link = document.createElement('a');
link.href = tab[0].url;
$('#host').html("Host : " + link.hostname);
});
});
Total newbie here.
I'm trying to create a very simple chrome extension. Its main functionality is to change its BadgeText depending on some API endpoint response. I want to check the endpoint every 5 seconds so I want to run it in the background. Here is what I've got:
manifest.json:
{
"manifest_version": 2,
"name": "BusyIndicator",
"description": "busy indicator",
"version": "1.0",
"background": ["background.js"],
"browser_action": {
"default_icon": "icon.png",
"default_popup": "popup.html"
},
"permissions": []
}
popup.html:
<!doctype html>
<html>
<head>
<title>BusyIndicator</title>
<script src="popup.js"></script>
</head>
<body>
<h3>nothing here yet</h3>
</body>
</html>
popup.js is just an empty file right now
background.js:
setInterval(function() {
fetch('https://toiletbusy.herokuapp.com/')
.then(function(response) {
if (response.json.busy == false) {
chrome.browserAction.setBadgeText({text: 'BUSY'});
} else {
chrome.browserAction.setBadgeText({text: 'FREE'});
};
});
}, 5000);
I tried different things but it looks like background.js is not getting executed at all (e.g. console.log does not log anything)
I am trying to open a new tab from a chrome extension. I searched here but nothing I've found seem to solve this.
I simply want it to open a tab on a button click.
manifest
{
"manifest_version": 2,
"name": "TestExtension",
"description": "La LA LA",
"version": "1.0",
"browser_action": {
"default_icon": "img/icon.png",
"default_popup": "popup.html"
},
"background": {
"scripts": ["background.js"]
},
"permissions": [
"activeTab",
"tabs"
]
}
popup.html:
<!DOCTYPE html>
<html>
<head>
...
</head>
<body>
<div id="main" class="container">
<button class="btn btn-success" id="doItBtn">Do it NOW!
</body>
</html>
background.js
document.addEventListener('DOMContentLoaded', function () {
var btn = document.getElementsById("doItBtn");
btn.addEventListener('click', function () {
chrome.tabs.create({active: true, url: "http://www.ynet.co.il"});
});
});
I tried not putting the code in a backgorund.js but simple script tag instead but didn't work to.
What did I do wrong?
Regards,
Ido
Here is my manifest
{
"manifest_version": 2,
"name": "test",
"description": "test",
"version": "1.0",
"permissions": [
"activeTab",
"tabs"
],
"browser_action": {
"default_popup": "index.html"
},
"background": {
"scripts": ["background.js"]
}
}
In my index.html I have:
<html>
<head>
<script src="jquery.min.js"></script>
<script src="script.js"></script>
</head>
<body>
<div class="container">
</div>
</body>
</html>
and in my script.js I have:
var Chat = function( username, avatar) {
username = username || "";
/// more lines
}
Is there a way I call the Chat(index.html) in my backround.js
ex:
chat = new Chat("john", "");
A more generic question would be: How does popup and background can speak together ? With messaging ? any available sample ?
Just trying to create a simple tab and I cannot get it to work. Any ideas what I am doing wrong?
manifest.json
{
"manifest_version": 2,
"browser_action": {
"default_icon": {
"19": "logo_19.png"
},
"default_title": "Test Suite",
"default_popup": "main.html"
},
"description": "Test Suite Description",
"icons": {
"128": "icon_128.png",
"16": "icon_16.png"
},
"name": "Test Suite",
"permissions": ["http://www.google.com/"],
"version": "1.0"
}
main.html
<html>
<head>
<script type="text/javascript" src="popup.js">
</script>
</head>
<body>
<div id="menu-items-ui">
<div id="registration">
Google Search
</div>
</div>
</body>
</html>
popup.js
<script type="text/javascript">
document.addEventListener('DOMContentLoaded', function() {
var registration = document.getElementById('registration');
registration.addEventListener('click', function() {
chrome.tabs.create({ url: 'http://www.google.com' });
});
});
</script>
It is not going to the google site.
Thanks in advance.
You have html in your javascript file, remove it
popup.js
document.addEventListener('DOMContentLoaded', function() {
var registration = document.getElementById('registration');
registration.addEventListener('click', function() {
chrome.tabs.create({ url: 'http://www.google.com' });
});
});