[do not merge] Wait for feature element

[Timer]

Should fix CI.

[gaearon]

Interesting: it seems to fail for a different reason now.

[Timer]

Interesting indeed ... perhaps react is mounting div and then child components on different ticks -- which would make sense for performance reasons, and we're grabbing it too soon now (10ms vs 100ms).

[Timer]

#1274 causes the annoying errors in console. There is a bug in sockjs-client that was fixed in the release we downgraded from.

[tuchk4]

@Timer Maybe dispatch event at setState callback? Seems the result is same but less files are changed.

fixtures/kitchensink/integration/initDOM.js:

setFeature(feature) {
  this.setState({ feature }, () => window.dispatchEvent( new Event('fixture')));
}

[Timer]

@tuchk4 I'm not sure if that works because the component that is set to the state sets its own state on mount.

initDOM will set state to the feature, then feature will render -- after its first render it calls set state again, however, I believe initDOM's set state will be called after the first render, not the re-render caused by set state in componentDidMount in the feature.

[Timer]

Not everything ends up firing the event -- not sure if this is by test code design or jsdom flaw... Need to investigate more, what do you think, @EnoahNetzach?

[EnoahNetzach]

yesterday I was fiddling around with the events idea:

class BuiltEmitter extends React.Component {
  componentDidMount() {
    document.dispatchEvent(new Event('ReactFeatureDidMount'));
  }

  render() {
    return <div>{this.props.children}</div>
  }
}

// ...

class App extends React.Component {
  // ...
  render() {
    const Feature = this.state.feature;
    return Feature ? <BuiltEmitter><Feature /></BuiltEmitter> : null;
  }
}

but I wasn't able to produce a consistent output between the E2E_FILE and E2E_URL versions after the eject.

Today I'm dedicated to investigate this, but if this PR's solution is sound, I'd say to accept it.

[EnoahNetzach]

@Timer here the results EnoahNetzach/e2e-jsdom-fix.

TL;DR; it works.

It's not completely clear to me why in E2E_FILE I have to listen to window's load event and ReactFeatureDidMount is not even dispatched; while in E2E_URL the ReactFeatureDidMount event is correctly dispatched.

[EnoahNetzach]

...aaaand I spoke too early.

Just to validation, using the componentDidMount should assure all children are mounted, ergo the <div id="feature-*"> is present, isn't it?

[EnoahNetzach]

no, ok, now the problem (I don't have while running the suite locally) appears to be that promises (and await/async) are resolved too late.
It makes sense.

[Timer]

It's not completely clear to me why in E2E_FILE I have to listen to window's load event and ReactFeatureDidMount is not even dispatched; while in E2E_URL the ReactFeatureDidMount event is correctly dispatched.

I'm running into the same problem ... puzzling. 🤔

[Timer]

#1470