Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

inferno 5.x getChildContext issue #1369

Closed
tianyingchun opened this issue Jul 23, 2018 · 2 comments
Closed

inferno 5.x getChildContext issue #1369

tianyingchun opened this issue Jul 23, 2018 · 2 comments
Labels

Comments

@tianyingchun
Copy link

tianyingchun commented Jul 23, 2018

Observed Behaviour

while use getChildContext() we cannot update child component while state changed while hoc component, please see inferno test code

import { render, Component } from 'inferno';
class Form extends Component<any, any> {

  public handleClick = () => {
    this.forceUpdate();
  }
  public static childContextTypes = {

  };

  public getChildContext() {
    return {

    };
  }

  public render() {
    const { children, ...restProps } = this.props;
    return (
      <div {...restProps}>
        <button onClick={this.handleClick}>test</button>
        {children}
      </div>
    );
  }
}

class Test extends Component {
  public render() {
    // while click `test` button it should be render again and again
    // it works perfectly in react.16.4 but breaks in inferno 5.3.0
    console.log('test');
    return (
      <div>hello test</div>
    );
  }
}

class App extends Component {
  public render() {
    return (
      <Form>
        <div>
          <div>
            {/* Note there is nested div wrapper  */}
            <Test />
          </div>
        </div>
      </Form>
    );
  }
}

render(<App />, document.getElementById('app'));
(document.querySelector('#global-spinner') as any).remove();

Expected Current Behaviour

it works like react as below code

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

  handleClick = () => {
    this.forceUpdate();
  }

  static childContextTypes = {

  };

  getChildContext() {
    return {

    };
  }

  render() {
    const { children, ...restProps } = this.props;
    return (
      <div {...restProps}>
        <button onClick={this.handleClick}>test</button>
        {children}
      </div>
    );
  }
}
class Test extends Component {
  render() {
    console.log('test');
    return (
      <div>hello test</div>
    );
  }
}
class App extends Component {
   render() {
    return (
      <Form>
        <div>
          <div>
            <Test />
          </div>
        </div>
      </Form>
    );
  }
}

ReactDOM.render(<App />, document.getElementById('root'));

Inferno Metadata

macOS
Safari

@tianyingchun
Copy link
Author

tianyingchun commented Jul 23, 2018

react it works perfectly, output test, test ,, again in
console.log('test');

@Havunen Havunen added the bug label Aug 6, 2018
Havunen added a commit that referenced this issue Aug 7, 2018
…ere can be custom logic, context changes etc. Fixes Github #1369 and Github #1345 Separated also textNode handling from contentEditable elements by adding new vNodeFlag this improves performance when no contentEditable elements are used and fixes Github #1186
@Havunen
Copy link
Member

Havunen commented Aug 7, 2018

Thanks for reporting the issue @tianyingchun . This is now fixed in dev. Fix will be available in next release

@Havunen Havunen closed this as completed Aug 7, 2018
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Development

No branches or pull requests

2 participants