Develop Reference

Accessing the console log commands via chrome extension

I'm looking to override the existing console commands via my Chrome extension - the reason for this is I wish to record the console logs for a specific site.
Unfortunately I cannot seem to update the DOM, this is what i've tried so far:
// Run functions on page change
chrome.tabs.onUpdated.addListener( function (tabId, changeInfo, tab) {
var s = document.createElement('script');
// TODO: add "script.js" to web_accessible_resources in manifest.json
s.src = chrome.runtime.getURL('core/js/app/console.js');
s.onload = function() {
this.remove();
};
(document.head || document.documentElement).appendChild(s);
});
console.js
// Replace functionality of console log
console.defaultLog = console.log.bind(console);
console.logs = [];
console.log = function(){
console.defaultLog.apply(console, arguments);
console.logs.push(Array.from(arguments));
};
// Replace functionality of console error
console.defaultError = console.error.bind(console);
console.errors = [];
console.error = function(){
console.defaultError.apply(console, arguments);
console.errors.push(Array.from(arguments));
};
// Replace functionality of console warn
console.defaultWarn = console.warn.bind(console);
console.warns = [];
console.warn = function(){
console.defaultWarn.apply(console, arguments);
console.warns.push(Array.from(arguments));
};
// Replace functionality of console debug
console.defaultDebug = console.debug.bind(console);
console.debugs = [];
console.debug = function(){
console.defaultDebug.apply(console, arguments);
console.debugs.push(Array.from(arguments));
};
The script runs successfully with an alert().
The goal for me is to access console.logs - but its undefined which means I haven't gotten access to the DOM, despite injecting a script.
If not possible, even a third party integration would be helpful i.e. Java or C?
Any thoughts would be greatly appreciated :)

I found this post and I think Tampermonkey injects a script with the immediate function that you add in the Tampermonkey Chrome extension page, I found something similar in extensions like Wappalyzer, and looks good and safe, you could use WebRequest to inject to your website the new "polyfill" before the page is fully loaded as the post says.
Here the example of Wappalyzer that I mentioned before, this is the JS load in StackOverflow with Wappalyzer using the code injection, I didn't test it with Tampermonkey yet
EDIT
Checking Wappalyzer, how to inject the code is the easy part, you can use (Wappalyzer github example):
const script = document.createElement('script')
script.setAttribute('src', chrome.extension.getURL('js/inject.js'))
This probably will not fix your problem, this code is executed after all the content was loaded in the DOM. But, you can find how to fix that problem in this post
I'll suggest to use onCommitted event (doc1/doc2)
Using the mozilla.org example you will have something like
const filter = {
url: //website to track logs
[
{hostContains: "example.com"},
{hostPrefix: "developer"}
]
}
function logOnCommitted(details) {
//Inject Script on webpage
}
browser.webNavigation.onCommitted.addListener(logOnCommitted, filter);

It might be worth trying to redefine the entire console object:
const saved = window.console
window.console = {...saved, log: function(...args){ saved.log("Hello", ...args) }}
But it's probably impossible, because content scripts live in an isolated world:
Isolated worlds do not allow for content scripts, the extension, and the web page to access any variables or functions created by the others. This also gives content scripts the ability to enable functionality that should not be accessible to the web page.
Although in Tampermonkey this script works.
I believe Tampermonkey handles this by knowing the subtleties and tracking changes in the extensions host's protection mechanism.
BTW, for small tasks, there is a decent alternative to chrome extensions in the form of code snippets.

Meteor method not working properly in mozilla

I am trying to make a call to a meteor method, to insert a document before redirecting the user to the relevant url (using the generated document _id).
The code currently works on chromium but not on firefox, where on firefox it appears to just get redirected right away without actually inserting anything.
I've attached my code at the bottom. Can anyone tell me what went wrong and what can I do to fix it? Why will chrome and firefox behave differently in this situation?
Any help provided is greatly appreciated!
client.js
newDoc(){
Meteor.call('addDoc',{
// some parameters
})
}
clientandserver.js (Meteor method)
'addDoc'(obj){
console.log(obj); // does not output anything on firefox
DocumentData.insert({
//some parameters
},function(err,documentID){
if (Meteor.isClient){
window.location = '/docs/' + documentID;
// redirection happens before insertion on firefox
}
});
}

Bring window.location to the client side. Like:
newDoc(){
Meteor.call('addDoc', data, function(error, result){
if(result){
window.location = '/docs/' + documentID;
}
})
}
And put only the insertion in server side, like:
'addDoc'(obj){
return DocumentData.insert({
//some parameters
});
}
I've used this structure and it works for me in both Firefox & Chrome.

Chrome extension: sending data to window created with chrome.windows.create

I'm struggling to find the best way to communicate with my web app, which I'm opening with chrome.windows.create in my extension.
I've got the wiring between content script and background script right. I can right click an element and send it's value to the background script, and the background script creates a window containing my webapp. But from there I can't figure out how to access and use that value in my webapp (it needs to load the value into an editor).
I've tried setting fns and vars on the window and tab objects, but somehow they go missing from the window object once the web app is loaded.
With chrome.tabs.executeScript I can fiddle with the dom, but not set global variables or anything on 'window' either.
If there isn't a better way, I guess I'm forced to add to the DOM and pick that up once my web app is loaded, but it seems messy. I was hoping for a cleaner method, like setting an onLoadFromExtension fn which my web app can execute to get the value it needs.

I found a method that works after much trial and error, though it still seems error prone. And it also depends on the extension ID matching the installed one, so if that can't be hard-coded it'll be another message that needs passing through another channel (after reading up, looks like that can be hard-coded since it's a hash of the public key, so problem solved)... Starting to think manipulating the DOM is less messy...
background.js:
var selectedContent = null;
chrome.runtime.onMessageExternal.addListener(
function(request, sender, sendResponse) {
console.info("------------------------------- Got request", request);
if (request.getSelectedContent) {
sendResponse(selectedContent);
}
});
web app:
var extensionId = "naonkagfcedpnnhdhjahadkghagenjnc";
chrome.runtime.sendMessage(extensionId, {getSelectedContent: "true"},
response => {
console.info("----------------- Got response", response);
if(response) {
this.text = response;
}
});
manifest.json:
"externally_connectable": {
"ids": ["naonkagfcedpnnhdhjahadkghagenjnc"],
"matches": ["http://localhost:1338/*"]
},

Within the popup, do the following:
const parentWindow = window.opener
parentWindow.postMessage({ action: 'opened' })
window.onmessage = msg => {
alert(JSON.stringify(msg.data)) // Alerts you with {"your":"data"}
}
Within the script that will call chrome.windows.create, do the following:
window.onmessage = msg => {
if (msg.data.action == 'opened') {
msg.source.postMessage({ your: 'data' })
}
}
Set setSelfAsOpener: true when calling chrome.windows.create
How does this work?
Due to limitations of the Chrome extension windows API, the created window needs to post a message to its creator (aka window.opener) or else the creator won't have access to a WindowProxy (useful for posting messages to the created window).

JavaScript Methods Not Executing Consistently In Mobile Safari vs. Android Chrome

I have a method in JavaScript that looks as follows:
function onAction() {
getValue1();
getValue2();
getValue3();
}
When I call onAction() I see two different behaviors between Mobile Safari and Android Chrome. In Safari, I get the values for all three methods. On Android Chrome, I only get the value of the last method. It doesn't matter which one is last. I suspected it may be an execution timing issue and attempted the following:
function onAction() {
new Promise(function(resolve,reject) {
resolve(1);
})
.then(function() {
getValue1();
})
.then(function() {
getValue2();
})
.then(function() {
getValue3();
});
}
Again, it works fine in Mobile Safari, but not Android Chrome.
I'm sure I'm missing something obvious, but it's eluding me. If it matters, the getValue* functions are used to get values via each platform's mechanism for Native Code->JavaScript bridging.
Any help is appreciated. Please let me know if I can supply any more information.
Regards,
Rob
**Additional Info **
The getValueX functions don't return any values. They trigger values to be pushed over to the native wrapper:
function getReaderSDKVersion() {
var message = {'action' : MPDataEnum.SDKVersion};
raiseMessage(message);
}
function raiseMessage(message) {
if (isPlatformiOS()) {
window.webkit.messageHandlers.interOp.postMessage(message);
} else {
var url = "mpcard://runMethod#" + JSON.stringify(message);
window.location.href = url;
}
}

The issue is answered here:
Triggering shouldStartLoadWithRequest with multiple window.location.href calls
Whereas this was an issue in most browsers, it doesn't appear to affect Mobile Safari now.

Get selected message data in Thunderbird extension

I need to get some e-mail message data in my Thunderbird extension. I found this example on MDN (https://developer.mozilla.org/en-US/docs/XPCOM_Interface_Reference/nsIMsgMessageService):
var content = "";
var MessageURI = GetFirstSelectedMessage();
var MsgService = messenger.messageServiceFromURI(MessageURI);
var MsgStream = Components.classes["#mozilla.org/network/sync-stream-listener;1"].createInstance();
var consumer = MsgStream.QueryInterface(Components.interfaces.nsIInputStream);
var ScriptInput = Components.classes["#mozilla.org/scriptableinputstream;1"].createInstance();
var ScriptInputStream = ScriptInput.QueryInterface(Components.interfaces.nsIScriptableInputStream);
ScriptInputStream.init(consumer);
try {
MsgService.streamMessage(MessageURI, MsgStream, msgWindow, null, false, null);
} catch (ex) {
alert("error: "+ex)
}
ScriptInputStream .available();
while (ScriptInputStream .available()) {
content = content + ScriptInputStream .read(512);
}
alert(content);
However, when I run it I get the following error:
Timestamp: 2013.06.21. 14:47:21
Error: ReferenceError: GetFirstSelectedMessage is not defined
Source File: chrome://edus_extension/content/messengerOverlay.js
Line: 90
What is this 'GetFirstSelectedMessage' function and how can I get message URI without using it?

This documentation looks fairly outdated. I would suggest:
using gFolderDisplay.selectedMessage (try typing top.opener.gFolderDisplay.selectedMessage in the Error Console),
reading some recent code that uses Services and MailServices so as to simplify your code.
That being said, I don't know what you're trying to achieve but:
you'd certainly be better off using a wrapper such as MsgHdrToMimeMessage (self-reference: http://blog.xulforum.org/index.php?post/2011/01/03/An-overview-of-Thunderbird-Conversations)
if you absolutely, absolutely need to get the raw contents of the message, http://mxr.mozilla.org/comm-central/source/mailnews/db/gloda/modules/mimemsg.js#223 has an example on how to do that (it's the implementation of the said MsgHdrToMimeMessage; by simplifying it, you should be able to get directly the raw data of the message).
Good luck with that, once you get a working sample, please add it to the MDN wiki!
Cheers,
jonathan