Bug 1475208 - (Part 1) Introduce uniqueID to font editor Redux store. r=gl

MozReview-Commit-ID: AQCTvvE9YZu

--HG--
extra : rebase_source : 2a2ecb5fac81bba582e74f7bfc9fa05091c75cca

devtools/client/inspector/fonts/actions/font-editor.js

@@ -44,12 +44,14 @@ module.exports = {
     };
   },
 
-  updateFontEditor(fonts, families = { used: [], notUsed: [] }, properties = {}) {
+  updateFontEditor(fonts, families = { used: [], notUsed: [] }, properties = {},
+                   id = "") {
     return {
       type: UPDATE_EDITOR_STATE,
       fonts,
       families,
       properties,
+      id,
     };
   },
 

devtools/client/inspector/fonts/components/FontEditor.js

@@ -201,6 +201,7 @@ class FontEditor extends PureComponent {
 
   renderFontSize(value) {
     return value && FontSize({
+      key: this.props.fontEditor.id,
       onChange: this.props.onPropertyChange,
       value,
     });

devtools/client/inspector/fonts/fonts.js

@@ -956,7 +956,7 @@ class FontInspector {
       fontsUsed = otherVarFonts.length ? otherVarFonts : fonts;
     }
 
-    this.store.dispatch(updateFontEditor(fontsUsed, families, properties));
+    this.store.dispatch(updateFontEditor(fontsUsed, families, properties, node.actorID));
     this.inspector.emit("fonteditor-updated");
     // Listen to manual changes in the Rule view that could update the Font Editor state
     this.ruleView.on("property-value-updated", this.onRulePropertyUpdated);

devtools/client/inspector/fonts/reducers/font-editor.js

@@ -39,7 +39,8 @@ const INITIAL_STATE = {
   },
   // CSS font properties defined on the selected rule.
   properties: {},
-
+  // Unique identifier for the selected element.
+  id: "",
   // Warning message with the reason why the font editor cannot be shown.
   warning: getStr("fontinspector.noFontsOnSelectedElement"),
 };
@@ -82,7 +83,7 @@ const reducers = {
     return newState;
   },
 
-  [UPDATE_EDITOR_STATE](state, { fonts, families, properties }) {
+  [UPDATE_EDITOR_STATE](state, { fonts, families, properties, id }) {
     const axes = parseFontVariationAxes(properties["font-variation-settings"]);
 
     // If not defined in font-variation-settings, setup "wght" axis with the value of
@@ -102,7 +103,7 @@ const reducers = {
       axes.wdth = match[1];
     }
 
-    return { ...state, axes, fonts, families, properties };
+    return { ...state, axes, fonts, families, properties, id };
   },
 
   [UPDATE_PROPERTY_VALUE](state, { property, value }) {