From 24cca3b23642474dd5fb9162353015e2993be19f Mon Sep 17 00:00:00 2001 From: Ra100 Date: Thu, 30 Jun 2016 14:55:24 +0200 Subject: [PATCH 1/2] Fix save options Saving options didn't work because findDOMNode has moved from React to ReactDOM. Navbar component had to be renamed to NavBar. --- assets/js/components/{Navbar.jsx => NavBar.jsx} | 0 assets/js/components/Options.jsx | 17 +++++++++-------- 2 files changed, 9 insertions(+), 8 deletions(-) rename assets/js/components/{Navbar.jsx => NavBar.jsx} (100%) diff --git a/assets/js/components/Navbar.jsx b/assets/js/components/NavBar.jsx similarity index 100% rename from assets/js/components/Navbar.jsx rename to assets/js/components/NavBar.jsx diff --git a/assets/js/components/Options.jsx b/assets/js/components/Options.jsx index 61a0384..d9dd175 100644 --- a/assets/js/components/Options.jsx +++ b/assets/js/components/Options.jsx @@ -1,6 +1,7 @@ /* global chrome */ var React = require('react'); +var ReactDOM = require('react-dom'); var ReactCSSTransitionGroup = require('react-addons-css-transition-group'); var config = require('../config'); @@ -52,9 +53,9 @@ var Options = React.createClass({ loggingStyle: items.loggingStyle }); - React.findDOMNode(that.refs.theme).value = items.theme; - React.findDOMNode(that.refs.loggingType).value = items.loggingType; - React.findDOMNode(that.refs.loggingStyle).value = items.loggingStyle; + ReactDOM.findDOMNode(that.refs.theme).value = items.theme; + ReactDOM.findDOMNode(that.refs.loggingType).value = items.loggingType; + ReactDOM.findDOMNode(that.refs.loggingStyle).value = items.loggingStyle; }); }, @@ -67,9 +68,9 @@ var Options = React.createClass({ saveSettings: function () { var that = this; - var theme = React.findDOMNode(this.refs.theme).value.trim(); - var loggingType = React.findDOMNode(this.refs.loggingType).value.trim(); - var loggingStyle = React.findDOMNode(this.refs.loggingStyle).value.trim(); + var theme = ReactDOM.findDOMNode(this.refs.theme).value.trim(); + var loggingType = ReactDOM.findDOMNode(this.refs.loggingType).value.trim(); + var loggingStyle = ReactDOM.findDOMNode(this.refs.loggingStyle).value.trim(); // Trimming blacklist and whitelist removes blank lines and spaces. var blacklist = that.state.blacklist.trim(); var whitelist = that.state.whitelist.trim(); @@ -95,7 +96,7 @@ var Options = React.createClass({ }, _displayBlackOrWhiteList: function () { - var loggingStyle = React.findDOMNode(this.refs.loggingStyle).value.trim(); + var loggingStyle = ReactDOM.findDOMNode(this.refs.loggingStyle).value.trim(); this.setState({loggingStyle: loggingStyle}); }, @@ -156,7 +157,7 @@ var Options = React.createClass({
- + {alert()} From 7d90992aaced75c3a651912b637627861101e9d1 Mon Sep 17 00:00:00 2001 From: Ra100 Date: Thu, 30 Jun 2016 15:05:04 +0200 Subject: [PATCH 2/2] Remove findDOMNode and rename all Navbar to NavBar findDOMNode should be avaided --- assets/js/components/NavBar.jsx | 4 ++-- assets/js/components/Options.jsx | 15 +++++++-------- 2 files changed, 9 insertions(+), 10 deletions(-) diff --git a/assets/js/components/NavBar.jsx b/assets/js/components/NavBar.jsx index a43283c..5b2e09a 100644 --- a/assets/js/components/NavBar.jsx +++ b/assets/js/components/NavBar.jsx @@ -1,6 +1,6 @@ var React = require('react'); -var Navbar = React.createClass({ +var NavBar = React.createClass({ render: function() { @@ -86,4 +86,4 @@ var Navbar = React.createClass({ }); -module.exports = Navbar; +module.exports = NavBar; diff --git a/assets/js/components/Options.jsx b/assets/js/components/Options.jsx index d9dd175..ed637f4 100644 --- a/assets/js/components/Options.jsx +++ b/assets/js/components/Options.jsx @@ -1,7 +1,6 @@ /* global chrome */ var React = require('react'); -var ReactDOM = require('react-dom'); var ReactCSSTransitionGroup = require('react-addons-css-transition-group'); var config = require('../config'); @@ -53,9 +52,9 @@ var Options = React.createClass({ loggingStyle: items.loggingStyle }); - ReactDOM.findDOMNode(that.refs.theme).value = items.theme; - ReactDOM.findDOMNode(that.refs.loggingType).value = items.loggingType; - ReactDOM.findDOMNode(that.refs.loggingStyle).value = items.loggingStyle; + that.refs.theme.value = items.theme; + that.refs.loggingType.value = items.loggingType; + that.refs.loggingStyle.value = items.loggingStyle; }); }, @@ -68,9 +67,9 @@ var Options = React.createClass({ saveSettings: function () { var that = this; - var theme = ReactDOM.findDOMNode(this.refs.theme).value.trim(); - var loggingType = ReactDOM.findDOMNode(this.refs.loggingType).value.trim(); - var loggingStyle = ReactDOM.findDOMNode(this.refs.loggingStyle).value.trim(); + var theme = this.refs.theme.value.trim(); + var loggingType = this.refs.loggingType.value.trim(); + var loggingStyle = this.refs.loggingStyle.value.trim(); // Trimming blacklist and whitelist removes blank lines and spaces. var blacklist = that.state.blacklist.trim(); var whitelist = that.state.whitelist.trim(); @@ -96,7 +95,7 @@ var Options = React.createClass({ }, _displayBlackOrWhiteList: function () { - var loggingStyle = ReactDOM.findDOMNode(this.refs.loggingStyle).value.trim(); + var loggingStyle = this.refs.loggingStyle.value.trim(); this.setState({loggingStyle: loggingStyle}); },