bbc/enzyme-adapter-inferno

Inferno enzyme adapter

enzyme-adapter-inferno

Adapter to configure enzyme to test Inferno components

Still in development ⚠️

This adapter is missing features:

• no shallow rendering
• no support for context
• no support for attachTo

Installation

npm install --save-dev enzyme-adapter-inferno

Usage

Before you run tests, configure enzyme with the adapter:

import { configure } from 'enzyme'
import InfernoEnzymeAdapter from 'enzyme-adapter-inferno'

configure({ adapter: new InfernoEnzymeAdapter() })

Then use enzyme as you would with a React component:

import InfernoComponent from 'inferno-component'
import { mount } from 'enzyme'

const wrapper = mount(Component)
wrapper.setProps({someProp: 'value'})

enzyme-adapter-inferno's Issues

Add support for root as host node

Currently we only support the root being a Functional component, or a Class component.

There is code to handle root host nodes, but it's buggy and there are tests that aren't passing.

See this test for an example—https://github.com/bbc/enzyme-adapter-inferno/blob/master/test/specs/ReactWrapper.spec.js#L283

Call componentWillUnmount when unmount() is called

Should call componentWillUnmount when unmount is called.

Skipped test—https://github.com/bbc/enzyme-adapter-inferno/blob/master/test/specs/ReactWrapper.spec.js#L1213

Unmount method—https://github.com/bbc/enzyme-adapter-inferno/blob/master/src/InfernoEnzymeAdapter.js#L63

Proposal: Add support for shallow rendering

Inferno adapter could replace the contents of the component with null which prevents its rendering.

It could then redirect methods which try accessing its internal props, state ... to the host node instead of the rendered nodes (which would be null).

I'm not sure about the implications to lifecycle methods though. Theoretically inferno unmounts a component once it returns null so I would suspect componentWillUnmount and/or componentDidMount not firing predictably.

Have to cross-check with preacts adapters

Add support for array matching

We need to add support for array matching.

See this skipped test for an example— https://github.com/bbc/enzyme-adapter-inferno/blob/master/test/specs/ReactWrapper.spec.js#L310

isValidElement is a required method of EnzymeAdapter, but was not implemented

Don't know why this error message popped up only now...
According to blame the check has been there for 9 months.

See #12

Add support for `context` and `setContext`

Currently there is no support for context. All tests for context features have been skipped.

There are no docs on context, but the API is the same as context in React — https://reactjs.org/docs/context.html

Fragments - Inferno 6

Inferno 6 RC has been released which features fragments. It might break the existing tests so the adapter will maybe need a major update.

The adapter should also support fragments when 6 comes out.

Notes:

• render method does not return anything. Grab children directory from root domNode.children
• children are HTMLCollections. Where to handle?

Upgrade to babel 7

Inferno 6 will require babel 7 to work.
Migration notes are available here: https://babeljs.io/docs/en/v7-migration

Add support for attachTo

We need to add support for the attachTo method provided by enzyme.

This option allows you to pass a DOM element that mount will attach to.

Inferno caches root nodes inside Inferno.config.roots, so we need to clear that before attaching to a new element.

Fix bugs with `containsAllMatchingElements`

containsAllMatchingElements does not behave correctly when comparing tags that have different properties — https://github.com/bbc/enzyme-adapter-inferno/blob/master/test/specs/ReactWrapper.spec.js#L2996

matchesElement has the same problem—https://github.com/bbc/enzyme-adapter-inferno/blob/master/test/specs/ReactWrapper.spec.js#L2843

Remove prepublish

While installing dependencies I received this message:

npm WARN prepublish-on-install As of npm@5, `prepublish` scripts are deprecated.
npm WARN prepublish-on-install Use `prepare` for build steps and `prepublishOnly` for upload-only.
npm WARN prepublish-on-install See the deprecation note in `npm help scripts` for more information.

prepare is already run after prepublish so the latter one could be removed.

· prepare:  Run  both  BEFORE  the  package is packed and published, and on local npm install without any arguments (See below). This is run
         AFTER prepublish, but BEFORE prepublishOnly.

TypeError: vNode.type is not a function

Hello. I want to add unit test for my inferno component. And I trapped by a error: TypeError: vNode.type is not a function.
Here is my component:

import { PureComponent, ComponentProps } from '@enow/enow-kernel';
import { getStyle, getBody, getWrapper } from './renderUtil';

class TextElement extends PureComponent<ComponentProps, any> {
  public render () {
    const { model } = this.props;
    const slideId = this.context.currentSlideId;
    const style = getStyle({model});
    const textChunk = getBody({model});
    const wrapper = getWrapper(model, style, textChunk);
    return (
      <div
        style={style}
        class="enow__text"
        id={`enow-text-${slideId}-${model.get('id')}`}
      >
        {wrapper || textChunk}
        {this.props.children}
      </div>
    );
  }
}

export default TextElement;

Here is my test case:

/**
 * 该用例存在问题，产生的snapshot不可用，若删去mock,报错：vNode.type is not a function
 */
import TextElement from '../src/renderer';
import { mount } from 'enzyme';
import { fromJS } from '@enow/enow-component-utils';

jest.mock('@enow/enow-kernel');

const mockModelStr = `{foo: 'bar'}`;
const mockModelObj = fromJS(JSON.parse(mockModelStr));

jest.mock('../src/textRun', () => ({}));

describe('TextElement', () => {
  it('TextElement should work well', () => {
    const wrapper = mount(<TextElement model={mockModelObj} />);
    expect(wrapper).toBeTruthy();
    expect(wrapper).toMatchSnapshot()
  });
});

@enow/enow-kernel is a inner module, I mock it:

import { Component } from '@cvte/inferno-with-canvas';

module.exports = {
    PureComponent: Component,
    ComponentProps: {}
}

This is error info that console output：

Could anyone please give me some advice? Thanks in advance~~~