--- a/devtools/client/dom/content/components/main-toolbar.js
+++ b/devtools/client/dom/content/components/main-toolbar.js
@@ -47,22 +47,24 @@ class MainToolbar extends Component {
   onSearch(value) {
     this.props.dispatch(setVisibilityFilter(value));
   }
 
   render() {
     return (
       Toolbar({},
         ToolbarButton({
+          key: "refresh",
           className: "refresh devtools-button",
           id: "dom-refresh-button",
           title: l10n.getStr("dom.refresh"),
           onClick: this.onRefresh
         }),
         SearchBox({
+          key: "filter",
           delay: 250,
           onChange: this.onSearch,
           placeholder: l10n.getStr("dom.filterDOMPanel"),
           type: "filter"
         })
       )
     );
   }

--- a/devtools/client/framework/components/toolbox-tabs.js
+++ b/devtools/client/framework/components/toolbox-tabs.js
@@ -89,16 +89,17 @@ class ToolboxTabs extends Component {
       focusButton,
       focusedButton,
       highlightedTools,
       panelDefinitions,
       selectTool,
     } = this.props;
 
     let tabs = panelDefinitions.map(panelDefinition => ToolboxTab({
+      key: panelDefinition.id,
       currentToolId,
       focusButton,
       focusedButton,
       highlightedTools,
       panelDefinition,
       selectTool,
     }));
 

--- a/devtools/client/inspector/boxmodel/components/BoxModelProperties.js
+++ b/devtools/client/inspector/boxmodel/components/BoxModelProperties.js
@@ -58,20 +58,21 @@ class BoxModelProperties extends PureCom
         referenceElement: this.props.boxModel.offsetParent,
         referenceElementType: BOXMODEL_L10N.getStr("boxmodel.offsetParent")
       };
     }
 
     return {};
   }
 
-  onToggleExpander() {
+  onToggleExpander(event) {
     this.setState({
       isOpen: !this.state.isOpen,
     });
+    event.stopPropagation();
   }
 
   render() {
     let {
       boxModel,
       setSelectedNode,
       onHideBoxModelHighlighter,
       onShowBoxModelHighlighterForNode,

--- a/devtools/client/inspector/fonts/fonts.js
+++ b/devtools/client/inspector/fonts/fonts.js
@@ -33,16 +33,21 @@ class FontInspector {
 
     this.onNewNode = this.onNewNode.bind(this);
     this.onPreviewFonts = this.onPreviewFonts.bind(this);
     this.onThemeChanged = this.onThemeChanged.bind(this);
 
     this.init();
   }
 
+  componentWillMount() {
+    this.store.dispatch(updatePreviewText(""));
+    this.update(false, "");
+  }
+
   init() {
     if (!this.inspector) {
       return;
     }
 
     let fontsApp = FontsApp({
       onPreviewFonts: this.onPreviewFonts,
     });
@@ -57,19 +62,16 @@ class FontInspector {
     // Expose the provider to let inspector.js use it in setupSidebar.
     this.provider = provider;
 
     this.inspector.selection.on("new-node-front", this.onNewNode);
     this.inspector.sidebar.on("fontinspector-selected", this.onNewNode);
 
     // Listen for theme changes as the color of the previews depend on the theme
     gDevTools.on("theme-switched", this.onThemeChanged);
-
-    this.store.dispatch(updatePreviewText(""));
-    this.update(false, "");
   }
 
   /**
    * Given all fonts on the page, and given the fonts used in given node, return all fonts
    * not from the page not used in this node.
    *
    * @param  {Array} allFonts
    *         All fonts used on the entire page

--- a/devtools/client/memory/components/SnapshotListItem.js
+++ b/devtools/client/memory/components/SnapshotListItem.js
@@ -89,17 +89,16 @@ class SnapshotListItem extends Component
     let saveLink = !snapshot.path ? void 0 : dom.a({
       onClick: () => onSave(snapshot),
       className: "save",
     }, L10N.getStr("snapshot.io.save"));
 
     let deleteButton = !snapshot.path ? void 0 : dom.div({
       onClick: () => onDelete(snapshot),
       className: "delete",
-      "aria-role": "button",
       title: L10N.getStr("snapshot.io.delete")
     });
 
     return (
       dom.li({ className, onClick },
         dom.span({
           className: `snapshot-title ${wantThrobber ? " devtools-throbber" : ""}`
         },

--- a/devtools/client/memory/components/Toolbar.js
+++ b/devtools/client/memory/components/Toolbar.js
@@ -200,17 +200,16 @@ class Toolbar extends Component {
         {
           title: L10N.getStr("toolbar.view.tooltip"),
         },
         L10N.getStr("toolbar.view"),
         dom.select(
           {
             id: "select-view",
             onChange: e => onViewChange(e.target.value),
-            defaultValue: view,
             value: view.state,
           },
           dom.option(
             {
               value: viewState.TREE_MAP,
               title: L10N.getStr("toolbar.view.treemap.tooltip"),
             },
             L10N.getStr("toolbar.view.treemap")

--- a/devtools/client/netmonitor/src/components/MonitorPanel.js
+++ b/devtools/client/netmonitor/src/components/MonitorPanel.js
@@ -36,17 +36,17 @@ const MediaQueryList = window.matchMedia
 class MonitorPanel extends Component {
   static get propTypes() {
     return {
       connector: PropTypes.object.isRequired,
       isEmpty: PropTypes.bool.isRequired,
       networkDetailsOpen: PropTypes.bool.isRequired,
       openNetworkDetails: PropTypes.func.isRequired,
       request: PropTypes.object,
-      selectedRequestVisible: PropTypes.func.isRequired,
+      selectedRequestVisible: PropTypes.bool.isRequired,
       sourceMapService: PropTypes.object,
       openLink: PropTypes.func,
       updateRequest: PropTypes.func.isRequired,
     };
   }
 
   constructor(props) {
     super(props);
@@ -108,18 +108,18 @@ class MonitorPanel extends Component {
     let initialHeight = Services.prefs.getIntPref(
         "devtools.netmonitor.panes-network-details-height");
 
     return (
       div({ className: "monitor-panel" },
         Toolbar({ connector }),
         SplitBox({
           className: "devtools-responsive-container",
-          initialWidth: `${initialWidth}px`,
-          initialHeight: `${initialHeight}px`,
+          initialWidth: initialWidth,
+          initialHeight: initialHeight,
           minSize: "50px",
           maxSize: "80%",
           splitterSize: 1,
           startPanel: RequestList({ isEmpty, connector }),
           endPanel: networkDetailsOpen && NetworkDetailsPanel({
             ref: "endPanel",
             connector,
             openLink,

--- a/devtools/client/netmonitor/src/components/RequestListContent.js
+++ b/devtools/client/netmonitor/src/components/RequestListContent.js
@@ -58,17 +58,17 @@ class RequestListContent extends Compone
       onItemMouseDown: PropTypes.func.isRequired,
       onSecurityIconMouseDown: PropTypes.func.isRequired,
       onSelectDelta: PropTypes.func.isRequired,
       onWaterfallMouseDown: PropTypes.func.isRequired,
       openStatistics: PropTypes.func.isRequired,
       scale: PropTypes.number,
       selectedRequest: PropTypes.object,
       sortedRequests: PropTypes.array.isRequired,
-      requestFilterTypes: PropTypes.string.isRequired,
+      requestFilterTypes: PropTypes.object.isRequired,
     };
   }
 
   constructor(props) {
     super(props);
     this.isScrolledToBottom = this.isScrolledToBottom.bind(this);
     this.onHover = this.onHover.bind(this);
     this.onScroll = this.onScroll.bind(this);

--- a/devtools/client/netmonitor/src/components/RequestListItem.js
+++ b/devtools/client/netmonitor/src/components/RequestListItem.js
@@ -133,17 +133,17 @@ class RequestListItem extends Component 
       firstRequestStartedMillis: PropTypes.number.isRequired,
       fromCache: PropTypes.bool,
       onCauseBadgeMouseDown: PropTypes.func.isRequired,
       onContextMenu: PropTypes.func.isRequired,
       onFocusedNodeChange: PropTypes.func,
       onMouseDown: PropTypes.func.isRequired,
       onSecurityIconMouseDown: PropTypes.func.isRequired,
       onWaterfallMouseDown: PropTypes.func.isRequired,
-      requestFilterTypes: PropTypes.string.isRequired,
+      requestFilterTypes: PropTypes.object.isRequired,
       waterfallWidth: PropTypes.number,
     };
   }
 
   componentDidMount() {
     if (this.props.isSelected) {
       this.refs.listItem.focus();
     }

--- a/devtools/client/performance/components/waterfall-header.js
+++ b/devtools/client/performance/components/waterfall-header.js
@@ -28,16 +28,17 @@ function WaterfallHeader(props) {
 
   let ticks = [];
   for (let x = 0; x < waterfallWidth; x += tickInterval) {
     let left = x + WATERFALL_HEADER_TEXT_PADDING;
     let time = Math.round(x / dataScale + startTime);
     let label = L10N.getFormatStr("timeline.tick", time);
 
     let node = dom.div({
+      key: x,
       className: "plain waterfall-header-tick",
       style: { transform: `translateX(${left}px)` }
     }, label);
     ticks.push(node);
   }
 
   return dom.div(
     { className: "waterfall-header" },

--- a/devtools/client/shared/components/Frame.js
+++ b/devtools/client/shared/components/Frame.js
@@ -20,17 +20,17 @@ class Frame extends Component {
       // SavedFrame, or an object containing all the required properties.
       frame: PropTypes.shape({
         functionDisplayName: PropTypes.string,
         source: PropTypes.string.isRequired,
         line: PropTypes.oneOfType([ PropTypes.string, PropTypes.number ]),
         column: PropTypes.oneOfType([ PropTypes.string, PropTypes.number ]),
       }).isRequired,
       // Clicking on the frame link -- probably should link to the debugger.
-      onClick: PropTypes.func.isRequired,
+      onClick: PropTypes.func,
       // Option to display a function name before the source link.
       showFunctionName: PropTypes.bool,
       // Option to display a function name even if it's anonymous.
       showAnonymousFunctionName: PropTypes.bool,
       // Option to display a host name after the source link.
       showHost: PropTypes.bool,
       // Option to display a host name if the filename is empty or just '/'
       showEmptyPathAsHost: PropTypes.bool,

--- a/devtools/client/shared/components/splitter/SplitBox.js
+++ b/devtools/client/shared/components/splitter/SplitBox.js
@@ -17,25 +17,37 @@ const Draggable = createFactory(require(
 class SplitBox extends Component {
   static get propTypes() {
     return {
       // Custom class name. You can use more names separated by a space.
       className: PropTypes.string,
       // Initial size of controlled panel.
       initialSize: PropTypes.string,
       // Initial width of controlled panel.
-      initialWidth: PropTypes.string,
+      initialWidth: PropTypes.oneOfType([
+        PropTypes.number,
+        PropTypes.string
+      ]),
       // Initial height of controlled panel.
-      initialHeight: PropTypes.string,
+      initialHeight: PropTypes.oneOfType([
+        PropTypes.number,
+        PropTypes.string
+      ]),
       // Left/top panel
       startPanel: PropTypes.any,
       // Min panel size.
-      minSize: PropTypes.string,
+      minSize: PropTypes.oneOfType([
+        PropTypes.number,
+        PropTypes.string
+      ]),
       // Max panel size.
-      maxSize: PropTypes.string,
+      maxSize: PropTypes.oneOfType([
+        PropTypes.number,
+        PropTypes.string
+      ]),
       // Right/bottom panel
       endPanel: PropTypes.any,
       // True if the right/bottom panel should be controlled.
       endPanelControl: PropTypes.bool,
       // Size of the splitter handle bar.
       splitterSize: PropTypes.number,
       // True if the splitter bar is vertical (default is vertical).
       vert: PropTypes.bool,

--- a/devtools/client/webconsole/new-console-output/components/ConsoleOutput.js
+++ b/devtools/client/webconsole/new-console-output/components/ConsoleOutput.js
@@ -26,17 +26,17 @@ const {
   getInitialMessageCountForViewport
 } = require("devtools/client/webconsole/new-console-output/utils/messages.js");
 
 class ConsoleOutput extends Component {
   static get propTypes() {
     return {
       initialized: PropTypes.bool.isRequired,
       messages: PropTypes.object.isRequired,
-      messagesUi: PropTypes.object.isRequired,
+      messagesUi: PropTypes.array.isRequired,
       serviceContainer: PropTypes.shape({
         attachRefToHud: PropTypes.func.isRequired,
         openContextMenu: PropTypes.func.isRequired,
         sourceMapService: PropTypes.object,
       }),
       dispatch: PropTypes.func.isRequired,
       timestampsVisible: PropTypes.bool,
       messagesTableData: PropTypes.object.isRequired,

--- a/devtools/client/webconsole/new-console-output/components/Message.js
+++ b/devtools/client/webconsole/new-console-output/components/Message.js
@@ -41,17 +41,16 @@ class Message extends Component {
       messageBody: PropTypes.any.isRequired,
       repeat: PropTypes.any,
       frame: PropTypes.any,
       attachment: PropTypes.any,
       stacktrace: PropTypes.any,
       messageId: PropTypes.string,
       scrollToMessage: PropTypes.bool,
       exceptionDocURL: PropTypes.string,
-      parameters: PropTypes.object,
       request: PropTypes.object,
       dispatch: PropTypes.func,
       timeStamp: PropTypes.number,
       timestampsVisible: PropTypes.bool.isRequired,
       serviceContainer: PropTypes.shape({
         emitNewMessage: PropTypes.func.isRequired,
         onViewSourceInDebugger: PropTypes.func,
         onViewSourceInScratchpad: PropTypes.func,
@@ -256,17 +255,17 @@ class Message extends Component {
     },
       timestampEl,
       MessageIndent({indent}),
       icon,
       collapse,
       dom.span({ className: "message-body-wrapper" },
         dom.span({
           className: "message-flex-body",
-          onClick: collapsible && this.toggleMessage,
+          onClick: collapsible ? this.toggleMessage : undefined,
         },
           // Add whitespaces for formatting when copying to the clipboard.
           timestampEl ? " " : null,
           dom.span({ className: "message-body devtools-monospace" },
             ...bodyElements,
             learnMore
           ),
           repeat ? " " : null,