Initial support for cross-browser Web Extension API (#250)

* Initial support for cross-browser Web Extension API

* Json-GLib is a introduced as a new dependency to read manifest.json
* The README contains a new section to summarize the Web Extension API
* Web extension support is implemented as a Peas plugin
* Web extensions can be built-in, system-wide or user-installed
* The Javascript interface is added to the core GLib.Resource
* Midori.Tab shares a WebKit.UserContentManager per WebKit.WebContext

Fixes: #244

* Only insert loaded web extensions and employ a delay installing the API

Otherwise opening a new window with many extensions would result in
significant delay.

Author: kalikiana

.circleci/config.yml

@@ -9,7 +9,7 @@ jobs:
         name: Install dependencies
         command: |
           apt-get update
-          apt-get install -y cmake xvfb valac libwebkit2gtk-4.0-dev libsoup-gnome2.4-dev libgcr-3-dev libpeas-dev libsqlite3-dev intltool libxml2-utils
+          apt-get install -y cmake xvfb valac libwebkit2gtk-4.0-dev libsoup-gnome2.4-dev libgcr-3-dev libpeas-dev libsqlite3-dev libjson-glib-dev intltool libxml2-utils
     - run:
         name: Build
         command: |

CMakeLists.txt

@@ -54,8 +54,9 @@ pkg_check_modules(DEPS_GTK REQUIRED
                   webkit2gtk-4.0>=2.16.6
                   gcr-ui-3>=2.32
                   libpeas-gtk-1.0
+                  json-glib-1.0>=0.12
                   )
-set(PKGS ${PKGS} gtk+-3.0 libsoup-2.4 gcr-ui-3 libpeas-gtk-1.0)
+set(PKGS ${PKGS} gtk+-3.0 libsoup-2.4 gcr-ui-3 libpeas-gtk-1.0 json-glib-1.0)
 set(EXTRA_VAPIS
     ${CMAKE_SOURCE_DIR}/vapi/config.vapi
     ${CMAKE_SOURCE_DIR}/vapi/webkit2gtk-4.0.vapi

README.md

@@ -30,6 +30,7 @@ Midori is a lightweight yet powerful web browser which runs just as well on litt
 * Customizable side panels.
 * User scripts and styles a la Greasemonkey.
 * Web developer tools powered by WebKit.
+* Cross-browser extensions compatible with Chrome, Firefox, Opera and Vivaldi
 
 Please report comments, suggestions and bugs to:
     https://github.com/midori-browser/core/issues
@@ -64,14 +65,15 @@ You can opt-in for the [beta release on the Play Store](https://play.google.com/
 * [Vala](https://wiki.gnome.org/Projects/Vala) 0.30
 * GCR 2.32
 * Peas
+* JSON-Glib 0.12
 
 Install dependencies on Astian OS, Ubuntu, Debian or other Debian-based distros:
 
-    sudo apt install cmake valac libwebkit2gtk-4.0-dev libgcr-3-dev libpeas-dev libsqlite3-dev intltool libxml2-utils
+    sudo apt install cmake valac libwebkit2gtk-4.0-dev libgcr-3-dev libpeas-dev libsqlite3-dev libjson-glib-dev intltool libxml2-utils
 
 Install dependencies on openSUSE:
 
-    sudo zypper in cmake vala gcc webkit2gtk3-devel libgcr-devel libpeas-devel sqlite3-devel fdupes gettext-tools intltool libxml2-devel
+    sudo zypper in cmake vala gcc webkit2gtk3-devel libgcr-devel libpeas-devel sqlite3-devel json-glib-devel fdupes gettext-tools intltool libxml2-devel
 
 Use CMake to build Midori:
 
@@ -247,13 +249,51 @@ Push your branch and **propose it for merging into master**.
 
 This will automatically request a **review from other developers** who can then comment on it and provide feedback.
 
+# Extensions
+
+## Cross-browser web extensions
+
+The following API specification is supported by Midori:
+
+    manifest.json
+      name
+      version
+      description
+      background:
+        page: *.html
+        scripts:
+        - *.js
+      browser_action:
+        default_popup: *.html
+        default_icon: *.png
+        default_title
+      content_scripts:
+        js:
+        - *.js
+        css:
+        - *.css
+      manifest_version: 2
+
+    *.js
+      browser (chrome)
+        tabs
+          create
+          - url: uri
+          executeScript
+          - code: string
+        notifications
+          create
+          - title: string
+            message: string
+
 # Jargon
 
 * **freeze**: a period of bug fixes eg. 4/2 cycle means 4 weeks of features and 2 weeks of stabilization
 * **PR**: pull request, a branch proposed for review, analogous to **MR** (merge request) with Bazaar
 * **ninja**: an internal tab, usually empty label, used for taking screenshots
 * **fortress**: user of an ancient release like 0.4.3 as found on Raspberry Pie, Debian, Ubuntu
 * **katze, sokoke, tabby**: legacy API names and coincidentally cat breeds
+* web extension: a cross-browser extension (plugin) - or in a webkit context, the multi-process api
 
 # Midori for Android
 

core/CMakeLists.txt

@@ -48,6 +48,7 @@ add_custom_command(OUTPUT resources.c
                    ${CMAKE_SOURCE_DIR}/gresource.xml
                    DEPENDS ${CMAKE_SOURCE_DIR}/gresource.xml
                    DEPENDS ${CMAKE_SOURCE_DIR}/data/gtk3.css
+                   DEPENDS ${CMAKE_SOURCE_DIR}/data/web-extension-api.js
                    DEPENDS ${UI_FILES}
                    )
 

core/tab.vala

@@ -59,7 +59,15 @@ namespace Midori {
 
         public Tab (Tab? related, WebKit.WebContext web_context,
                     string? uri = null, string? title = null) {
-            Object (related_view: related, web_context: web_context, visible: true);
+
+            // One content manager per web context
+            var content = web_context.get_data<WebKit.UserContentManager> ("user-content-manager");
+            if (content == null) {
+                content = new WebKit.UserContentManager ();
+                web_context.set_data<WebKit.UserContentManager> ("user-content-manager", content);
+            }
+
+            Object (related_view: related, web_context: web_context, user_content_manager: content, visible: true);
 
             var settings = get_settings ();
             settings.user_agent += " %s".printf (Config.CORE_USER_AGENT_VERSION);

data/web-extension-api.js

@@ -0,0 +1,24 @@
+// Promise-based message handler
+var promises = [];
+var last_promise = 0;
+var m = function (fn, args, cb) {
+    var promise = new Promise (function (resolve, reject) {
+        window.webkit.messageHandlers.midori.postMessage ({fn: fn, args: args, promise: last_promise});
+        last_promise = promises.push({resolve: resolve, reject: reject});
+    });
+    return promise;
+}
+
+// Browser API
+window.browser = {
+    tabs: {
+        create: function (args, cb) { return m ('tabs.create', args, cb); },
+        executeScript: function (args, cb) { return m ('tabs.executeScript', args, cb); },
+    },
+    notifications: {
+        create: function (args, cb) { return m ('notifications.create', args, cb); },
+    }
+}
+
+// Compatibility with Chrome
+window.chrome = window.browser;

extensions/CMakeLists.txt

@@ -15,6 +15,12 @@ foreach(UNIT_SRC ${EXTENSIONS})
     string(FIND ${UNIT_SRC} "." UNIT_EXTENSION)
     if (UNIT_EXTENSION EQUAL -1)
         set(UNIT ${UNIT_SRC})
+        file(GLOB MANIFEST RELATIVE ${CMAKE_CURRENT_SOURCE_DIR} "${UNIT_SRC}/manifest.json")
+        # Web Extension
+        if (MANIFEST MATCHES "(manifest.json)$")
+            execute_process(COMMAND ${CMAKE_COMMAND} -E create_symlink ${CMAKE_CURRENT_SOURCE_DIR}/${UNIT} ${CMAKE_CURRENT_BINARY_DIR}/${UNIT})
+            continue()
+        endif ()
         file(GLOB UNIT_SRC RELATIVE ${CMAKE_CURRENT_SOURCE_DIR} "${UNIT_SRC}/*.vala")
     elseif (${UNIT_SRC} MATCHES "(.vala)$")
         string(REPLACE ".vala" "" UNIT ${UNIT_SRC})

extensions/web-extensions.plugin.in

@@ -0,0 +1,5 @@
+[Plugin]
+Module=web-extensions
+IAge=3
+Builtin=true
+Name=Web Extensions