How can I see included JavaScript sources? - javascript

I am trying to script a web page using GreaseMonkey. (I am using Firebug for help in development.) The page has a small amount of JavaScript code, but that code pulls in other JS files from the site. Are the entire collection of JS files stored somewhere on the client side (i.e. on the filesystem somewhere) so that I can view them? Or better yet, is there a way I can view them in Firebug? I am a little overwhelmed by Firebug but will be able to follow instructions.

Click the script tab in Firebug. Then look immediately below the tab for a dropdown that shows all the scripts.

right click - view source

Related

What is causing the site to call Facebook for scripts and images?

We have a ASP.NET MVC website that contains no JavaScript file or image referenced from Facebook.net or Facebook.com.
Yet Firefox developer tools is showing these calls are happening and causing the site to load slowly.
How do I find out what is causing these calls?
These kind of transactions are usually connected to Facebook Like/Share/Follow buttons (Facebook plugins in general) embedded in the webpage.
Based on the few transactions, which you shared, I would say that you've added a Facebook Page/Group Plugin to your webpage.
It was coming from Google Tag Manager JavaScript code. Even though there were no hard coded references to Facebook in the project, they were present in the Google Tag Manager admin console.

How do I get the data of a website as shown in INSPECT ELEMENT and not in VIEW PAGE SOURCE?

I want to get the INSPECT ELEMENT data of a website. Let's say Truecaller. So that i can get the Name of the person who's mobile number I searched.
But whenever i make a python script it gives me the PAGE SOURCE that does not contain the required information.
Kindly help me. I am a beginner so kindly excuse me of any mistake in the question.
TL;DR: Use Selenium (and PhantomJS)
The view page source will give you the html that was loaded when you made a request for the page (which is most likely what you are getting when you make a request from python.
Since nowadays a lot of pages load things and modify the DOM after the initial html was loaded, you will not get most of the information you want just by looking into that initial response.
To get the inspect element information you will need some sort of web browser to actually go to the page, wait for the information you want to load, and then use it. However you still want to do this in your python script.
Enter selenium, which is a tool for browser automation (mostly used for testing webpages). You can create a python script that opens a browser page and executes whatever code you write for it to do (even wait for a while and search for an after load DOM element!). Your script will still open a browser (which is kind of weird I would guess).
Enter PhantomJS, another library that you can use to have a headless browser to do all your web testing without having to rely on the actual browser UI.
Using selenium only you might achieve your goals, but with phantomjs you can do that in an even cleaner way! Good Luck.
INSPECT ELEMENT and VIEW PAGE SOURCE are not the same.
View source shows you the original HTML source of the page. When you view source from the browser, you get the HTML as it was delivered by the server, not after javascript does its thing.
The inspector shows you the DOM as it was interpreted by the browser. This includes for example changes made by javascript which cannot be seen in the HTML source.
what you see in the element inspector is not the source-code anymore.
You see a javascript manipulated version.
Instead of trying to execute all the scripts on your own which may lead into multiple problems like cross origin security and so on,
search the network tab for the actual search request and its parameters.
Then request the data from there, that is the trick.
Also it seems like you need to be logged in to search on the url you provided so you need to eventually adapt cookie/session/header and stuff, just like a request from your browser would.
So what i want to say is, better analyse where the data you look for is coming from if it is not in the source

How to Load my Javascript file on a website that I have no access to its source

I'm working on a monitoring system. It has a jquery-ui graph! I want to edit that graph whenever it loads on my browser! and I do not have access to the source!
what can I do?
How do you not have access to the source if it's loading on your screen? I'm sure you could WireShark the data that's coming across to your computer if for some reason you're unable to do it through your web browser.
You should be able to save the page locally and work on it from your local PC. This is going to be best if you're going to make a lot of changes and want to keep your changes saved.
You can also use some developer tools that are built into your web browser. For example, with the Chrome Inspector (F12) you can right click under the Elements tab and Edit Attributes or Edit as HTML, and make changes to inline CSS and JS. Take a look under the Sources tab for included files.

Open local html file in current window with Javascript Bookmarklet

I'm trying to build a sample bookmarklet to grab current webpage source code and pass it to a validator. Validator is not a an online website, but a folder with bunch of javascript and html files. I'm trying to open file:///C:/Users/Electrifyings/Desktop/Validator/Main.html file with the help of javascript bookmarklet code and put the source code in the textarea in the newly opened window, but it is not working for some reasons that I'm not aware of.
Here is the sample code with algorithm:
javascript:(function(){var t = document.body.innerHTML;window.open('file:///C:/Users/RandomHero/Desktop/test.html',_self);document.getElementById("validator_textarea")=t;})()
Here are the steps:
Grab current web page source code in a variable.
Open locally stored HTML web page in current or new window or new tab (either way is fine with me, but no luck)
Put the source code from the variable into the validator textarea of the newly opened HTML file.
I have tried above code with a lot of variations, but got stuck on the part where it opens the new window. Either it's not opening the new window at all or it is opening blank window without loading the file.
Would love to get some help with this issue, thanks a lot.
Oh and btw,
Windows 7 x64, Tried IE, Firefox and Chrome. All latest and stable builds. I guess it's not a browser side issues, but something related to javascript code not opening the URI with file:/// protocol. Let me know if any more details are needed. :)
You wouldn't want a webpage you visit to be able to open up file://c:/Program Files/Quicken/YourSensitiveTaxInfo right? Because then if you make a mistake and go to a "bad" website (either a sleazy one or a good one that's been compromised by hackers), evil people on the intarweb would suddenly have access to your private info. That would suck.
Browser makers know this, and for that reason they put VERY strict limits to prevent Javascript code from accessing files on a user's local computer. This is what is getting in the way of your plan.
Solutions?
build the whole validator in to the bookmarklet (not likely to work unless it's really small)
put your validator code up on the web somewhere
write a plug-in (because the user has to choose to install a plug-in, they get much more freedom than webpages ... even though for Firefox, Chrome, etc. plug-ins are basically just Javascript)
* * Edit * *
Extra bonus solution, if you don't limit yourself to a purely-client-side implementation:
Have your bookmarklet add a normal (HTML) form to the page.
Also add an iframe to the page (it's ok if you hide it with CSS styling)
Set the form's target attribute to point to the iframe. This will make it so that, when the user submits the form and the server replies back to that submission, the server's reply will go to the (hidden) iframe, instead of replacing the page as it normally would.
Add a file input to your form - you won't be able to access the file within that input using Javascript, but that's ok because your server will be doing the accessing, not your bookmarklet.
Write a server-side script which takes the form submissions, reads the file that came with it, and then parrots that file back as the response. In other words, you'll have a URL that you can POST to, and when it sees a file in the POST's contents, it will respond back with the contents of that file.
Now that you've got all that the user can pick their validator file using the file input, upload it to your server, your server will respond back with the file it just got, and that file will appear as the contents of the iframe.
And now that you finally have the file that you worked so hard to get (inside your iframe) you can do $('#thatIframe').html() and viola, you have access to your file. You can save the current page's source and then replace the whole page with that uploaded file (and then pass the saved page source back to the new validator page), or you can do whatever else you want with the contents of the uploaded validator file.
Of course, if the file doesn't vary from computer to computer, you can make all of that much simpler by just having a server that sends the validator file back; this could be a pure Apache server with no logic whatsoever, as all it would have to do is serve a static file.
Either way though, if you go with this approach and your new file upload script is not on the same server as your starting webpage, you will have a new security problem: cross-domain script limitations. However, these limitations are much less strict than local file access ones, so there are ways to work around them (JSONP, cross-site policy files, etc.). There are already tons of great Stack Overflow posts explaining these techniques, so I won't bother repeating them here.
Hope that helps.

ASP pages not bringing in Images, CSS or JavaScript

My uncle's has got the files for his website that he got made a few years ago and needs something changed on it. So he has sent me the files as I am willing to make small changes as I know HTML and CSS. But when I open his index.asp page in a browser this only shows html even though the images, css and javascript files are linked properly.
I am not familiar with asp, I would really appreciate it if someone could let me know why the files are not being brought up when I open the index.asp file in a browser.
Thanks
Because when you just open the asp file on a browser, there's no web server intervention so that the ASP page is properly processed. You are just opening a file as if you were opening it on Notepad. You need to configure the whole site as an IIS Application and browse to the site by going to http://localhost/YourSite
First things first - as the previous comment says, you need to run ASP through an IIS based web site because the code needs to be processed.
If you're running through IIS and having this issue, check to see that your IIS settings are correct. Google "static content IIS" and you should find articles relating to this problem.

Categories

Resources