Dev tools Network Tab, open script in Sources tab? - google-chrome

In Chrome Dev Tools, when viewing the Network tab, is it possible to select a script and open it in the Sources tab? Double-clicking the script opens it raw in a new browser tab.
Because the Sources tab organizes all assets by their source domains (along with folder paths), it can be time consuming to locate a particular script, if you don't know immediately where it came from. You have to switch back and forth between Network and Sources, taking note of the domain and folder path in the script's header and then trying to dig through all the source domain's and subfolders until you locate the script.
It seems like there should be some obvious way of opening a script in the Sources tab from the Network tab, but I don't see how. You appear to have to manually dig to find it.

EDIT
This feature is now available in Chrome Canary, and should be available in stable Chrome in a few weeks.
As far as I know this is not possible right now. I think it's a good idea though, so I reported it for you.
The quickest way, I can think of, to open a script from the network tab in the sources tab is to:
copy/memorize name of the script from network tab,
go to the sources tab,
open file search (cmd+p / ctrl+p),
enter name of the file you are looking for.

Related

Replacing Javascript file in Google Chrome cache

I would like to replace a javascript file in my Google Chrome cache such that when I reload a website it will run my modified script. I could do a whole setup with puppeteer instead but it would be just way easier if I could just replace the cached file. However, I cannot seem to locate my cache or any info on wether this is possible since the data might be encrypted or encoded. Alternatively is there an extension that would let me do this?
You can replace a JavaScript file in your Google Chrome cache by following these steps:
Open Chrome and press F12 to open the developer tools.
Go to the "Application" tab in the developer tools and select "Cache" from the left sidebar.
Find the JavaScript file you want to replace in the cache and select it.
Right-click on the selected file and choose "Delete" to remove it from the cache.
Refresh the website to reload it and run your modified script.
To run the modified script, you can use the "Sources" tab in the developer tools to open the file and paste in your changes.

Sharing the Realtime Documents

I have created a playground application. I see that it creates shortcut files in my google drive. I tried to share it with incognito (because I want the doc to be available to anybody and do not know how to create another google account, so I log out into incognito). The shared link looks like https://drive.google.com/open?id=0B00--A0eRH1JLTdsX2t0LWw5RE0. But, incognito fails to view it. It says that "No preview avaialable" in what is supposed to be its google drive window and offers the log in
The key problem that I see is that playground application has the following structure, which comes from the official demo
function onAuthorized() {
function onFileLoaded(doc) {display(doc)}
gapi.drive.realtime.load(your_doc_id, onFileLoaded)
}
// App entry point -- start by authorization
gapi.auth.authorize({
client_id: rtClientId, scope: ['install', 'file'],
//user_id: userId,
immediate: !popup }, onAuthorized
);
which seems to demand authentication in the first place before displaying any doc. Authorization is problematic for the unsigned mode that I want my app to be available. I want to share a file and make it viewable to the general public, without the need to log in. This raises a question if incognito users are able to view or event edit my document. I also concern how to copy the doc to their account if desired: one thing is when you have created a file on your drive with my app, you can probably list the files and use drive.copy api to copy desired one and other thing when you want to copy a file that is not available on your google drive and the only thing you have is its id.
BTW, can you tell me which account to use for non-incognito testing from another account? If I create the document in one account I want to see how it looks/accessible from the another.
The Realtime API does not provide anonymous access by default. See https://developers.google.com/google-apps/realtime/faq#does_the_realtime_api_support_anonymous_access
"BTW, can you tell me which account to use for non-incognito testing from another account? If I create the document in one account I want to see how it looks/accessible from the another."
Use Chrome for one account. Use Firefox and other browsers for succeeding accounts.
Additional note:
Just so you have a clear understanding what Incognito is all about. What it can and cannot do so you don't mix things up.
How incognito mode works
What you view
Incognito is a mode that opens a new window where you can browse the
Internet in private without Chrome saving the sites you visit. You can
switch between an incognito window and any regular Chrome browsing
windows you have open. You'll only be in incognito mode when you're
using the incognito window.
Be careful. Incognito mode only prevents Chrome from saving your site
visit activity. It won't stop other sources from seeing your browsing
activity, including:
Your internet service provider Your employer (if you're using a work
computer) The websites you visit themselves What you've downloaded
Chrome won’t save a record of the files you download in incognito
mode. However, the downloaded files will be saved to your computer’s
Downloads folder, where you and any other users of your computer can
see and open them, even after you close your incognito tabs.

Open local files(file://) using Chrome

I have an page with some forms. All the links work fine in IE. They open in a new tab nicely when the hyperlink is click by the user; however, I realized that when Chrome is use the link doesn't open. I keep clicking but nothing opens. The only way of opening the file is copying the hyperlink, opening a new tab in Chrome, paste and go.
Form1
Is this something that browser do? Because I tried it with FireFox and doesn't work either?
It there a way of going around? without installing anything in the browser? Because my user loves Chrome.
Thank you in advanced for the responses.
You can't access to files outside your server or "SandBox", sandbox include the files that user push to the browser or to your server.
If the access from browser to a pc files from web pages was possible, it would be a security problem.
The answer is that you can't with your approach and more importantly you shouldn't. Chrome behavior is in fact the right behavior and it protects you from having malicious users and/or scripts accessing your local resources.
The FILE protocol will access local or defined network named resources which will not be available to a remote user that visits the same page. In other words, you may have outsideserver mapped as a network resource/drive but someone else will not (This does not apply to IPs)
Here's what you can do:
Move the code to a server side script(php, asp, etc) and stream the file back out. Found a quick example here on SO. I did not verify it though. Streaming a large file using PHP
Install a webserver on outsideserver and map a new site to the shared folder. You can then reference it via http (http://outsideserver.com/form1.pdf)
Use the below extension for chrome. It will work.
Enable local file links
Below both options are working and tested.
Link 2
Link 3

How to edit HTML in Google Drive?

I have hosted a HTML file created on my PC (along with a stylesheet) on Google Drive using the script described here.
I have given out the link and it seems to be working fine (no reported issues from those I've sent it to).
I have just discovered a minor omission from the file, I need to add another sentence. This should be ridiculously easy on a PC, I could just open it on notepad!
I can't find a way to edit it on Google Drive, the only connected apps are the viewer and Docs.
The viewer, as the name suggests, will only let me view the HTML, and the docs app won't let me save it back to the original file.
Obviously I could download it then upload again, but from experience it will probably give me a different URL.
Is there any way for me to do this while keeping the link the same, as I have already given the address out?
Currently you can't. You can only preview html files, that is preview the code or preview the rendered content, but you cannot natively edit the code. You have two options:
use a third party extension, such as Neutron Drive or Drive Notepad.
install the Google Drive Desktop App, edit your files locally and save. Changes will be uploaded automatically.
I have just used HTML Editey chrome app
You can do this through file revisions. Hopefully, Google adds another way, but using the revision feature works for me. To revise your file, click the check mark in the Google Drive file list, click more, and then click "Manage revisions...". In the box that pops up, click upload new revision and then you're set.
You may also be able to edit html files stored in google drive through other plugins, but I do not use any at this time to know of them.
Update!
go to drive right click your html file
choose "open with" then "connect more apps"
when app library pop up search for "notepad" then choose "drivenotepad"
after it connect to drive, select it, you will get code editor.

How would I go about developing a file handler for Chrome and/or Chromium?

I would like to develop a browser plugin/extension (I'm not sure how they differ) for a particular (possibly new) file type. To be very explicit, I would like to visit a file, "foo.org", using my browser in something like Drop Box or Google Drive and have the browser treat the file as Emacs would treat an org-mode file. Eventually I would like to develop a full Emacs plugin/extension and be able to configure the browser to handle files with this plugin/extension based on the file extension or a file grokking heuristic.
Any solution that I develop will allow the editing to take place directly in the browser's tab area, i.e. a seamless solution (as opposed the useful but seamy Edit with Emacs solution referenced below). In the same way that Chrome recognizes a spreadsheet or word document and invokes the appropriate Google Docs tool, I would like to get an Emacs-lite editor handle the foo.org file. Another way to ask the question is: how do Google Docs tools get invoked within Chrome and perform the associated editing task. And are these tools open source?
You should consider building on Ymacs which is an Emacs-like editor in the browser.
For browser extensions, there is an experimental downloads api. However, it doesn't let you monitor downloads at the moment. This is planned for the future:
In the future, you will also be able to monitor and manipulate downloads.
However, you can probably just use some JavaScript and replace all links to *.org files with links that open in a tab running Ymacs. This should have the same effect--clicking a *.org link will open it in a new tab.
Take a look at content scripts and the tab api for documentation on how to inject a script into every page and how to open new tabs.
Take a look at Edit with Emacs , it should help you get (at least) part of the way there.