1411904 - [meta] Move tools from createClass to ES6 classes, PropTypes, dom-factories and React.TestUtils so that we can switch to React 16

Status: RESOLVED FIXED

(DevTools :: General, enhancement, P2)

Description

[Mike Ratcliffe [:miker] [:mratcliffe] [:mikeratcliffe]]

Aside from the benefits that PureComponent would bring us, this will move us much closer to being able to use React 16, which brings large performance gains (it renders 30% - 300% faster).

Comment 1

[Mike Ratcliffe [:miker] [:mratcliffe] [:mikeratcliffe]]

Folders containing old style components:

  - devtools/client/aboutdebugging/components/tabs/
  - devtools/client/aboutdebugging/components/
  - devtools/client/aboutdebugging/components/addons/
  - devtools/client/aboutdebugging/components/workers/

  - devtools/client/memory/components/
  - devtools/client/memory/

  - devtools/client/framework/components/

  - devtools/client/shared/components/
  - devtools/client/shared/components/tabs/
  - devtools/client/shared/components/tree/
  - devtools/client/shared/components/test/mochitest/
  - devtools/client/shared/components/splitter/
  - devtools/client/shared/components/reps/

  - devtools/client/dom/content/components/
  - devtools/client/performance/components/
  - devtools/client/jsonview/components/
  - devtools/client/jsonview/components/reps/
  - devtools/client/responsive.html/components/
  - devtools/client/responsive.html/

  - devtools/client/inspector/test/browser_inspector_addSidebarTab.js
  - devtools/client/debugger/new/debugger.js

Github repos that still contain old components (or references to those components):

  - https://github.com/devtools-html/debugger.html
  - https://github.com/devtools-html/devtools-core

Comment 2

[Mike Ratcliffe [:miker] [:mratcliffe] [:mikeratcliffe]]

Current Peers for review:

    about:debugging: jdescottes, ochameau
    Animation Inspector: gl, pbro, daisuke
    Canvas Debugger: <unmaintained>
    Console: bgrins, nchevobbe
    Debugger: jlast
    Developer Toolbar: jwalker, mikeratcliffe
    DOM: honza
    Framework: Browser integration, toolbox and test infrastructure: jryans, bgrins, ochameau, honza
    Inspector: gl, pbro, zer0, jdescottes, tromey
    JSON Viewer: honza
    Memory: gregtatum
    Network Monitor: honza, rickychien, gasolin
    Performance: gregtatum
    Remote protocol and server infrastructure: jryans, ochameau
    Responsive Design Mode: jryans, zer0
    Scratchpad: jdescottes
    Shader Editor: <unmaintained>
    Style Editor: gl
    Storage Inspector: mikeratcliffe
    Themes: bgrins, ntim
    Web Audio Editor: <unmaintained>
    WebIDE: jryans, ochameau

Comment 3

[Mike Ratcliffe [:miker] [:mratcliffe] [:mikeratcliffe]]

getInitialState() is not allowed in ES6 React Components and if it is called explicitly from another method the conversion will fail.

It is simple to workaround but for the sake of consistency I think this is our best option:

```
constructor(props) {
  super(props);

  this.state = this.initialState;
}

get initialState() {
  return {
    workers: {
      service: [],
      shared: [],
      other: []
    },
    processCount: 1,
  };
}

someOtherMethod() {
  let workers = this.initialState.workers;
  ...
}
```

Comment 4

[Mike Ratcliffe [:miker] [:mratcliffe] [:mikeratcliffe]]

All dependencies satisfied.

Comment 5

[Jens Hausdorf :jens1o [ni? me]]

where are the commits for this bug?

Comment 6

[Mike Ratcliffe [:miker] [:mratcliffe] [:mikeratcliffe]]

(In reply to Jens Hausdorf from comment #5)
> where are the commits for this bug?

Meta bugs are for tracking other bugs but the do not contain any commits.