Firefox JS Extension | How do I access the new tab and the homepage of Firefox to inject my new page? - javascript

I've been following many Firefox addon / extension examples and searched the "tab" documentation; however, I still haven't found how to use my newly created index.html page as a new tab or homepage for Firefox.
I want to create something like Momentum. A personal dashboard for Firefox.
This is what I have until now. However, because I'm creating a new tab on tabs.onCreated, I'm creating an infinite loop in new tabs.
Manifest.json
{
"description": "Adds browser action icon to toolbar to open packaged web page. See https://developer.mozilla.org/en-US/Add-ons/WebExtensions/Examples#open-my-page-button",
"manifest_version": 2,
"name": "Bookify",
"version": "1.0.0",
"homepage_url": "https://github.com/mdn/webextensions-examples/tree/master/open-my-page-button",
"icons": {
"48": "icons/border-48.png"
},
"background": {
"scripts": ["background.js"]
},
"browser_action": {
"default_icon": "icons/border-48.png"
},
"web_accessible_resources": [
"images/*.jpg",
"videos/*.mp4"
]
}
Background.js
function openMyPage() {
browser.tabs.create({
"url": "/dash.html"
});
}
browser.tabs.onCreated.addListener(openMyPage);

Thanks to Ramkumar K R's answer on this question, I implemented the following inside my manifest.json:
"chrome_url_overrides" : {
"newtab": "index.html"
}
So if anyone wants to know how to change the newtab page in Firefox, use chrome_url_overrides. Because the referred question has not been officially "answered", I'm gonna leave this question and answer it myself so other developers can find their answer here.

Related

When the Chrome extension is turned off and turned on after that, rendering may fail again. react.js

Actually, I also asked a question yesterday.
But I think the information is a bit weak, so I upload the manifest code together.
I know that the Chrome extension closes when you click on the current window(not popup, in your current Tab window).
But sometimes when i open the extension again after closing the pop-up window, the previous state is maintained(Ex... folder open or already checked).
But if it doesn't keep going, but it changes state(meaning setState in react), pop-ups become renderings from the beginning.
So there are times when I'm surprised when I'm using it.
I have also touched runtime and now I import the chrome API from another folder and use it. So even if I try to use runtime, I don't know what part of the react to run and let it go.
I've seen the use of blur, but I don't know how to apply it to react.
I beg you. I've been thinking about it a lot and trying, but I don't know how.
This is my extension.
https://chrome.google.com/webstore/detail/youtube-time-marker/ojcfdbijjnikepmkacfjibnbonecgmpj?hl=ko
https://www.youtube.com/watch?v=uMBQ1859IRw
manifest.js
{
"version": "1.0",
"name": "__MSG_appName__",
"description": "__MSG_appDesc__",
"default_locale": "en",
"permissions": ["storage","activeTab","declarativeContent","http://*/*", "https://*/*","*://*/*"],
"browser_action": {
"default_popup": "index.html",
"default_icon": "iconBox/ytm128.png"
},
"icons": {
"128": "iconBox/ytm128.png",
"48": "iconBox/ytm48.png",
"16": "iconBox/ytm16.png"
},
"commands": {
"_execute_browser_action": {
"suggested_key": {
"default": "Ctrl+Shift+V",
"linux": "Ctrl+Shift+V",
"windows": "Ctrl+Shift+V",
"mac": "Command+Shift+V"
}
}
},
"manifest_version": 2
}
After all, all I want is
When the extension is closed,
There's no previous state left.
And when I turned it on again,
React must be rendered again.

Creating a simple Firefox Toolbar button

I'm trying to create a very basic Firefox plugin for personal use that runs a JavaScript file upon being clicked. I've done some reading on the documentation, but I just want a straightforward button.
My manifest file looks like this:
{
"manifest_version": 2,
"name": "Simple Button",
"version": "1.0",
"description": "A simple button that runs a script",
"icons": {
"48": "./icons/48ico.png"
},
"permissions":[
"activeTab"
],
"browser_action": {
"default_icon": {
"48": "./icons/48ico.png"
},
"default_title": "Clicked",
"default_popup":"popup/runscript.html"
}
}
What would I need to put into runscript.html to run a script that operates on the current tab when the button is clicked? Otherwise, do I need to modify my manifest in any way to do this? I was following the "Writing your second extension" document, but it didn't run any of my code.

window.open in background.js in firefox extension?

I am converting a working chrome extension to a firefox extension. In the extension, it calls window.open() in the background.js. However, it is not working in my firefox version, and I have tested that everything else is working fine, and it is just not window.open'ing.
I read online that it could be due to a security issue? How do I adjust the security settings so it will be able to run, and how do I notify the user to?
manifest.json
{
"manifest_version": 2,
"name": "Instagram Liker",
"description": "Instagram Liker",
"version": "1",
"icons": {
"16": "icon16.png",
"48": "icon48.png",
"128": "icon128.png"
},
"content_scripts": [
{
"matches": [
"<all_urls>"
],
"js": [
"js/custom.js"
]
}
],
"background": {
"scripts": [
"js/background.js"
]
},
"browser_action": {
"default_popup": "popup.html"
}
}
The window.open is just being called in a function in the background.js, I don't think I need to post that code.
More than likely popup blocker is blocking the window from opening, make sure you allow pop-up windows in the permissions of the website you are trying to call window.open() on.
I encounter exactly the same problem, solution is to not use
window.open("yourUrl")
but instead use method provided only for browser extensions
browser.windows.create({url: ""yourUrl""});
With this solution you can be sure your event page won't be blocked by any popup blocker.
It worked for me without the double "":
browser.windows.create({url: yourUrl});

Chrome Extension Content Script Injection..background color of page not changing

Background page is not changing when I click on extension button.
Here are some examples that I tried, but none of them seem to work. Note: The newly injected scripts must be able to talk back and forth with the background-scripts.
manifest.json
{
"manifest_version": 2,
"name": "calender",
"description": " pop up app demo",
"version": "1.0",
"browser_action": {
"default_icon": "icon-64.png"
},
"background":{
"scripts": ["background.js"]
},
"permissions": ["tabs", "http://*/*"],
"icons" : {
"64" : "icon-64.png",
"128" : "icon-128.gif"
}
}
background.js
chrome.browseAction.onClicked.addListener(
function(tab)
{
chrome.tabs.executeScript(null,{code:"document.body.bgColor='yellow'"});
});
Change the code like this:
chrome.tabs.executeScript(null,{code:"document.body.style.backgroundColor='yellow'"});
You can find a similar sample extension here. It changes the background color of a page. I'm sure it will help you if you encounter more issues.

Trouble with simple Google Extension [duplicate]

This question already has an answer here:
Insert code into the page context using a content script
5 answers
I'm having trouble getting a simple google extension to work. The manifest file looks like this:
{
"background": {"scripts": ["background.js"]},
"browser_action": {
"default_icon": "icon-128.png",
"default_title": "Lookup"
},
"name": "Lookup",
"description": "Does stuff",
"homepage_url": "http://www.artifacting.com",
"icons": {
"16": "icon-16.png",
"48": "icon-48.png",
"128": "icon-128.png" },
"permissions": [
"tabs",
"http://*/*",
"https://*/*"
],
"version": "0.1",
"manifest_version": 2
}
my background.js simply points to my bookmarklet.js
background.js:
chrome.browserAction.onClicked.addListener(function(tab) {
chrome.tabs.executeScript(tab.id, {file: "bookmarklet.js"})
});
bookmarklet.js
setTimeout('x99.focus()',300);var re=/([/-]|li[er]n=)(d{2,3}[dX])/i;if(re.test(location.href)==true){var isbn=RegExp.$2;var x99=window.open('http://catalog.mywebsite.org/search/searchresults.aspx?ctx=1.1033.0.0.6&type=Keyword&term='+lookup,'Lookup','scrollbars=1,resizable=1,top=0,left=0,location=1,width=800,height=600');x99.focus();}
I'm unsure why when i click on the extension an new window isn't opening up. I'm pretty sure that the setTimeout command isn't working with the chrome exstensions but I'm not sure how to rewrite it correctly. Thanks for your help.
setTimeout works just fine with both injected scripts and background page. You bookmarklet.js is not correct or not complete. It shows error:
Uncaught TypeError: Cannot call method 'focus' of undefined
Anyway check webpage and background page consoles for errors first. This saves you a lot of time

Resources