Browser extension resources

Registering and updating chrome extensions  on the Chrome Web Store has become quite a headache since June 2018. Causes for rejection have obviously evolved in the past year and  Google people are far from eager to provide the changes, this on purpose. Even worse some of the existing extensions get ousted  from the store with obscure reasons, leaving thousands of users in the dark. Without betraying much of the secrets here is a list of questions you should consider before submitting a new package based on my experience: A/ My extension is installed since years, undergone tens of upgrades and suddenly gets rejected ?? answer: review rules have changed, it has nothing to do with the little or big changes you have brought with the new version. Stop scratching your head and audit your addon based on the new rules. B/ Got the rejection message “Spam and Placement in the Store” answer:  there are a few reasons for that and you should review: in your manifest ...

I recently put together a chrome extension for a customer who wanted to detect predefined expressions in webpages. Given the size of the targetted web pages, he was concerned about performance and did not want the web site / browser to be slowed down by the extra processing involved. I designed a triple blade razor contentScript based on two web APIs which can help with the job: Blade1: to deal with any web page including the dynamic ones, I configured a mutationObserver to detect the newly created DOM elements. By the way, I'm only interested by the elements which contain text nodes (i.e. nodeType===Node.TEXT_NODE).. Blade2/ to spend CPU time on useful things, I configured an intersectionObserver to which I passed those elements. This observer detects the nodes becoming visible and feeds those to the third blade. Blade3/ finally, a simple job scheduler scans its pipeline every 5 ms and communicates with the background script which holds the content processing engine (in ...

I'm particularly interested in code coverage assessment in two situations: - who has never refactored a functional extension to cope for growth and new features ? When I refactor, I do variable renaming, object restructuring, code cleaning etc .., and I become very concerned about regression issues. Changes can be spread,major and devastating. So, I need to validate 100% of them. - having deployed tens of extensions, I very often start new projects from existing ones and carry over code I may not need at the end. Code coverage highlights very quickly candidate files and lines to prune off. Since 59, chrome offers a very interesting code coverage feature available thru the devtools - of course -.  Content script and background scripts (in fact all scripts!) can be studied for coverage. So open the devtools, open the console and click the "coverage" tab: - a "content scripts" checkbox next to the URL filter allows to include content scripts in the cove...

Usecase I've recently come across a specific requirement from a customer who wanted a chrome extension  fiddling with the user machine file system. To be more specific, the addon was supposed to allow for the download of a cloud-based compressed file, decompress it and place the result in a specific directory for consumption by another application. As many know, filesystem is sandboxed by chrome for security reasons and it is impossible per design to write files on the user machine outside of the control of the user. I ended-up with a specific architecture outsourcing of the unauthorized job to a native app which bears none of the constraints a chrome extension does. An elegant architecture NativeMessaging Chrome API allows an extension to control - ie launch,communicate with and close - an external application: Native application can be written in any language An instance of the native app is launched when the extension connects to a configured service Native app  ...

Here is a little JS snippet which prevents every file download  (and accessorily opens a new tab in Gsuite for attempts to download from the Gsuite):   chrome.downloads.onCreated.addListener(downloadItem => {       chrome.downloads.cancel( downloadItem.id, ()=>{         alert("DL canceled: "+downloadItem.finalUrl);         if (downloadItem.finalUrl.search("https://docs.google.com")!=-1){           var _driveUrl = downloadItem.finalUrl.replace(/export\?.*/,"");           chrome.tabs.create({url:_driveUrl}, ()=>{});         }       })   });

I was disappointed to see that the regexp '.*' filter button had disapeared starting from a given chrome version (I can't remember the exact one). In fact you still have this ability by entering a '/' surrounded expression in the filter field. As an example, if you want to remove all logs containing either badword1 or badword2 or badword3 : /^((?!badword1|badword2|badword3).)*$/ Try it!

Here is an astute method I got from Vitaly a colleague I worked with a few years ago for easily and quickly localizing your html files. It relies on jquery, the i18 chrome API and the corresponding dictionnary built in your extension package. 1/ Copy paste the following jquery code into a file you'll name translate.js $($=> { $('[translate]').each((i, elem)=> { let $elem = $(elem); $elem.text(chrome.i18n.getMessage($elem.text())); }); }); 2/ edit each and every html page of your extension: add a "translate" attribute to all elements requiring translation like: <span translate>theStringToTranslate</span> include the above translate.js in your page. Voila ... !