Console logging certain objects, like this.refs
or the window
object results in a TypeError: cyclic object value
error in the terminal.
My code is pretty basic: I'm trying to change the html on a web page (placing a react component in it).
Main.js:
var pageMod = require("sdk/page-mod");
var self = require("sdk/self");
var { MatchPattern } = require("sdk/util/match-pattern");
// Create a page mod
// It will run a script whenever a ".org" URL is loaded
// The script replaces the page contents with a message
pageMod.PageMod({
include: /.*wikipedia.org\/wiki\/.*/,
contentScriptFile: [
self.data.url("react-with-addons.js"),
self.data.url("testing.js"),
],
contentScriptWhen: "ready",
// contentStyleFile: self.data.url("style.css"),
});
testing.js:
var AppContainer = React.createClass({displayName: "AppContainer",
componentDidMount: function() {
console.log(this.refs.myRef);
console.log(window);
},
render: function() {
console.log('rendering');
return (
React.createElement("div", {ref: "myRef"})
);
}
});
React.render(React.createElement(AppContainer, null), document.getElementById('content'));
After running cfx run
, the logs in the componentDidMount do not display anything in the browser console, and the cyclic object value
displays (tried to log the window object to the console). Why is it having difficulties?