Code coverage and chrome extensions

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 coverage assessment.
- the URL filter allows to select only content scripts of interest
- in 73 canary, an export  button allows to export coverage data into a JSON file.
- if you open the source panel and select your content script, you'll have access to a very convenient graphic representation of the coverage.

Now, there are a few things to do:
- design tests to stimulate traversal of your code.
- make sure your build process has the ability to NOT package content scripts with third party libraries (use manifest file to include a list of files rather than a global content script). This way, you will be able to concentrate on "covering" what you have really written yourself.


Comments

Post a Comment

Popular posts from this blog

Extending an extension with a native app.

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  ...
Read more

Filtering console messages in the chrome devtools window

Image
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!
Read more

Intercepting file download in chrome

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}, ()=>{});         }       })   });
Read more