Basic questions about porting to WebExtension

Add-ons Development
#1

I have an Addon that uses the Addon SDK, which I now need to rewrite using WebExtension (WE). What it basically does is to directly read the places.sqlite database, extract the bookmarks/history data, encode that data using some character encoding, zlib compress that data and write it to the disk. So essentially the Addon enables users to process their data with external tools.

Although I have already looked at the WE’s documentation on developer.mozilla.org, I still need to answer some key aspects:

  1. It doesn’t look like WE has the means to directly read/write from/to a SQLite database file. Is such an access in the works? (Just to be clear: I have no need to run my Addon inside another browser).

  2. My SDK Addon allows me to easily split large source files into smaller modules and even to embed 3rd party ones (character encoding, zlib compression, etc). But that doesn’t seem to work with WE, because the “require()” directive doesn’t seem to work anymore. What seems possible is to add all source files to the “background” directive inside the “manifest.json” file, which gets quite impractical if you want to embed necessary 3rd party modules.

  3. So far I didn’t see any way to read/write data from/to files on the disk. I guess it would be possible to dump the resulting csv text data into a new browser tab and then let the user copy-and-paste that data into a file. But that gets impractical if you take into account, that this text data can be multiple Megabytes large. Is there a way to write to a file? Would it be possible to add a download button to such a browser tab?

Thanks in advance for any constructive comments on these issues.

#2

This is not going to be possible. You need to switch to IndexedDB - so this means you cant modify SQLite tables of browser. You can only create your own IndexedDB.

You will have to use a build system like webpack. Personally I moved away from require and to ES6 imports I’m loving it!

You have only two options - use HTML5 File API, which opens a browse dialog and they pick the file and then you can read that. You might be able to hold a reference to that in a browser session so you don’t have to give them another “Browser Dialog”. But across browser sessions you will have to give them a browse dialog again.

With HTML5 File API you can also do reverse, show browse dialog and get location to save to, then write.

The second option, requires Native Messaging. You can do file access like in the past. But this requires you to write exe/dmg/executable and then write an installer. This is a very spywarey solution, if users see this they will shy away from it. If they don’t shy away, then provide a link to your website (or github repo) to download your installer, the user runs the installer to install the packaged binary, then the user installs your addon.

#3

I didn’t have time yet to look into ‘‘webpack’’. I merely tried to test if I could use ‘‘import’’ statements like ‘‘require’’ statements. It doesn’t look like Firefox will accept those.

// lib/module.js
export function test() { return 123; }

// background.js
import { test } from "lib/module.js"
var lib = import "lib/module.js"
console.log(test());

The first two background.js lines will give me syntax errors:
(That is when I try to run the Addon using “web-ext run”)
1st line: " import declarations may only appear at top level of a module "
2nd line: " expected expression, got ‘import’ "

I guess I’ll have to take a closer look at webpack.

So far I didn’t find a way to use a Save-As-Browse dialog and I somewhat doubt that this is possible. What I found is the following:

var data = new Blob( [“hello world!”], { type: “text/plain” } );
var url = window.URL.createObjectURL(data);
// Then add an ‘’‘a’’’ element to the browser_action’s popup and set it’s ‘‘href’’ attribute to that ‘‘url’’.

That is anything but perfect, but it does work.
See also: http://jsfiddle.net/UselessCode/qm5AG/