Bug 1440532 - Use xul for the default namespace of styleeditor.xul. r?bgrins draft
authorBrendan Dahl <brendan.dahl@gmail.com>
Thu, 22 Feb 2018 17:57:41 -0800
changeset 758812 80ae02c0e086b71b46c0cb555ebfcdb514e35bfe
parent 757574 861067332bac96a44bbf41ef366f58a30476057b
push id100181
push userbmo:bdahl@mozilla.com
push dateFri, 23 Feb 2018 01:58:00 +0000
reviewersbgrins
bugs1440532
milestone60.0a1
Bug 1440532 - Use xul for the default namespace of styleeditor.xul. r?bgrins This will make it easier to include xul chunks with the preprocessor. MozReview-Commit-ID: F3aF6CqqcSK
devtools/client/styleeditor/styleeditor.xul
--- a/devtools/client/styleeditor/styleeditor.xul
+++ b/devtools/client/styleeditor/styleeditor.xul
@@ -17,204 +17,204 @@
 <?xml-stylesheet href="chrome://devtools/content/shared/widgets/widgets.css" type="text/css"?>
 <?xml-stylesheet href="chrome://devtools/content/shared/splitview.css" type="text/css"?>
 <?xml-stylesheet href="chrome://devtools/skin/chart.css" type="text/css"?>
 <?xml-stylesheet href="chrome://devtools/skin/widgets.css" type="text/css"?>
 <?xml-stylesheet href="chrome://devtools/skin/splitview.css" type="text/css"?>
 <?xml-stylesheet href="chrome://devtools/skin/styleeditor.css" type="text/css"?>
 <?xul-overlay href="chrome://global/content/editMenuOverlay.xul"?>
 
-<xul:window xmlns:xul="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"
-        xmlns="http://www.w3.org/1999/xhtml"
+<window xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"
+        xmlns:html="http://www.w3.org/1999/xhtml"
         id="style-editor-chrome-window">
 
   <script type="application/javascript"
           src="chrome://devtools/content/shared/theme-switching.js"/>
-  <xul:script type="application/javascript" src="chrome://global/content/globalOverlay.js"/>
-  <xul:script type="application/javascript" src="chrome://browser/content/utilityOverlay.js"/>
-  <xul:script type="application/javascript">
+  <script type="application/javascript" src="chrome://global/content/globalOverlay.js"/>
+  <script type="application/javascript" src="chrome://browser/content/utilityOverlay.js"/>
+  <script type="application/javascript">
     function goUpdateSourceEditorMenuItems() {
       goUpdateGlobalEditMenuItems();
 
       ['cmd_undo', 'cmd_redo', 'cmd_cut', 'cmd_paste',
        'cmd_delete', 'cmd_find', 'cmd_findAgain'].forEach(goUpdateCommand);
     }
-  </xul:script>
+  </script>
 
-  <xul:popupset id="style-editor-popups">
-    <xul:menupopup id="sourceEditorContextMenu"
-                  onpopupshowing="goUpdateSourceEditorMenuItems()">
-      <xul:menuitem id="cMenu_undo"/>
-      <xul:menuseparator/>
-      <xul:menuitem id="cMenu_cut"/>
-      <xul:menuitem id="cMenu_copy"/>
-      <xul:menuitem id="cMenu_paste"/>
-      <xul:menuitem id="cMenu_delete"/>
-      <xul:menuseparator/>
-      <xul:menuitem id="cMenu_selectAll"/>
-      <xul:menuseparator/>
-      <xul:menuitem id="se-menu-find"
+  <popupset id="style-editor-popups">
+    <menupopup id="sourceEditorContextMenu"
+               onpopupshowing="goUpdateSourceEditorMenuItems()">
+      <menuitem id="cMenu_undo"/>
+      <menuseparator/>
+      <menuitem id="cMenu_cut"/>
+      <menuitem id="cMenu_copy"/>
+      <menuitem id="cMenu_paste"/>
+      <menuitem id="cMenu_delete"/>
+      <menuseparator/>
+      <menuitem id="cMenu_selectAll"/>
+      <menuseparator/>
+      <menuitem id="se-menu-find"
         label="&findCmd.label;" accesskey="&findCmd.accesskey;" command="cmd_find"/>
-      <xul:menuitem id="cMenu_findAgain"/>
-      <xul:menuseparator/>
-      <xul:menuitem id="se-menu-gotoLine"
+      <menuitem id="cMenu_findAgain"/>
+      <menuseparator/>
+      <menuitem id="se-menu-gotoLine"
           label="&gotoLineCmd.label;"
           accesskey="&gotoLineCmd.accesskey;"
           key="key_gotoLine"
           command="cmd_gotoLine"/>
-    </xul:menupopup>
-    <xul:menupopup id="sidebar-context">
-      <xul:menuitem id="context-openlinknewtab"
+    </menupopup>
+    <menupopup id="sidebar-context">
+      <menuitem id="context-openlinknewtab"
         label="&openLinkNewTab.label;"/>
-    </xul:menupopup>
-    <xul:menupopup id="style-editor-options-popup"
-                   position="before_start">
-      <xul:menuitem id="options-origsources"
-                    type="checkbox"
-                    label="&showOriginalSources.label;"
-                    accesskey="&showOriginalSources.accesskey;"/>
-      <xul:menuitem id="options-show-media"
-                    type="checkbox"
-                    label="&showMediaSidebar.label;"
-                    accesskey="&showMediaSidebar.accesskey;"/>
-    </xul:menupopup>
-  </xul:popupset>
+    </menupopup>
+    <menupopup id="style-editor-options-popup"
+               position="before_start">
+      <menuitem id="options-origsources"
+                type="checkbox"
+                label="&showOriginalSources.label;"
+                accesskey="&showOriginalSources.accesskey;"/>
+      <menuitem id="options-show-media"
+                type="checkbox"
+                label="&showMediaSidebar.label;"
+                accesskey="&showMediaSidebar.accesskey;"/>
+    </menupopup>
+  </popupset>
 
-  <xul:commandset id="editMenuCommands"/>
+  <commandset id="editMenuCommands"/>
 
-  <xul:commandset id="sourceEditorCommands">
-    <xul:command id="cmd_gotoLine" oncommand="goDoCommand('cmd_gotoLine')"/>
-    <xul:command id="cmd_find" oncommand="goDoCommand('cmd_find')"/>
-    <xul:command id="cmd_findAgain" oncommand="goDoCommand('cmd_findAgain')"/>
-  </xul:commandset>
+  <commandset id="sourceEditorCommands">
+    <command id="cmd_gotoLine" oncommand="goDoCommand('cmd_gotoLine')"/>
+    <command id="cmd_find" oncommand="goDoCommand('cmd_find')"/>
+    <command id="cmd_findAgain" oncommand="goDoCommand('cmd_findAgain')"/>
+  </commandset>
 
-  <xul:keyset id="sourceEditorKeys"/>
+  <keyset id="sourceEditorKeys"/>
 
-  <xul:stack id="style-editor-chrome" class="loading theme-body">
+  <stack id="style-editor-chrome" class="loading theme-body">
 
-    <xul:box class="splitview-root devtools-responsive-container" context="sidebar-context">
-      <xul:box class="splitview-controller">
-        <xul:box class="splitview-main">
-          <xul:toolbar class="devtools-toolbar">
-             <xul:hbox class="devtools-toolbarbutton-group">
-              <xul:toolbarbutton class="style-editor-newButton devtools-toolbarbutton"
+    <box class="splitview-root devtools-responsive-container" context="sidebar-context">
+      <box class="splitview-controller">
+        <box class="splitview-main">
+          <toolbar class="devtools-toolbar">
+             <hbox class="devtools-toolbarbutton-group">
+              <toolbarbutton class="style-editor-newButton devtools-toolbarbutton"
                           accesskey="&newButton.accesskey;"
                           tooltiptext="&newButton.tooltip;"/>
-              <xul:toolbarbutton class="style-editor-importButton devtools-toolbarbutton"
+              <toolbarbutton class="style-editor-importButton devtools-toolbarbutton"
                           accesskey="&importButton.accesskey;"
                           tooltiptext="&importButton.tooltip;"/>
-            </xul:hbox>
-            <xul:spacer/>
-            <xul:toolbarbutton id="style-editor-options"
+            </hbox>
+            <spacer/>
+            <toolbarbutton id="style-editor-options"
                         class="devtools-toolbarbutton devtools-option-toolbarbutton"
                         tooltiptext="&optionsButton.tooltip;"
                         popup="style-editor-options-popup"/>
-          </xul:toolbar>
-        </xul:box>
-        <xul:box id="splitview-resizer-target" class="theme-sidebar splitview-nav-container"
+          </toolbar>
+        </box>
+        <box id="splitview-resizer-target" class="theme-sidebar splitview-nav-container"
                 persist="height">
-          <ol class="splitview-nav" tabindex="0"></ol>
-          <div class="splitview-nav placeholder empty">
-            <p><strong>&noStyleSheet.label;</strong></p>
-            <p>&noStyleSheet-tip-start.label;
-              <a href="#"
-                class="style-editor-newButton">&noStyleSheet-tip-action.label;</a>
-              &noStyleSheet-tip-end.label;</p>
-          </div>
-        </xul:box> <!-- .splitview-nav-container -->
-      </xul:box>   <!-- .splitview-controller -->
-      <xul:splitter class="devtools-side-splitter devtools-invisible-splitter"/>
-      <xul:box class="splitview-side-details devtools-main-content"/>
+          <html:ol class="splitview-nav" tabindex="0"></html:ol>
+          <html:div class="splitview-nav placeholder empty">
+            <html:p><html:strong>&noStyleSheet.label;</html:strong></html:p>
+            <html:p>&noStyleSheet-tip-start.label;
+              <html:a href="#"
+                class="style-editor-newButton">&noStyleSheet-tip-action.label;</html:a>
+              &noStyleSheet-tip-end.label;</html:p>
+          </html:div>
+        </box> <!-- .splitview-nav-container -->
+      </box>   <!-- .splitview-controller -->
+      <splitter class="devtools-side-splitter devtools-invisible-splitter"/>
+      <box class="splitview-side-details devtools-main-content"/>
 
-      <div id="splitview-templates" hidden="true">
-        <li id="splitview-tpl-summary-stylesheet" tabindex="0">
-          <xul:label class="stylesheet-enabled" tabindex="0"
+      <html:div id="splitview-templates" hidden="true">
+        <html:li id="splitview-tpl-summary-stylesheet" tabindex="0">
+          <label class="stylesheet-enabled" tabindex="0"
             tooltiptext="&visibilityToggle.tooltip;"
-            accesskey="&saveButton.accesskey;"></xul:label>
-          <hgroup class="stylesheet-info">
-            <h1><a class="stylesheet-name" tabindex="0"><xul:label crop="center"/></a></h1>
-            <div class="stylesheet-more">
-              <h3 class="stylesheet-title"></h3>
-              <h3 class="stylesheet-linked-file"></h3>
-              <h3 class="stylesheet-rule-count"></h3>
-              <xul:spacer/>
-              <h3><xul:label class="stylesheet-saveButton"
+            accesskey="&saveButton.accesskey;"></label>
+          <html:hgroup class="stylesheet-info">
+            <html:h1><html:a class="stylesheet-name" tabindex="0"><label crop="center"/></html:a></html:h1>
+            <html:div class="stylesheet-more">
+              <html:h3 class="stylesheet-title"></html:h3>
+              <html:h3 class="stylesheet-linked-file"></html:h3>
+              <html:h3 class="stylesheet-rule-count"></html:h3>
+              <spacer/>
+              <html:h3><label class="stylesheet-saveButton"
                     tooltiptext="&saveButton.tooltip;"
-                    accesskey="&saveButton.accesskey;">&saveButton.label;</xul:label></h3>
-            </div>
-          </hgroup>
-        </li>
+                    accesskey="&saveButton.accesskey;">&saveButton.label;</label></html:h3>
+            </html:div>
+          </html:hgroup>
+        </html:li>
 
-        <xul:box id="splitview-tpl-details-stylesheet" class="splitview-details">
-          <xul:hbox class="stylesheet-details-container">
-            <xul:box class="stylesheet-editor-input textbox"
-                     data-placeholder="&editorTextbox.placeholder;"/>
-            <xul:splitter class="devtools-side-splitter"/>
-            <xul:vbox class="stylesheet-sidebar theme-sidebar" hidden="true">
-              <xul:toolbar class="devtools-toolbar">
+        <box id="splitview-tpl-details-stylesheet" class="splitview-details">
+          <hbox class="stylesheet-details-container">
+            <box class="stylesheet-editor-input textbox"
+                 data-placeholder="&editorTextbox.placeholder;"/>
+            <splitter class="devtools-side-splitter"/>
+            <vbox class="stylesheet-sidebar theme-sidebar" hidden="true">
+              <toolbar class="devtools-toolbar">
                 &mediaRules.label;
-              </xul:toolbar>
-              <xul:vbox class="stylesheet-media-container" flex="1">
-                <div class="stylesheet-media-list" />
-              </xul:vbox>
-            </xul:vbox>
-          </xul:hbox>
-        </xul:box>
-      </div> <!-- #splitview-templates -->
-    </xul:box>   <!-- .splitview-root -->
+              </toolbar>
+              <vbox class="stylesheet-media-container" flex="1">
+                <html:div class="stylesheet-media-list" />
+              </vbox>
+            </vbox>
+          </hbox>
+        </box>
+      </html:div> <!-- #splitview-templates -->
+    </box>   <!-- .splitview-root -->
 
-    <xul:box class="csscoverage-template" hidden="true">
-      <xul:toolbar class="devtools-toolbar csscoverage-toolbar">
-        <xul:button class="devtools-toolbarbutton csscoverage-toolbarbutton"
+    <box class="csscoverage-template" hidden="true">
+      <toolbar class="devtools-toolbar csscoverage-toolbar">
+        <button class="devtools-toolbarbutton csscoverage-toolbarbutton"
             label="&csscoverage.backButton;"
             onclick="${onback}"/>
-      </xul:toolbar>
+      </toolbar>
       <!-- The data for this comes from CSSUsageActor.createPageReport -->
-      <div class="csscoverage-report-container">
-        <div class="csscoverage-report-content">
-          <div class="csscoverage-report-summary">
-            <div class="csscoverage-report-chart"/>
-          </div>
-          <div class="csscoverage-report-unused">
-            <h2>&csscoverage.unused;</h2>
-            <p>&csscoverage.noMatches;</p>
-            <div foreach="page in ${unused}">
-              <h3>${page.url}</h3>
-              <code foreach="rule in ${page.rules}"
-                    href="${rule.url}"
-                    class="csscoverage-list">${rule.selectorText}</code>
-            </div>
-          </div>
-          <div class="csscoverage-report-optimize">
-            <h2>&csscoverage.optimize.header;</h2>
-            <p>
+      <html:div class="csscoverage-report-container">
+        <html:div class="csscoverage-report-content">
+          <html:div class="csscoverage-report-summary">
+            <html:div class="csscoverage-report-chart"/>
+          </html:div>
+          <html:div class="csscoverage-report-unused">
+            <html:h2>&csscoverage.unused;</html:h2>
+            <html:p>&csscoverage.noMatches;</html:p>
+            <html:div foreach="page in ${unused}">
+              <html:h3>${page.url}</html:h3>
+              <html:code foreach="rule in ${page.rules}"
+                         href="${rule.url}"
+                         class="csscoverage-list">${rule.selectorText}</html:code>
+            </html:div>
+          </html:div>
+          <html:div class="csscoverage-report-optimize">
+            <html:h2>&csscoverage.optimize.header;</html:h2>
+            <html:p>
               &csscoverage.optimize.body1;
-              <code>&lt;link ...></code>
+              <html:code>&lt;link ...></html:code>
               &csscoverage.optimize.body2;
-              <code>&lt;style>...</code>
+              <html:code>&lt;style>...</html:code>
               &csscoverage.optimize.body3;
-            </p>
-            <div if="${preload.length == 0}">&csscoverage.optimize.bodyX;</div>
-            <div if="${preload.length > 0}">
-              <div foreach="page in ${preload}">
-                <h3>${page.url}</h3>
-                <textarea>&lt;style>
-<loop foreach="rule in ${page.rules}"
-                      onclick="${rule.onclick}">${rule.formattedCssText}</loop>&lt;/style></textarea>
-              </div>
-            </div>
-            <p>
+            </html:p>
+            <html:div if="${preload.length == 0}">&csscoverage.optimize.bodyX;</html:div>
+            <html:div if="${preload.length > 0}">
+              <html:div foreach="page in ${preload}">
+                <html:h3>${page.url}</html:h3>
+                <html:textarea>&lt;style>
+<html:loop foreach="rule in ${page.rules}"
+                      onclick="${rule.onclick}">${rule.formattedCssText}</html:loop>&lt;/style></html:textarea>
+              </html:div>
+            </html:div>
+            <html:p>
               &csscoverage.footer1;
-              <a target="_blank" href="&csscoverage.footer2a;">&csscoverage.footer3;</a>
+              <html:a target="_blank" href="&csscoverage.footer2a;">&csscoverage.footer3;</html:a>
               &csscoverage.footer4;
-            </p>
-          </div>
-          <p>&#160;</p>
-        </div>
-      </div>
-    </xul:box>
+            </html:p>
+          </html:div>
+          <html:p>&#160;</html:p>
+        </html:div>
+      </html:div>
+    </box>
 
-    <xul:box class="csscoverage-report" hidden="true">
-    </xul:box>
+    <box class="csscoverage-report" hidden="true">
+    </box>
 
-  </xul:stack>
+  </stack>
 
-</xul:window>
+</window>