How to use the inferno-mobx.observer function in inferno-mobx

To help you get started, we’ve selected a few inferno-mobx examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github infernojs / inferno / packages / inferno-mobx / __tests__ / observer.spec.jsx View on Github external
it('does not views alive when using static rendering', () => {
    useStaticRendering(true);

    let renderCount = 0;
    const data = mobx.observable({
      z: 'hi'
    });

    const TestComponent = observer(function testComponent() {
      renderCount++;
      return <div>{data.z}</div>;
    });

    render(, container);

    expect(renderCount).toBe(1);
    expect(container.querySelector('div').textContent).toBe('hi');

    data.z = 'hello';
    // no re-rendering on static rendering

    expect(renderCount).toBe(1);

    expect(container.querySelector('div').textContent).toBe('hi');
    expect(renderCount).toBe(1);
github infernojs / inferno / packages / inferno-mobx / __tests__ / inject.spec.jsx View on Github external
it('warning is printed when changing stores', done =&gt; {
    let msg;
    const baseWarn = console.error;
    console.error = m =&gt; (msg = m);
    const a = mobx.observable.box(3);
    const C = observer(
      ['foo'],
      createClass({
        render() {
          return (
            <div>
              context:
              {this.props.foo}
            </div>
          );
        }
      })
    );
    const B = observer(
      createClass({
        render: () =&gt; 
      })
github infernojs / inferno / packages / inferno-server / __tests__ / observer.spec.server.jsx View on Github external
it('does not views alive when using static + string rendering', function() {
    useStaticRendering(true);

    let renderCount = 0;
    const data = mobx.observable({
      z: 'hi'
    });

    const TestComponent = observer(function testComponent() {
      renderCount++;
      return <div>{data.z}</div>;
    });

    const output = renderToStaticMarkup();

    data.z = 'hello';

    expect(output).toBe('<div>hi</div>');
    expect(renderCount).toBe(1);

    expect(getDNode(data, 'z').observers.length).toBe(0);

    useStaticRendering(false);
  });
});
github infernojs / inferno / packages / inferno-mobx / __tests__ / misc.spec.jsx View on Github external
it('custom shouldComponentUpdate is not respected for observable changes (#50)', done =&gt; {
    let called = 0;
    const x = mobx.observable.box(3);
    const C = observer(
      createClass({
        render: () =&gt; (
          <div>
            value:
            {x.get()}
          </div>
        ),
        shouldComponentUpdate: () =&gt; called++
      })
    );
    render(, container);
    expect(container.querySelector('div').textContent).toBe('value:3');
    expect(called).toBe(0);
    x.set(42);
    expect(container.querySelector('div').textContent).toBe('value:42');
    expect(called).toBe(0);
github infernojs / inferno / packages / inferno-mobx / __tests__ / transactions.spec.jsx View on Github external
it('React.render should respect transaction', () =&gt; {
    const a = mobx.observable.box(2);
    const loaded = mobx.observable.box(false);
    const valuesSeen = [];

    const Component = observer(() =&gt; {
      valuesSeen.push(a.get());
      if (loaded.get()) return <div>{a.get()}</div>;
      else return <div>loading</div>;
    });

    render(, container);
    mobx.runInAction(() =&gt; {
      a.set(3);
      a.set(4);
      loaded.set(true);
    });

    expect(container.textContent.replace(/\s+/g, '')).toBe('4');
    expect(valuesSeen).toEqual([2, 4]);
  });
github infernojs / inferno / packages / inferno-mobx / __tests__ / stateless.spec.jsx View on Github external
it('stateless component with context support', done =&gt; {
    const StateLessCompWithContext = (props, context) =&gt; createElement('div', {}, 'context: ' + context.testContext);
    const StateLessCompWithContextObserver = observer(StateLessCompWithContext);
    const ContextProvider = createClass({
      getChildContext: () =&gt; ({ testContext: 'hello world' }),
      render: () =&gt; 
    });
    render(, container);
    expect(container.textContent.replace(/\n/, '')).toBe('context: hello world');
    done();
  });
});
github infernojs / inferno / packages / inferno-mobx / __tests__ / observer.spec.jsx View on Github external
it('124 - react to changes in this.props via computed', function() {
    const Comp = observer(
      createClass({
        componentWillMount() {
          mobx.extendObservable(this, {
            get computedProp() {
              return this.props.x;
            }
          });
        },
        render() {
          return (
            <span>
              x:
              {this.computedProp}
            </span>
          );
        }
github infernojs / inferno / packages / inferno-mobx / __tests__ / context.spec.jsx View on Github external
console.error = m =&gt; (msg = m);
    const a = mobx.observable.box(3);
    const C = observer(
      ['foo'],
      createClass({
        render() {
          return (
            <div>
              context:
              {this.props.foo}
            </div>
          );
        }
      })
    );
    const B = observer(
      createClass({
        render: () =&gt; 
      })
    );
    const A = observer(
      createClass({
        render: () =&gt; (
          <section>
            <span>{a.get()}</span>,
            
              <b>
            </b><b>
          </b></section><b>
        )
      })
    );</b>
github infernojs / inferno / packages / inferno-mobx / __tests__ / misc.spec.jsx View on Github external
createClass({
        render() {
          return (
            <div>
              value:
              {this.props.y}
            </div>
          );
        },
        shouldComponentUpdate(nextProps) {
          called++;
          return nextProps.y !== 42;
        }
      })
    );
    const B = observer(
      createClass({
        render: () =&gt; (
          <span>
            
          </span>
        )
      })
    );
    render(<b>, container);
    expect(container.querySelector('div').textContent).toBe('value:5');
    expect(called).toBe(0);

    y.set(6);
    expect(container.querySelector('div').textContent).toBe('value:6');
    expect(called).toBe(1);
</b>

inferno-mobx

Official Inferno bindings for Mobx

MIT
Latest version published 10 months ago

Package Health Score

78 / 100
Full package analysis