Google Chrome extension to modify a page content? - google-chrome

I am very new on Chrome extension development.
I am trying to create an extension that will append a jQuery at the end of the current viewing page and then will execute some code.
Is there any tutorial on that ? or something?

chrome by default user scripts vry much like greasemonkey. You can start with that.
http://www.chromium.org/developers/design-documents/user-scripts
plethora of scripts here: http://userscripts.org/

Related

Set a custom favicon for different google spreadsheets

I use a lot of different google spreadsheets for day to day tasks.
Sometimes all of them are open at once, and combined with other websites needed it's a lot of open tabs, so the tab header is only the sheets favicon.
I'm looking for a way to add a custom favicon to each spreadsheet using Google Apps Script, to make it easier to identify them when only the icon is visible.
I've found a Chrome extension (https://chrome.google.com/webstore/detail/favicon-changer/ijaabbaphikljkkcbgpbaljfjpflpeoo) which changes the favicon to a specific file I choose, but I need a way to do it natively to each spreadsheet so that it works on any computer.
There's also a different extension which also changes the favicon, but to a random one you can't choose (https://chrome.google.com/webstore/detail/favidenticon-for-google-d/alkonpgilhahbbhihdjnamkmckfajmjo).
Since theres a way to code it in an extension, I'm wondering if there's a way to code it directly in Google Apps Script, assigning a specific file as the favicon.
I've fonund also that there's a setFaviconUrl(iconUrl) method in Class HtmlOutput, but I think it's for Web Apps, I've tried using it but haven't managed to make it work:
https://developers.google.com/apps-script/reference/html/html-output#setfaviconurliconurl
I have the icon files uploaded to a website in case that's needed (this is one of them https://www.botix.com.ar/imagenes-empresa/favicon-pedidos.ico)
I know little about code, so any help would be appreciated!
I am afraid that it is not possible at this moment. The extension you mentioned probably does not work with Google Apps Script and it may be modifying or working with Chrome specific settings or tools.
Since Google Apps Script is not able to work with Chrome related tools or APIs it would not be possible to use Google Apps Script to accomplish this. That is why the only options available are related to Chrome extensions or for web apps as you mentioned.
You can submit this as a feature request for Google Apps Script using this link

How can I edit the body class of this website?

I would like to change the body class="" of a website, in this case it's WhatsApp Web, if you go to inspect element and change body class="web" to body class="web dark" the page becomes dark. How can I save this so I don't have to do this every time I load the page? Thanks!
You'll likely need to use a Chrome Extension for this. Here is a helpful link to a similar use-case where the person was attempting to create their own extension, if you're interested in creating your own solution. Here's a reference from the Google Chrome team on creating your own Chrome extension.
If you're looking for something a little more out-of-the-box, check out this Chrome Plugin, Page Manipulator. There are several other plugins such as TaperMonkey.
The idea is to have some extension in Chrome that will automatically apply the changes you attempting to do directly to the DOM of the page.
what you are trying to do is not possible because each time you reload the page the code will get updated(By updated i mean the orignal code).
But there is a way you can do the same by creating your own add-ons in mozilla or extensions for chrome what this extension will do is whenever they will see a "tag" or "class" matching the constraint will get replace by the value you want.
like in your case from "web" to "web dark".

How to Access DOM of new web page opened in Chrome

i am writing a NPAPI plugin for that i am using NPSIMPLE sample code from google chrome. i have to get the DOM of web page opened in the chrome browser. My plugin solution also includes background.html file. which when i open in chrome browser calls a method in NPAPI plugin. so my plugin can get the URL of this file. now i want to read the DOM structure of this File.
i have few questions:
when a new page is opened in browser by user how i have to embed my plugin to that page and get the DOM of that page?
whenever a new tab is opened how can i get the notification in My plugin?
How to get the DOM mutation notification to my plugin?
Does NPAPI provides API to get the DOM mutation notification or Content Script is the only option? if content script is the only option then how to establish communication between plugin and content_script?
i am trying to get this answers as well. any help greatly appreciated...
thanks in advance...
1) The only way you could do this automatically would be to put the plugin inside an extension and do it with the extension.
2) You can't, since plugins don't know anything outside of the page they are in. You might be able to jury-rig something using an extension, I suppose, but I'm not sure if that's possible or not.
3 and 4) Your best bet is probably to figure out how to get these notifications with javascript and inject javascript that will call back into your plugin.
Sounds like one of your main sticking points is that you aren't clear on what a plugin can do; you may want to read up a bit.

Apps Script Gadget not working on a custom website

i have this problem, and it seems that i'm not alone.
If i embed a simple apps script form with some textarea,buttons and labels in a custom web url www.mydomain.com/mypage...the page simply don't show nothing and the Chrome console report that error:
Refused to display document because display forbidden by X-Frame-Options.
Instead if i see the page from the original url:
https://sites.google.com/a/mydomain.com/mysite/mypage
i see the apps script correctly.
Anyone solved that problem or can tell me a workaround??
Thank you
This is a known issue and there has been a lot of chatter on this topic. Here is the issue filed in issue tracker. You may star it. People have listed some workaround as well.
Google Apps Script Gadget not working with custom web address mapping

Is it possible to overload geolocation functions using Chrome extension?

I want to overload navigator.geolocation.getCurrentPosition and navigator.geolocation.watchPosition to simulate geolocation during
development. Is it possible to do it using Google Chrome extension?
You mean something like this?
navigator.geolocation.getCurrentPosition = function(successCallback, errorCallback) {
successCallback({coords:{lattitude:10, longitude:20}});
}
If it is just for your own needs then it would be much easier to just do it in your js code.
If you want to make extension out of it then:
This code needs to be injected on every page of your app (via content script) and put inside dynamically created <script> tag, otherwise you will be inside content script sandbox and your overwritten function will not be visible to the parent page.
You would need to run this code before your app uses geolocation. There is no easy solution for this.
Now there's a chrome extension that does just that - the manual geolocation chrome extension. It tries its best to inject the script before any other one.
I found the extension what you want:)
https://chrome.google.com/webstore/detail/change-geolocation/njjpmclekpigefnogajiknnheheacoaj