Bug 1437230 - Remove feed binding and build DOM using JS. r=Gijs draft
authorTim Nguyen <ntim.bugs@gmail.com>
Mon, 19 Feb 2018 12:45:03 +0000
changeset 756954 f04f162c25c56d9157431b1e2c72dee1cfd40f3b
parent 756731 c3d8569f3a93a06b092a2764d6495b9dcdd066df
push id99597
push userbmo:ntim.bugs@gmail.com
push dateMon, 19 Feb 2018 12:45:38 +0000
reviewersGijs
bugs1437230
milestone60.0a1
Bug 1437230 - Remove feed binding and build DOM using JS. r=Gijs MozReview-Commit-ID: L60wPdwTfdn
browser/base/content/pageinfo/feeds.js
browser/base/content/pageinfo/feeds.xml
browser/base/content/pageinfo/pageInfo.css
browser/base/content/test/pageinfo/browser_pageInfo.js
browser/base/jar.mn
browser/locales/en-US/chrome/browser/pageInfo.dtd
browser/locales/en-US/chrome/browser/pageInfo.properties
--- a/browser/base/content/pageinfo/feeds.js
+++ b/browser/base/content/pageinfo/feeds.js
@@ -1,32 +1,60 @@
 /* -*- indent-tabs-mode: nil; js-indent-level: 2 -*- */
 /* This Source Code Form is subject to the terms of the Mozilla Public
  * License, v. 2.0. If a copy of the MPL was not distributed with this
  * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
 
 // Via pageInfo.xul -> utilityOverlay.js
 /* import-globals-from ../utilityOverlay.js */
+/* import-globals-from ./pageInfo.js */
 
 function initFeedTab(feeds) {
-  for (let feed of feeds) {
-    let [name, type, url] = feed;
+  for (const [name, type, url] of feeds) {
     addRow(name, type, url);
   }
 
-  var feedListbox = document.getElementById("feedListbox");
+  const feedListbox = document.getElementById("feedListbox");
   document.getElementById("feedTab").hidden = feedListbox.getRowCount() == 0;
 }
 
-function onSubscribeFeed() {
-  var listbox = document.getElementById("feedListbox");
-  openUILinkIn(listbox.selectedItem.getAttribute("feedURL"), "current",
-               { ignoreAlt: true });
-}
+function addRow(name, type, url) {
+  const item = document.createElement("richlistitem");
+
+  const top = document.createElement("hbox");
+  top.setAttribute("flex", "1");
+  item.appendChild(top);
+
+  const bottom = document.createElement("hbox");
+  bottom.setAttribute("flex", "1");
+  item.appendChild(bottom);
+
+  const nameLabel = document.createElement("label");
+  nameLabel.className = "feedTitle";
+  nameLabel.textContent = name;
+  nameLabel.setAttribute("flex", "1");
+  top.appendChild(nameLabel);
 
-function addRow(name, type, url) {
-  var item = document.createElement("richlistitem");
-  item.setAttribute("feed", "true");
-  item.setAttribute("name", name);
-  item.setAttribute("type", type);
-  item.setAttribute("feedURL", url);
+  const typeLabel = document.createElement("label");
+  typeLabel.textContent = type;
+  top.appendChild(typeLabel);
+
+  const urlContainer = document.createElement("hbox");
+  urlContainer.setAttribute("flex", "1");
+  bottom.appendChild(urlContainer);
+
+  const urlLabel = document.createElement("label");
+  urlLabel.className = "text-link";
+  urlLabel.textContent = url;
+  urlLabel.setAttribute("tooltiptext", url);
+  urlLabel.addEventListener("click", ev => openUILink(this.value, ev));
+  urlContainer.appendChild(urlLabel);
+
+  const subscribeButton = document.createElement("button");
+  subscribeButton.className = "feed-subscribe";
+  subscribeButton.addEventListener("click",
+    () => openUILinkIn(url, "current", { ignoreAlt: true }));
+  subscribeButton.setAttribute("label", gBundle.getString("feedSubscribe"));
+  subscribeButton.setAttribute("accesskey", gBundle.getString("feedSubscribe.accesskey"));
+  bottom.appendChild(subscribeButton);
+
   document.getElementById("feedListbox").appendChild(item);
 }
deleted file mode 100644
--- a/browser/base/content/pageinfo/feeds.xml
+++ /dev/null
@@ -1,40 +0,0 @@
-<?xml version="1.0"?>
-<!-- This Source Code Form is subject to the terms of the Mozilla Public
-   - License, v. 2.0. If a copy of the MPL was not distributed with this
-   - file, You can obtain one at http://mozilla.org/MPL/2.0/. -->
-
-<!DOCTYPE bindings [
-  <!ENTITY % pageInfoDTD SYSTEM "chrome://browser/locale/pageInfo.dtd">
-  %pageInfoDTD;
-]>
-
-<bindings id="feedBindings"
-          xmlns="http://www.mozilla.org/xbl"
-          xmlns:xul="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"
-          xmlns:xbl="http://www.mozilla.org/xbl">
-
-  <binding id="feed" extends="chrome://global/content/bindings/richlistbox.xml#richlistitem">
-    <content>
-      <xul:vbox flex="1">
-        <xul:hbox flex="1">
-          <xul:textbox flex="1" readonly="true" xbl:inherits="value=name"
-                       class="feedTitle"/>
-          <xul:label xbl:inherits="value=type"/>
-        </xul:hbox>
-        <xul:vbox>
-          <xul:vbox align="start">
-            <xul:hbox>
-              <xul:label xbl:inherits="value=feedURL,tooltiptext=feedURL" class="text-link" flex="1"
-                         onclick="openUILink(this.value, event);" crop="end"/>
-            </xul:hbox>
-          </xul:vbox>
-        </xul:vbox>
-        <xul:hbox flex="1" class="feed-subscribe">
-          <xul:spacer flex="1"/>
-          <xul:button label="&feedSubscribe;" accesskey="&feedSubscribe.accesskey;"
-                      oncommand="onSubscribeFeed()"/>
-        </xul:hbox> 
-      </xul:vbox>
-    </content>
-  </binding>
-</bindings>
--- a/browser/base/content/pageinfo/pageInfo.css
+++ b/browser/base/content/pageinfo/pageInfo.css
@@ -7,26 +7,25 @@
   -moz-box-align: center;
 }
 
 /* Hide the radio button for the section headers */
 #viewGroup > radio > .radio-check {
   display: none;
 }
 
-
-richlistitem[feed] {
-  -moz-binding: url("chrome://browser/content/pageinfo/feeds.xml#feed");
+#feedListbox richlistitem {
+  -moz-box-orient: vertical;
 }
 
-richlistitem[feed]:not([selected="true"]) .feed-subscribe {
+#feedListbox richlistitem:not([selected="true"]) .feed-subscribe {
   display: none;
 }
 
-groupbox[closed="true"] > .groupbox-body { 
+groupbox[closed="true"] > .groupbox-body {
   visibility: collapse;
 }
 
 #thepreviewimage {
   display: block;
 /* This following entry can be removed when Bug 522850 is fixed. */
   min-width: 1px;
 }
--- a/browser/base/content/test/pageinfo/browser_pageInfo.js
+++ b/browser/base/content/test/pageinfo/browser_pageInfo.js
@@ -13,23 +13,24 @@ function test() {
   function observer(win, topic, data) {
     Services.obs.removeObserver(observer, "page-info-dialog-loaded");
     pageInfo.onFinished.push(handlePageInfo);
   }
 
   function handlePageInfo() {
     ok(pageInfo.document.getElementById("feedTab"), "Feed tab");
     let feedListbox = pageInfo.document.getElementById("feedListbox");
-    ok(feedListbox, "Feed list");
+    ok(feedListbox, "Feed list should exist.");
 
     var feedRowsNum = feedListbox.getRowCount();
-    is(feedRowsNum, 3, "Number of feeds listed");
+    is(feedRowsNum, 3, "Number of feeds listed should be correct.");
 
     for (var i = 0; i < feedRowsNum; i++) {
       let feedItem = feedListbox.getItemAtIndex(i);
-      is(feedItem.getAttribute("name"), i + 1, "Feed name");
+      let feedTitle = feedItem.querySelector(".feedTitle");
+      is(feedTitle.textContent, i + 1, "Feed name should be correct.");
     }
 
     pageInfo.close();
     gBrowser.removeCurrentTab();
     finish();
   }
 }
--- a/browser/base/jar.mn
+++ b/browser/base/jar.mn
@@ -99,17 +99,16 @@ browser.jar:
         content/browser/newtab/newTab.xhtml           (content/newtab/newTab.xhtml)
 *       content/browser/newtab/newTab.js              (content/newtab/newTab.js)
         content/browser/newtab/newTab.css             (content/newtab/newTab.css)
         content/browser/newtab/alternativeDefaultSites.json   (content/newtab/alternativeDefaultSites.json)
 *       content/browser/pageinfo/pageInfo.xul         (content/pageinfo/pageInfo.xul)
         content/browser/pageinfo/pageInfo.js          (content/pageinfo/pageInfo.js)
         content/browser/pageinfo/pageInfo.css         (content/pageinfo/pageInfo.css)
         content/browser/pageinfo/feeds.js             (content/pageinfo/feeds.js)
-        content/browser/pageinfo/feeds.xml            (content/pageinfo/feeds.xml)
         content/browser/pageinfo/permissions.js       (content/pageinfo/permissions.js)
         content/browser/pageinfo/security.js          (content/pageinfo/security.js)
         content/browser/robot.ico                     (content/robot.ico)
         content/browser/static-robot.png              (content/static-robot.png)
         content/browser/safeMode.css                  (content/safeMode.css)
         content/browser/safeMode.js                   (content/safeMode.js)
         content/browser/safeMode.xul                  (content/safeMode.xul)
         content/browser/sanitize.xul                  (content/sanitize.xul)
--- a/browser/locales/en-US/chrome/browser/pageInfo.dtd
+++ b/browser/locales/en-US/chrome/browser/pageInfo.dtd
@@ -41,18 +41,16 @@
 <!ENTITY  mediaBlockImage.accesskey "B">
 <!ENTITY  mediaSaveAs           "Save As…">
 <!ENTITY  mediaSaveAs.accesskey "A">
 <!ENTITY  mediaSaveAs2.accesskey "e">
 <!ENTITY  mediaPreview          "Media Preview:">
 
 <!ENTITY  feedTab               "Feeds">
 <!ENTITY  feedTab.accesskey     "F">
-<!ENTITY  feedSubscribe         "Subscribe">
-<!ENTITY  feedSubscribe.accesskey "u">
 
 <!ENTITY  permTab               "Permissions">
 <!ENTITY  permTab.accesskey     "P">
 <!ENTITY  permUseDefault        "Use Default">
 <!ENTITY  permAskAlways         "Always ask">
 <!ENTITY  permAllow             "Allow">
 <!ENTITY  permAllowSession      "Allow for Session">
 <!ENTITY  permHide              "Hide">
--- a/browser/locales/en-US/chrome/browser/pageInfo.properties
+++ b/browser/locales/en-US/chrome/browser/pageInfo.properties
@@ -36,16 +36,18 @@ generalQuirksMode=Quirks mode
 generalStrictMode=Standards compliance mode
 generalSize=%S KB (%S bytes)
 generalMetaTag=Meta (1 tag)
 generalMetaTags=Meta (%S tags)
 
 feedRss=RSS
 feedAtom=Atom
 feedXML=XML
+feedSubscribe=Subscribe
+feedSubscribe.accesskey=u
 
 securityNoOwner=This website does not supply ownership information.
 # LOCALIZATION NOTE (securityVisitsNumber):
 # Semi-colon list of plural forms.
 # See: https://developer.mozilla.org/en/docs/Localization_and_Plurals
 # #1 is the number of visits and can be used in all plural forms as needed, e.g.
 # for '1': 'Yes, #1 time'
 securityVisitsNumber=Yes, once;Yes, #1 times