JSX/TSX: Proper way to use State types

[mikemorton]

Consider this example:

class ToggleState {
    open:boolean
}
class AnimationDemo extends React.Component<{}, ToggleState>
{
  state:ToggleState;
  constructor () {
    super()
    this.state = {open : false, fdsa: 'asdf'};
  }
  getInitialState():ToggleState {
    return {open: false};
  }
  handleMouseDown() {
    this.setState({open: !this.state.open, fdsa: 'asdf'});
  }
  render() {
    return (
      <div>something</div>
    );
  }
};

There doesn't seem to be any guarding against assigning bad values in the state property or passing them into setState.

Note that if I attempt to return something invalid from getInitialState it fails correctly, however React doesn't respect getInitialState unless the component is created with React.createClass(). (See the example here: https://facebook.github.io/react/blog/2015/01/27/react-v0.13.0-beta-1.html#es6-classes)

So is it possible for me ensure that the state property and setState are guarded correctly?

[danquirk]

tagging @RyanCavanaugh

[RyanCavanaugh]

This is just a manifestation of the general problem of surplus properties in object literals (#391). Pull request #3823 (in progress) will cause the fsda properties to error.