add add-on/manifest.json file to build process, to make it easier to …

…keep package and extension versions in sync

.gitignore

@@ -4,6 +4,7 @@ node_modules/
 test.config.js
 dist/
 webapi_manager.zip
+add-on/manifest.json
 add-on/lib/standards.js
 add-on/lib/third_party/sjcl.js
 add-on/lib/third_party/uri.all.min.js

gulpfile.js

@@ -3,7 +3,7 @@ const path = require("path");
 const gulp = require("gulp");
 const compiler = require("vue-template-compiler");
 
-const uft8Enc = {encoding: "utf8"};
+const utf8Enc = {encoding: "utf8"};
 const wrapInFunc = string => {
     return `function () {${string}}`;
 };
@@ -35,18 +35,58 @@ gulp.task("clean", () => {
     }
 });
 
+const buildAddonManifestJson = () => {
+    // First read the version of the npm project, so that we can use that
+    // to set the version in the extension manifest.
+    const packageJsonSource = fs.readFileSync("package.json", utf8Enc);
+    const packageJsonData = JSON.parse(packageJsonSource);
+    const currentVersion = packageJsonData.version;
+
+    // Next, read the source manifest.json file out of the sources directory.
+    const sourceManifestJsonPath = path.join("sources", "add-on", "manifest.json");
+    const sourceManifestJsonSource = fs.readFileSync(sourceManifestJsonPath, utf8Enc);
+    const sourceManifestJsonData = JSON.parse(sourceManifestJsonSource);
+
+    // Then, set the version in the add-on manifest file with the source from
+    // the npm package.json file.
+    sourceManifestJsonData.version = currentVersion;
+
+    // Finally, write the "compiled" manifest.json version into the add-on
+    // directory, or what will be bundled.
+    const destMainifestJsonString = JSON.stringify(sourceManifestJsonData, null, "  ");
+    const destMainifestJsonPath = path.join("add-on", "manifest.json");
+    fs.writeFileSync(destMainifestJsonPath, destMainifestJsonString);
+};
+
+/**
+ * The default gulp task does all of the following:
+ *
+ * 1. Compile the Web API standards in sources/standards/*.json into a single
+ *    data structure.
+ * 2. Prepend that data structure to the stubbed out javascript file in
+ *    sources/js/standards.part.js to create add-on/lib/standards.js.
+ * 3. Copy several third party libraries from npm into the add-on.  This is
+ *    done because Mozilla's add-on review process requires either providing
+ *    source of all libraries, or using libraries from npm.
+ * 4. Build the extension's manifest by using the version in package.json
+ *    to set the "version" key in sources/add-on/manifest.json, and copy that
+ *    file to add-on/manifest.json.
+ * 5. Compile the Vue.js templates in sources/vue/ into the compiled versions
+ *    used by the config page of the extension (and copy those compiled versions
+ *    to add-on/config/js/vue_compiled_templates
+ */
 gulp.task("default", () => {
     const builtScriptComment = "/** This file is automatically generated. Do not edit it!**/\n";
     const standardsDefDir = path.join("sources", "standards");
 
-    // Build all the standards listings into a single features.js file.
+    // Step #1 from above.
     const combinedStandards = fs.readdirSync(standardsDefDir)
         .reduce((prev, next) => {
             if (next.indexOf(".json") === -1) {
                 return prev;
             }
 
-            const fileContents = fs.readFileSync(path.join(standardsDefDir, next), uft8Enc);
+            const fileContents = fs.readFileSync(path.join(standardsDefDir, next), utf8Enc);
             let standardContents;
             try {
                 standardContents = JSON.parse(fileContents);
@@ -67,11 +107,13 @@ gulp.task("default", () => {
     renderedStandardsModule += "window.WEB_API_MANAGER.standardsLib = ";
     renderedStandardsModule += JSON.stringify(standardsLibModule) + ";\n";
 
+    // Step #2 from above.
     const pathToStandardsLibStub = path.join("sources", "js", "standards.part.js");
-    renderedStandardsModule += fs.readFileSync(pathToStandardsLibStub, uft8Enc);
+    renderedStandardsModule += fs.readFileSync(pathToStandardsLibStub, utf8Enc);
 
     fs.writeFileSync(path.join("add-on", "lib", "standards.js"), renderedStandardsModule);
 
+    // Step #3 from above doc block.
     const thirdPartyConfigDirPath = path.join("add-on", "config", "js", "third_party");
     if (!fs.existsSync(thirdPartyConfigDirPath)) {
         fs.mkdirSync(thirdPartyConfigDirPath);
@@ -90,8 +132,10 @@ gulp.task("default", () => {
 
     fs.copyFileSync(uriSourcePath, uriDestPath);
 
-    // Now compile the vue templates into render functions, so that we
-    // can run in the CSP safe, VUE runtime.
+    // Step #4 from the above doc block.
+    buildAddonManifestJson();
+
+    // Step #5 from above doc block.
     const vueTemplatesSourcePath = path.join("sources", "vue");
     const vueTemplatesDestPath = path.join("add-on", "config", "js", "vue_compiled_templates");
     if (!fs.existsSync(vueTemplatesDestPath)) {
@@ -100,7 +144,7 @@ gulp.task("default", () => {
 
     fs.readdirSync(vueTemplatesSourcePath).forEach(filepath => {
         const absolutePath = path.join(__dirname, vueTemplatesSourcePath, filepath);
-        const fileSource = fs.readFileSync(absolutePath, uft8Enc);
+        const fileSource = fs.readFileSync(absolutePath, utf8Enc);
 
         const compilationResult = compiler.compile(fileSource);
 

add-on/manifest.json → sources/add-on/manifest.json

@@ -1,7 +1,7 @@
 {
   "manifest_version": 2,
   "name": "WebAPI Manager",
-  "version": "0.9.20",
+  "version": null,
   "description": "Improves browser security and privacy by controlling page access to the Web API.",
   "icons": {
     "48": "images/uic-48.png",