Why does my browser extension do nothing on page load (except in the toolbox)? - firefox-addon

I've been trying to make a Firefox extension. I've had success with doing stuff after a user interaction (like a browser action). But I want my extension to do something without user interaction. But no matter what I do, I can't get anything to happen on page load. Here is my super reduced code:
manifest.json
{
"name": "Test",
"version": "0.1",
"manifest_version": 2,
"background": {
"scripts": ["test.js"]
}
}
test.js
document.addEventListener("DOMContentLoaded", init);
function init() {
document.body.innerHTML = "Hello world!";
}
What am I doing wrong here? It works in the toolbox, just not anywhere else!
I've also tried adding host permissons like this:
"permissions": [
"*://*.facebook.com/*"
],

Try this:
manifest.json
{
"name": "Test",
"version": "0.1",
"manifest_version": 2,
"background": {
"scripts": ["background.js"]
},
"permissions": ["webNavigation", "*://*.facebook.com/*"]
}
background.js
browser.webNavigation.onDOMContentLoaded.addListener(handleOnDOMContentLoaded, {
url: [{ hostEquals: 'www.facebook.com' }],
});
function handleOnDOMContentLoaded({ tabId }) {
browser.tabs.executeScript(tabId, { file: 'test.js' });
}
test.js
document.body.innerHTML = 'Hello world!';

Related

Extjs 6.7 TreeList load data infinite from remote store

I try to fill a treelist with remote data via a ajax proxy but the treelist shows only the first level and try to reload the sub levels even though the json response contain a complete tree structure. Fiddle link: https://fiddle.sencha.com/#view/editor&fiddle/33u9
When i try to expand the node 'SUB a' (or set the expanded property to true) the store trys to reload the node.
Why is the tree structure from the json response not honored?
Thanks in Advance.
The backend response looks like:
{
"data": {
"root": [
{
"leaf": true,
"text": "Server"
},
{
"leaf": true,
"text": "Storage"
},
{
"text": "SUB a"
"children": [
{
"leaf": true,
"text": "Modul A - 1"
},
{
"leaf": true,
"text": "Modul A - 2"
}
],
},
{
"leaf": true,
"text": "Modul B"
}
]
},
"success": true
}
The used reader config is
reader: {
type: 'json',
rootProperty: 'data.root',
successProperty: 'data.success',
},
After playing around i use the following workaround:
getNavigation: function() {
var me = this,
tree = me.getView().down('navigationtree'),
store = tree.getStore(),
node = store.getRoot();
Ext.Ajax.request({
url: '/getnav',
method: 'POST',
success: function(response) {
var obj = Ext.decode(response.responseText),
childs = obj.data.root;
tree.suspendEvents();
node.removeAll();
childs.forEach(function(item) {
node.appendChild(item);
});
tree.resumeEvents();
},
failure: function(response) {
//debugger;
console.log('server-side failure with status code ' + response.status);
}
}).then(function() {
//debugger;
}
);
}
The funny things is that only the first level of the tree has to be added all following sub-levels are added automaticaly.

Autopilot redirect to new task not working correctly

So, I've been working with Autopilot tasks for a little here since the patch when you no longer need to build, and I've seen that when I get to the second redirect to another task and when that task listens, it just fails to listen and it goes back to its fallback task.
I've tried to not use a function between the redirect and such, I've used a direct post to my Twilio function, and none of that works. I do have a questionnaire of two questions, and the complete label is a redirect, and that is where my tasks start to fail.
"actions": [
{
"say": {
"speech": "I just have a few questions"
}
},
{
"collect": {
"name": "questions",
"questions": [
{
"question": "Is the weather nice today",
"name": "q_1",
"type": "Twilio.YES_NO",
},
{
"question": "Do you like ice cream?",
"name": "q_2",
"type": "Twilio.YES_NO",
}
],
"on_complete": {
"redirect": "MY FUNCTION LINK"
}
}
}
]
}
Then the function will return this as a JSON:
responseObject = {
"actions": [
{
"redirect": "task://MY TASK"
}
]
};
Then the tasks goes like this:
{
"actions": [
{
"say": "Would you like to be transfered over, or be called later?"
},
{
"listen": {
"tasks": [
"transfer",
"calllater"
]
}
}
]
}
But the tasks that as being listened to never completes, and my logs seem like the task that called it does not exist.
The task should go to the correct tasks that are being listed to, but it just crashes and goes back to the fallback task. I have to idea why this does not work, please let me know.
Twilio developer evangelist here. 👋
I just took the code you posted and adjusted it and it works fine. Let me tell you what I did.
I created a welcome task
// welcome task
{
"actions": [
{
"say": {
"speech": "I just have a few questions"
}
},
{
"collect": {
"name": "questions",
"questions": [
{
"question": "Do you like ice cream?",
"name": "q_2",
"type": "Twilio.YES_NO"
}
],
"on_complete": {
"redirect": "https://picayune-snout.glitch.me/api/collect"
}
}
}
]
}
This tasks defines similar to your example an on_complete endpoint which I hosted on Glitch. The endpoints responds with JSON which looks like this.
module.exports = (req, res) => {
res.setHeader('Content-Type', 'application/json');
res.send(JSON.stringify(
{
"actions": [
{
"say": {
"speech": "Thanks for you information"
}
},
{
"redirect": "task://continue"
}
]
}
));
}
Then, I defined the continue task similar to yours:
{
"actions": [
{
"say": "Would you like to be transfered over, or be called later?"
},
{
"listen": {
"tasks": [
"transfer",
"calllater"
]
}
}
]
}
calllater and transfer only use say and it works fine. Important piece is that you define samples for these two tasks so that the system can recognize them. Also you have to rebuild the model for the Natural Language Router.
Hard to tell what you did wrong. :/

browser.runtime.connect api not working as expected with Firefox for android?

I am developing an extension for Firefox for Android, but since tabs APIs are not supported on Firefox(Android), I am using the following code. It is working fine on Firefox but when porting it to Firefox Android(52 version), background script messages are not being passed to content script listener.
//Content script code
var myPort = browser.runtime.connect({name:"port-from-cs"});
myPort.postMessage({greeting: "hello from content script"});
myPort.onMessage.addListener(function(m) {
console.log("In content script, received message from background script: ");
console.log(m.greeting);
});
// background script
var portFromCS;
function connected(p) {
portFromCS = p;
portFromCS.postMessage({greeting: "hi there content script!"});
portFromCS.onMessage.addListener(function(m) {
console.log("In background script, received message from content script")
console.log(m.greeting);
portFromCS.postMessage({greeting: "hi there content script!"});
});
}
browser.runtime.onConnect.addListener(connected);
//manifest
{
"version": "0.1.5",
"content_scripts": [
{
"js": [
"js/myContentScript.js",
"js/lib/jquery-1.9.1.min.js"
],
"matches": [
"<all_urls>"
],
"run_at": "document_start"
}
],
"description": "xxx",
"manifest_version": 2,
"name": "xx",
"applications": {
"gecko": {
"id": "vpt#mozilla.org"
}
},
"permissions": [
"webRequest",
"notifications",
"http://*/",
"https://*/",
"storage",
"webRequestBlocking"
],
"background": {
"scripts": [
"js/background.js"
]
},
"web_accessible_resources": [
"xxx.js"
]
}
content script is passing the message to background script, but background script messages are caught by portFromCS.onMessage listener. Is my approach correct?

Firefox Add-on enable CORS domain request

I'm developing a Firefox Add-on, i'm failing to send request from popup script. it is showing some error
Error: Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource
In chrome extension working fine.
Popup script
$.ajax({
url: 'http://localhost/api/user/66f041e16a60928b05a7e228a89c3799/emailtemplate/c60d870eaad6a3946ab3e8734466e532',
type: 'GET',
dataType: 'json',
headers: { 'accessToken': 'Krc7YPoZPaYiy37O', 'appID': '28fdd9c013e37bca7dd875b10817b694', 'appSecret': '15798907115476fdf1de7a8' },
success: function(eventSettingsResponse) {
buildTemplate(eventDetailsResponse, eventSettingsResponse);
console.log('This is content script testing...', eventDetailsResponse);
},
error: function() { }
//beforeSend: setHeader
});
Package.json
{
"title": "First",
"name": "test",
"version": "0.0.1",
"description": "Just for testing",
"main": "index.js",
"author": "Bharath",
"engines": {
"firefox": ">=38.0a1",
"fennec": ">=38.0a1"
},
"permissions": {
"cross-domain-content": ["http://localhost/*"]
},
"license": "MIT"
}
Main.js
pageMod.PageMod({
include: ["https://mail.google.com/*"],
contentScriptFile: data.url("js/content.js"),
contentScriptWhen: 'end',
onAttach: function(worker) {
worker.port.emit("init", urls);
worker.port.on("showPopup", function() {
console.log('port received');
windows.open(data.url('popup/popup.html'), {
name: 'jetpack window',
features: {
width: 500,
height: 500,
popup: false
}
});
});
worker.port.on("returnHtml", function() {
console.log('Html returnde.');
});
}
});
I read here that I could add the following to package.json
"permissions": {
"cross-domain-content": ["https://data.com"]
}

Jstree - Add nodes to tree by user input (button click)

I have a ASP.NET MVC 4.0 project using JsTree. The JsTree is being populated thought a model that returns a JSON.
Now my problem is this, i have a huge tree that makes the user experience pretty bad. What i need is to load a few items (let'say 20), and have a button that when clicked by the user add's the next 20 records to the tree.
I have been searching in Google JsTree documentation and SO, but i haven't found a example that works for me.
Can anyone help me?
Thanks in advanced.
Ok, some break trought. I kind of got this working. In my view the user input call this function:
function getNextRecords() {
var new_data = { "attr": { "ID": "999999999999", "NodeText": "999999999999" },
"data": "999999999999",
"children": [{
"attr": { "ID": "ACT99", "NodeText": "969994222" },
"data": "969994222 - PPP",
"children": [{
"attr": { "ID": "TRFps800", "rel": "disabled" },
"data": "Voz com unlimited 800 fidelização até 01/11/2019",
"state": "open"
}],
"state": "open"
}], "state": "open"
};
var retDom = $.jstree._reference("#demoTree")._parse_json(new_data, -1, true);
$("#demoTree").jstree("move_node", retDom, -1, "inside", false, false, true);
}
This is working fine, expect that the parse json creates a "ul" instead of a "li" any ideas in how to change that?
OK, i finally got this working, this is the final version of my Function i hope this helps someone.
function getNextRecords() {
var new_data = { "attr": { "ID": "999999999999", "NodeText": "999999999999" },
"data": "999999999999",
"children": [{
"attr": { "ID": "ACT99", "NodeText": "969994222" },
"data": "969994222 - PPP",
"children": [{
"attr": { "ID": "TRFps800", "rel": "disabled" },
"data": "Voz com unlimited 800 fidelização até 01/11/2019",
"state": "open"
}], "state": "open"
}], "state": "open"
};
var ref = $("li ul:first")
var retDom = $.jstree._reference("#demoTree")._parse_json(new_data, ref, true);
$("#demoTree").jstree("move_node", retDom, ref, "first", false, false, true);
}
This add a new child after the first UL.
The second part "load part of the branch and with another load of the same branch
load more" is exactly what i'm trying to do but i have not yet succeeded, is it
possible to have an example?
Such task must be taken care of on server side. Take is this way: jsTree only displays whatever is passed to it. So you make a decision what to load in a first go and you can have a button (to reload the whole tree or a branch only) to load more or replace whatever was loaded. Don't forget the logic has (almost) nothing to do with jsTree.

Resources