From b2c6abe5f850df41d958b7b9fc76d345abf55d04 Mon Sep 17 00:00:00 2001
From: Razvan Caliman <rcaliman@mozilla.com>
Date: Wed, 6 Jun 2018 14:34:19 +0200
Subject: [PATCH] Bug 1464796 - (Part 3) Show metadata for all used fonts.
 r=pbro

MozReview-Commit-ID: cImy4JVAcu

--HG--
extra : rebase_source : 0163c244ae050e06f2f1ff65d76731382789d77d
---
 .../inspector/fonts/components/FontEditor.js   | 18 ++++++++++++++----
 1 file changed, 14 insertions(+), 4 deletions(-)

diff --git a/devtools/client/inspector/fonts/components/FontEditor.js b/devtools/client/inspector/fonts/components/FontEditor.js
index 732fac8d57aa..8b0f8e1e1504 100644
--- a/devtools/client/inspector/fonts/components/FontEditor.js
+++ b/devtools/client/inspector/fonts/components/FontEditor.js
@@ -79,8 +79,16 @@ class FontEditor extends PureComponent {
       });
     });
   }
-
-  renderFontFamily(font, onToggleFontHighlight) {
+  /**
+   * Render font family, font name, and metadata for all fonts used on selected node.
+   *
+   * @param {Array} fonts
+   *        Fonts used on selected node.
+   * @param {Function} onToggleFontHighlight
+   *        Callback to trigger in-context highlighting of text that uses a font.
+   * @return {DOMNode}
+   */
+  renderFontFamily(fonts, onToggleFontHighlight) {
     return dom.label(
       {
         className: "font-control font-control-family",
@@ -95,7 +103,9 @@ class FontEditor extends PureComponent {
         {
           className: "font-control-box",
         },
-        FontMeta({ font, onToggleFontHighlight })
+        fonts.map(font => {
+          return FontMeta({ font, onToggleFontHighlight });
+        })
       )
     );
   }
@@ -198,7 +208,7 @@ class FontEditor extends PureComponent {
     return dom.div(
       {},
       // Always render UI for font family, format and font file URL.
-      this.renderFontFamily(font, onToggleFontHighlight),
+      this.renderFontFamily(fonts, onToggleFontHighlight),
       // Render UI for font variation instances if they are defined.
       hasFontInstances && this.renderInstances(font.variationInstances, instance),
       // Always render UI for font size.