Why can't I see the content script of Firefox extension? - firefox-addon

The content script of my Firefox extension(borderify.js) is very simple:
document.body.style.border = "20px solid red";
console.log("hello,world");
I can see the extension is loaded and the webpage's border becomes red. When I open the debugger tab(Ctrl+Shift+I), I can see the string "hello,world" is output in the console. But I cannot find the script(borderify.js) is listed in Debugger/Sources(even after refresh). Why? I want to set a breakpoint in this script to debug it.

Related

wxFileDialog filename textbox appears as clipped

I display an Open File dialog using the following code:
wxFileDialog fileDialog(
this,
wxEmptyString,
"E:\\Testfiles",
"SOME_TEST_FILE_WITH_LONG_NAME.txt",
"TXT files (*.txt)|*.txt",
wxFD_OPEN | wxFD_FILE_MUST_EXIST | wxFD_CHANGE_DIR);
if (fileDialog.ShowModal() == wxID_OK)
{
// do something with the file
}
Notice that I set the default filename to a long string (about 10 or more characters).
When the file dialog is displayed, the filename looks clipped.
But on inspection, it's not really clipped.
More like the starting point of the text is placed too much to the left.
When you place the cursor on the textbox, and scroll to the left, you get the complete filename.
Also, when you switch to a different window then return to the file dialog, it corrects itself and displays the complete filename.
This isn't really affecting the functionality of the file dialog.
This is more of an aesthetic issue.
But if there's a reason for this behavior or if there's a solution, I would like to know.
Thanks!
I'm using:
wxWidgets 3.1.0
Windows 10 Home 64-bit
UPDATE (2017/03/20):
I opened a ticket at wxTrac for this bug.
You can check it here:
http://trac.wxwidgets.org/ticket/17824.
This looks like a bug in wxWidgets, please try to reproduce it in the dialogs sample by making minimal changes to the wxFileDialog call which is already present there and open a ticket on wxTrac with the patch allowing to see the problem, so that someone could debug it.
As a temporary workaround (while an official resolution from wxWidgets is not yet available), calling CenterOnParent() after constructing the file dialog properly "scrolls" the filename so that it won't appear as "clipped".
wxFileDialog fileDialog(
this,
wxEmptyString,
"E:\\Testfiles",
"SOME_TEST_FILE_WITH_LONG_NAME.txt",
"TXT files (*.txt)|*.txt",
wxFD_OPEN | wxFD_FILE_MUST_EXIST | wxFD_CHANGE_DIR);
// fixes the clipped filename
fileDialog.CenterOnParent();
if (fileDialog.ShowModal() == wxID_OK)
{
// do something with the file
}

How do I view & debug contentScriptFile sources in Firefox debugger?

I'm making an add-on with a simple content script using tab.attach and contentScriptFile:
index.js:
tab.attach({
contentScriptFile: "./doiuse-script.js"
});
data/doiuse-script.js:
if (document.body) document.body.style.border = '5px solid red';
console.log("document.styleSheets: " + document.styleSheets);
I have devtools.chrome.enabled = true and devtools.debugger.remote-enabled = true so I can use the Add-on Debugger.
But, when I open the Add-on Debugger, I don't see my doiuse-script.js source?
I answered my own question while asking it.
As mentioned in the Add-on Debugger docs about content scripts, the Add-on Debugger does not show content script sources unless/until they are loaded. So, the Add-on Debugger won't show the content script source until you reload the page on which the content script activates.

How Automatically On "Content Blocker" Extension in Safari section?

I am creating an Ad Blocker. I am just trying to Automatically on safari extension of "Content Blocker". I went through examples but did't found any solution. Is there any way to "ON" extension or manually we have to start it?
On iOS, Safari Content Blockers are disabled by default.
There is no way to automatically enable them from your app. You must instruct the user to:
Open the Settings app.
Go to Safari > Content Blockers.
Toggle on your Content Blocker extension.
On macOS (as of 10.12), a similar rule applies: Content Blocker extensions (bundled with your app) are disabled by default, and must be toggled on by the user in Safari Preferences > Extensions.
Assuming you want to test your "personal AdBlock program", first prepare a dummy HTML, with this line <div class="ads">hello</div>,
next apply your "personal AdBlock program", assuming it is JavaScript/CSS based and not proxy-like, you either hide, or remove the element (Node) from the DOM.
for example:
document.querySelector('div[class*="ads"]') -- this is nice and (very) generic way to find the element.
this is how to hide "the ads"
document.querySelector('div[class*="ads"]').style.display="none";
or, to make it stronger, related to other rules on the page, make it a local style + important notifier: document.querySelector('div[class*="ads"]').style.cssText="display:none !important;" ;
you can also remove the element (Node) from the DOM:
var e = document.querySelector('div[class*="ads"]') follow by:
e.parentNode.removeChild(e);
now, you probably want to see that "YOUR ADBLOCK" worked,
later (after the page has loaded, and your javascript code runned) type:
console.log(null === document.querySelector('div[class*="ads"]') ? "removed(success)" : "still here(failed)")
note that for this example (to make things simple) I assume there is only one div with that class in the page (avoiding loops :) ).
if you've just going to hide the element, you should query its current (most updated) style-condition, using a native method exist under window:
console.log("none" === window.getComputedStyle(document.querySelector('div[class*="ads"]')) ? "hidden(success)" : "still here(failed)")
Enjoy!

iMacros saveas results in empty CSV file in firefox

i have a very simple script in iMacros for Firefox
TAG POS=2 TYPE=TD ATTR=CLASS:head<SP>super EXTRACT=TXT
SAVEAS TYPE=EXTRACT FOLDER=* FILE=*
i can see a file being created but nothing is in it. I tried this in IE and it works fine. What am i missing here? I am using Firefox 27.0 and iMacros 8.6 in Win 7.
Thanks
Actually text was there but there were empty lines before the actual text, so when i opened csv in excel nothing was showing up. I opened it in a text editor and it was there. I trimmed the string after extracting and got what I wanted.

Draggable, Droppable, and Clone

I'm trying to make a "picture palette", where you have a bunch of images and can drag & drop them to replace the image in a particular div.
Drag works, the drop event registers, but the passed ui object doesn't seem to contain a clone of the dragged image as expected. What's wrong?
JsFiddle.
ui.helper is an array with 1 element. Console logging is an excellent feature that helps debug javascript. You need to either have Chrome, or Firefox with "Developer Tools" plugin installed.
console.log(ui.helper);
Outputs:
[<img src=​"http:​/​/​jsfiddle.net/​img/​logo.png" class=​"ui-draggable" style=​"position:​ absolute;​ left:​ 1px;​ top:​ 28px;​ opacity:​ 1;​ ">​]

Resources