Bug 928144 - Make Manifest Editor read-only for hosted apps. r=paul

--HG--
extra : rebase_source : 66b5c3aaab33ba714e4740bbf54d20ffa40e2132

browser/devtools/app-manager/content/manifest-editor.js

@@ -21,6 +21,8 @@ function ManifestEditor(project) {
 ManifestEditor.prototype = {
   get manifest() { return this.project.manifest; },
 
+  get editable() { return this.project.type == "packaged"; },
+
   show: function(containerElement) {
     let deferred = promise.defer();
     let iframe = document.createElement("iframe");
@@ -43,9 +45,12 @@ ManifestEditor.prototype = {
     let editor = this.editor = new VariablesView(variablesContainer);
 
     editor.onlyEnumVisible = true;
-    editor.eval = this._onEval;
-    editor.switch = this._onSwitch;
-    editor.delete = this._onDelete;
+
+    if (this.editable) {
+      editor.eval = this._onEval;
+      editor.switch = this._onSwitch;
+      editor.delete = this._onDelete;
+    }
 
     return this.update();
   },
@@ -90,7 +95,7 @@ ManifestEditor.prototype = {
   },
 
   save: function() {
-    if (this.project.type == "packaged") {
+    if (this.editable) {
       let validator = new AppValidator(this.project);
       let manifestFile = validator._getPackagedManifestFile();
       let path = manifestFile.path;

browser/devtools/app-manager/content/projects.js

@@ -81,19 +81,21 @@ let UI = {
     return null;
   },
 
-  addPackaged: function() {
-    let folder = this._selectFolder();
+  addPackaged: function(folder) {
+    if (!folder) {
+      folder = this._selectFolder();
+    }
     if (!folder)
       return;
-    AppProjects.addPackaged(folder)
-               .then(function (project) {
-                 UI.validate(project);
-                 UI.selectProject(project.location);
-               });
+    return AppProjects.addPackaged(folder)
+                      .then(function (project) {
+                        UI.validate(project);
+                        UI.selectProject(project.location);
+                      });
   },
 
   addHosted: function() {
-    let form = document.querySelector("#new-hosted-project-wrapper")
+    let form = document.querySelector("#new-hosted-project-wrapper");
     if (!form.checkValidity())
       return;
 

browser/devtools/app-manager/content/projects.xhtml

@@ -80,8 +80,9 @@
       <div class="project-errors" template='{"type":"textContent","path":"errors"}'></div>
       <div class="project-warnings" template='{"type":"textContent","path":"warnings"}'></div>
     </div>
-    <div class="manifest-editor">
-      <h2>&projects.manifestEditor;</h2>
+    <div class="manifest-editor" template='{"type":"attribute","path":"type","name":"type"}'>
+      <h2 class="editable" title="&projects.manifestEditorTooltip;">&projects.manifestEditor;</h2>
+      <h2 class="viewable" title="&projects.manifestViewerTooltip;">&projects.manifestViewer;</h2>
     </div>
   </div>
   </template>

browser/devtools/app-manager/test/browser.ini

@@ -2,5 +2,6 @@
 support-files =
   head.js
   hosted_app.manifest
+  manifest.webapp
 
 [browser_manifest_editor.js]

browser/devtools/app-manager/test/browser_manifest_editor.js

@@ -13,10 +13,10 @@ function test() {
     Services.prefs.setBoolPref(MANIFEST_EDITOR_ENABLED, true);
     let tab = yield openAppManager();
     yield selectProjectsPanel();
-    yield addSampleHostedApp();
+    yield addSamplePackagedApp();
     yield showSampleProjectDetails();
     yield changeManifestValue("name", "the best app");
-    yield removeSampleHostedApp();
+    yield removeSamplePackagedApp();
     yield removeTab(tab);
     Services.prefs.setBoolPref(MANIFEST_EDITOR_ENABLED, false);
     finish();

browser/devtools/app-manager/test/head.js

@@ -2,7 +2,7 @@
    http://creativecommons.org/publicdomain/zero/1.0/ */
 "use strict";
 
-const {utils: Cu} = Components;
+const {utils: Cu, classes: Cc, interfaces: Ci} = Components;
 
 const {Promise: promise} =
   Cu.import("resource://gre/modules/commonjs/sdk/core/promise.js", {});
@@ -17,6 +17,8 @@ const TEST_BASE =
   "chrome://mochitests/content/browser/browser/devtools/app-manager/test/";
 const HOSTED_APP_MANIFEST = TEST_BASE + "hosted_app.manifest";
 
+const PACKAGED_APP_DIR_PATH = getTestFilePath(".");
+
 function addTab(url, targetWindow = window) {
   info("Adding tab: " + url);
 
@@ -72,6 +74,18 @@ function removeSampleHostedApp() {
   return AppProjects.remove(HOSTED_APP_MANIFEST);
 }
 
+function addSamplePackagedApp() {
+  info("Adding sample packaged app");
+  let appDir = Cc['@mozilla.org/file/local;1'].createInstance(Ci.nsIFile);
+  appDir.initWithPath(PACKAGED_APP_DIR_PATH);
+  return getProjectsWindow().UI.addPackaged(appDir);
+}
+
+function removeSamplePackagedApp() {
+  info("Removing sample packaged app");
+  return AppProjects.remove(PACKAGED_APP_DIR_PATH);
+}
+
 function getProjectsWindow() {
   return content.document.querySelector(".projects-panel").contentWindow;
 }

browser/devtools/app-manager/test/manifest.webapp

@@ -0,0 +1,3 @@
+{
+  "name": "My packaged app"
+}

browser/locales/en-US/chrome/browser/devtools/app-manager.dtd

@@ -74,6 +74,9 @@
 <!ENTITY projects.hostedManifestPlaceHolder2 "http://example.com/app/manifest.webapp">
 <!ENTITY projects.noProjects "No projects. Add a new packaged app below (local directory) or a hosted app (link to a manifest file).">
 <!ENTITY projects.manifestEditor "Manifest Editor">
+<!ENTITY projects.manifestEditorTooltip "Edit your app's manifest in the panel below. The Update button will save your changes and update the app.">
+<!ENTITY projects.manifestViewer "Manifest Viewer">
+<!ENTITY projects.manifestViewerTooltip "Examine your app's manifest in the panel below.">
 
 <!ENTITY help.title "App Manager">
 <!ENTITY help.close "Close">

browser/themes/shared/devtools/app-manager/projects.css

@@ -458,6 +458,15 @@ strong {
 .manifest-editor > h2 {
   font-size: 18px;
   margin: 1em 30px;
+  display: none;
+}
+
+[type="packaged"] > .editable {
+  display: block;
+}
+
+[type="hosted"] > .viewable {
+  display: block;
 }
 
 .variables-view {