Firebug how to (For addons/extensions) - javascript

Can anyone recommend a tutorial on how to use firebug with Firefox Addon development?
Most google and youtube searches only give me results on how to use it for webpages :(
My main requirement right now is to see and modify if my addon is saving to localstorage.
Thanks!

http://getfirebug.com/wiki/index.php/Firebug_Internals#How_to_write_a_Firebug_extension.3F
and more links from that page eg: http://www.softwareishard.com/blog/category/firebug/

Related

Vue.js page inside iframe not showing on Firefox

We have a Vue.js page contains a Echarts pie draft, and we want to show it in another project, which is using jQuery.
It shows perfectly both on Chrome and IE, but on Firefox there's nothing showing.
We tried to replace the Echarts page with some basic numbers in the template, but it's still empty in Firefox.
This is what it looks like in chrome:
And this is Firefox, which only has an empty app tag:
Any help would be appreciated.
edit:
I'm using Firefox93 on 64bit, there are no errors showing in the console.
This is how we inserted the iframe:
Is the website you're trying to load the iframe in secure (https)?
I see you're trying to iframe an http url
Unlike HTTP images in an HTTPS page, which are allowed through with a little warning on the padlock, iframes are considered potentially dangerous active content and HTTP iframes won't be loaded into an HTTPS page.
Besides that the same-origin policy might have something to do with it
When it comes to several browsers is working well, and when opened in another browser it has something wrong, It should be the Web API or Browser API used by the library, in this case, VueJS.
The possible solutions from the estimated source of the problem are:
Update the VueJS to the latest version.
I hope this forum is useful: https://forum.vuejs.org/t/iframes-in-vue/102268, the questionnaire has a problem with its source link. But I think you are not experiencing this. And it is useful for anyone who visited this question.
If the problem is to be solved, I recommended using other people's custom libraries, like this: https://www.npmjs.com/package/vue-iframes. Because those libraries are developed to answer several problems that the creator facing that probably other people would be experiencing too.

what is the meaning of google_experiment_mod in chrome localstorage

I am storing some items in chrome local storage. Along with my variables I can see
google_experiment_mod: "335"
I am wondering what it means.
Below is the code to to store the items and I use chrome developer tool to see the content.
localStorage.setItem("freqInMins", response.freqInMins);
Thanks
google_experiment_mod is used by Google AdSense for experimenting with which advertisement perform best on a website. Please refer to “How Google uses data when you use our partners’ sites”.
I have that too under the web inspector, but only on certain sites. I use mac and I am using Safari. I also found while searching "experiments" in the resource content on the google homepage something that says "dnssec-nd.gexperiments1.com", so I'm guessing that "gexperiments" means "googleexperiments" , and its probably something google uses to track everyone's time or something like that. so its probably nothing.

Using chrome.tabs.captureVisibleTab() from DevTools console

I'm curious as to whether it is possible to take a screenshot directly from Chrome's DevTools using chrome.tabs.captureVisibleTab (be it from the console or from within a snippet), without going through the process of creating an extension.
Is this somehow possible? If not, how would you suggest going about taking a screenshot that reliably mimics the current page (html2canvas doesn't seem to render everything properly). Thanks for your help.
Here is a page screenshot tool provided by Google. After installed, you may open "chrome-extension://cpngackimfmofbokmjmljamhdncknpmg/js/page_context.js" in browser to see its code. This extension do not use Chrome Extension API. It works well in most pages, except some complicated pages.

Javascript OAuth and Opera Link

I am writing a Chrome extension that synchronizes with Opera Link, but I keep struggling with OAuth. I have tried three different OAuth libraries, but they don't work.
These libraries are:
http://oauth.googlecode.com/svn/code/javascript/
https://github.com/bytespider/jsoauth
http://code.google.com/chrome/extensions/tut_oauth.html
All of them can't fetch client tokens. I have only read-only access when I use the first and insert the tokens.
"javascript oauth opera link" doesn't give results in Google.
(EDIT:) My question is: has anyone had luck in using Opera Link in pure JavaScript, or does anyone know what the problem is?
EDIT2: this doesn't work for me: application that uses OAuth and javascript. I can use it if I get 'token' and 'tokenSecret' with the Python API debugger, but only read-only. I can't for example add new bookmarks.
I just put my Opera Link JavaScript library up at https://github.com/ChaosinaCan/OperaLink.js. (It's the one emanchado linked to)
I've only tested some of the bookmark functions so far, so please tell me if anything doesn't work.
Hey there!
The other day I made an Opera extension work with the Opera Link API: https://github.com/emanchado/Javascript-OAuth-experiments
Have a look at both the extension code itself, and https://github.com/emanchado/Javascript-OAuth-experiments/blob/master/oauthtest.js (also oauthtestget.js for a GET request example).
The Opera Link API introduction article gives information and specifically a debugger python script. I might help to understand your code issues.
It would help also if you could provide a bit of code.

Is there a tool can search a page and all linked css and js files for a string?

In my quest for knowledge I sometimes find myself scouring the source of a page only to find that the javascript method im looking for isnt on the page directly. That said I think it must be on one of the linked javascript pages. However I dont really want to have to look through each individual file to find the line. Is there a tool that can do this for me?
Preferably in firefox as an add-on I was thinking...
Cheers,
Pete
Have you checked out Firebug?
yes.. Firebug in Firefox | IE developer toolbar for IE | Developer toolbar for Firefox are great tools for indepth check of JS/CSS/HTML
We ran into a similar challenge while developing/editing our WordPress sites (i.e. not being able to search all CSS/PHP/JS files at once). As a solve, we built a plugin to allow us to do just that. If this question is related to a WordPress site, the plugin might help - rather than searching in Firebug and then having to jump back onto WordPress, you can search all and edit directly in WordPress. Plugin is called WP Backend File Search.

Categories

Resources