To type or not to type

FlowTester.js

// @flow

import React, {Component} from 'react';
import ReactDOM from 'react-dom';

type TestDetails<T: HTMLElement> = {
  node: HTMLElement,
};

type Props = {
  children?: React$Element<any>,
  onTestReady?: <T: HTMLElement>(details: TestDetails<T>) => void,
};

export default class Tester extends Component {
  props: Props;

  performTest() {
    const {onTestReady, children} = this.props;

    if (children == null || onTestReady == null) {
      return;
    }

    onTestReady({node: ReactDOM.findDOMNode(this).children[0]});
  }

  componentDidMount() {
    this.performTest();
  }

  componentDidUpdate() {
    this.performTest();
  }

  render() {
    const {children} = this.props;
    if (children == null) { return null; }
    return <div>{children}</div>;
  }
}

TypeScriptTester.tsx

import * as React from 'react';
import {findDOMNode} from 'react-dom';

interface TestDetails<E extends HTMLElement> {
  node: E,
}

interface Props {
  children?: React.ReactNode,
  onReady: <E extends HTMLElement>(details: TestDetails<E>) => void,
}

export default class Tester extends React.Component<Props, {}> {
  private performTest() {
    const {onReady, children} = this.props;

    if (children == null) { return; }

    onReady({
      node: findDOMNode(this).children[0],
    })
  }

  componentDidMount() {
    this.performTest();
  }

  componentDidUpdate() {
    this.performTest();
  }

  render() {
    const {children} = this.props;
    if (children == null) { return null; }

    return <div>{children}</div>;
  }
}

VanillaTester.js

import React, {Component, PropTypes} from 'react';
import {findDOMNode} from 'react-dom';

export default class Tester extends Component {
  static propTypes = {
    children: PropTypes.node,
    onReady: PropTypes.func,
  };
  
  performTest() {
    const {onReady, children} = this.props;

    if (children == null) { return; }

    onReady({
      node: findDOMNode(this).children[0],
    })
  }

  componentDidMount() {
    this.performTest();
  }

  componentDidUpdate() {
    this.performTest();
  }

  render() {
    const {children} = this.props;
    if (children == null) { return null; }

    return <div>{children}</div>;
  }
}