dom - Changing the document title in React? -

i'm trying update title of document in react app. have simple needs this. title used put total component on display when you're on different tab.

this first instinct:

const react = require('react');  export default class total extends react.component {   shouldcomponentupdate(nextprops) {     //otherstuff     document.title = this.props.total.tostring();     console.log("document title: ", document.title);     return true;   }   render() {     document.title = this.props.total;     return (       <div classname="text-center">         <h1>{this.props.total}</h1>       </div>     );   } } 

i thought update document.title every time component rendered, doesn't appear anything.

not sure i'm missing here. how react runs function - maybe somewhere document variable isn't available?

edit:

i'm starting bounty question, still haven't found solution. i've updated code more recent version.

a weird development console.log does print out title i'm looking for. reason, actual title in tab isn't updating. issue same across chrome, safari, , firefox.

i think webpack-dev-server runs in iframe mode default:

https://webpack.github.io/docs/webpack-dev-server.html#iframe-mode

so might why attempts set title failing. try setting inline option true on webpack-dev-server, if haven't already.