Bug 1380828 - Hide 'Pretty Print' button in 'Raw Data' tab if json is invalid. r=Honza draft
authorabhinav <abhinav.koppula@gmail.com>
Fri, 15 Sep 2017 23:56:11 +0530
changeset 665665 6ebee32e288b5d02b96fc01b393f2e64a6c6820d
parent 665623 7aceaf8bcb9f582db0f93488b48ef7019e348dba
child 731848 19cb69586c64c97b57e1490e76db3b1bcdbfa45d
push id80137
push userbmo:abhinav.koppula@gmail.com
push dateFri, 15 Sep 2017 20:26:54 +0000
reviewersHonza
bugs1380828
milestone57.0a1
Bug 1380828 - Hide 'Pretty Print' button in 'Raw Data' tab if json is invalid. r=Honza MozReview-Commit-ID: 3JbX74pW6W0
devtools/client/jsonview/components/main-tabbed-area.js
devtools/client/jsonview/components/text-panel.js
devtools/client/jsonview/test/browser.ini
devtools/client/jsonview/test/browser_jsonview_bug_1380828.js
--- a/devtools/client/jsonview/components/main-tabbed-area.js
+++ b/devtools/client/jsonview/components/main-tabbed-area.js
@@ -62,16 +62,17 @@ define(function (require, exports, modul
               actions: this.props.actions,
               searchFilter: this.state.searchFilter
             })
           ),
           TabPanel({
             className: "rawdata",
             title: JSONView.Locale.$STR("jsonViewer.tab.RawData")},
             TextPanel({
+              isValidJson: !(this.props.json instanceof Error),
               data: this.state.jsonText,
               actions: this.props.actions
             })
           ),
           TabPanel({
             className: "headers",
             title: JSONView.Locale.$STR("jsonViewer.tab.Headers")},
             HeadersPanel({
--- a/devtools/client/jsonview/components/text-panel.js
+++ b/devtools/client/jsonview/components/text-panel.js
@@ -16,28 +16,32 @@ define(function (require, exports, modul
   /**
    * This template represents the 'Raw Data' panel displaying
    * JSON as a text received from the server.
    */
   let TextPanel = createClass({
     displayName: "TextPanel",
 
     propTypes: {
+      isValidJson: PropTypes.bool,
       actions: PropTypes.object,
       data: PropTypes.string
     },
 
     getInitialState: function () {
       return {};
     },
 
     render: function () {
       return (
         div({className: "textPanelBox tab-panel-inner"},
-          TextToolbar({actions: this.props.actions}),
+          TextToolbar({
+            actions: this.props.actions,
+            isValidJson: this.props.isValidJson
+          }),
           div({className: "panelContent"},
             pre({className: "data"},
               this.props.data
             )
           )
         )
       );
     }
@@ -47,16 +51,17 @@ define(function (require, exports, modul
    * This object represents a toolbar displayed within the
    * 'Raw Data' panel.
    */
   let TextToolbar = createFactory(createClass({
     displayName: "TextToolbar",
 
     propTypes: {
       actions: PropTypes.object,
+      isValidJson: PropTypes.bool
     },
 
     // Commands
 
     onPrettify: function (event) {
       this.props.actions.onPrettify();
     },
 
@@ -76,21 +81,23 @@ define(function (require, exports, modul
             onClick: this.onSave},
             JSONView.Locale.$STR("jsonViewer.Save")
           ),
           ToolbarButton({
             className: "btn copy",
             onClick: this.onCopy},
             JSONView.Locale.$STR("jsonViewer.Copy")
           ),
-          ToolbarButton({
-            className: "btn prettyprint",
-            onClick: this.onPrettify},
-            JSONView.Locale.$STR("jsonViewer.PrettyPrint")
-          )
+          this.props.isValidJson ?
+            ToolbarButton({
+              className: "btn prettyprint",
+              onClick: this.onPrettify},
+              JSONView.Locale.$STR("jsonViewer.PrettyPrint")
+            ) :
+            null
         )
       );
     },
   }));
 
   // Exports from this module
   exports.TextPanel = TextPanel;
 });
--- a/devtools/client/jsonview/test/browser.ini
+++ b/devtools/client/jsonview/test/browser.ini
@@ -15,16 +15,17 @@ support-files =
   simple_json.json
   simple_json.json^headers^
   valid_json.json
   valid_json.json^headers^
   !/devtools/client/commandline/test/head.js
   !/devtools/client/framework/test/head.js
   !/devtools/client/framework/test/shared-head.js
 
+[browser_jsonview_bug_1380828.js]
 [browser_jsonview_copy_headers.js]
 subsuite = clipboard
 skip-if = (os == 'linux' && bits == 32 && debug) # bug 1328915, disable linux32 debug devtools for timeouts
 [browser_jsonview_copy_json.js]
 subsuite = clipboard
 skip-if = (os == 'linux' && bits == 32 && debug) # bug 1328915, disable linux32 debug devtools for timeouts
 [browser_jsonview_copy_rawdata.js]
 subsuite = clipboard
new file mode 100644
--- /dev/null
+++ b/devtools/client/jsonview/test/browser_jsonview_bug_1380828.js
@@ -0,0 +1,32 @@
+/* Any copyright is dedicated to the Public Domain.
+ * http://creativecommons.org/publicdomain/zero/1.0/ */
+
+"use strict";
+
+const VALID_JSON_URL = URL_ROOT + "valid_json.json";
+const INVALID_JSON_URL = URL_ROOT + "invalid_json.json";
+const prettyPrintButtonClass = ".textPanelBox .toolbar button.prettyprint";
+
+add_task(function* () {
+  info("Test 'Pretty Print' button disappears on parsing invalid JSON");
+
+  let count = yield testPrettyPrintButton(INVALID_JSON_URL);
+  is(count, 0, "There must be no pretty-print button for invalid json");
+});
+
+add_task(function* () {
+  info("Test 'Pretty Print' button is present on parsing valid JSON");
+
+  let count = yield testPrettyPrintButton(VALID_JSON_URL);
+  is(count, 1, "There must be pretty-print button for valid json");
+});
+
+function* testPrettyPrintButton(url) {
+  yield addJsonViewTab(url);
+
+  yield selectJsonViewContentTab("rawdata");
+  info("Switched to Raw Data tab.");
+
+  let count = yield getElementCount(prettyPrintButtonClass);
+  return count;
+}