react-test-renderer#ReactTestInstance TypeScript Examples

The following examples show how to use react-test-renderer#ReactTestInstance. You can vote up the ones you like or vote down the ones you don't like, and go to the original project or source file by following the links above each example. You may check out the related API usage on the sidebar.
Example #1
Source File: index.test.tsx    From scorpio-h5-design with MIT License 6 votes vote down vote up 
describe('Layout: BasicLayout', () => {
  it('Render correctly', () => {
    const wrapper: ReactTestRenderer = renderer.create(<BasicLayout />);
    expect(wrapper.root.children.length).toBe(1);
    const outerLayer = wrapper.root.children[0] as ReactTestInstance;
    expect(outerLayer.type).toBe('div');
    const title = outerLayer.children[0] as ReactTestInstance;
    expect(title.type).toBe('h1');
    expect(title.children[0]).toBe('Yay! Welcome to umi!');
  });
});
Example #2
Source File: DataTable.test.tsx    From jmix-frontend with Apache License 2.0 5 votes vote down vote up 
describe('<DataTable>', () => {
  const dataTableTestRenderer = create(
    <Provider mainStore={mainStore}>
      <IntlProvider locale='en'>
        <DataTable loading={false}
                   onFilterChange={noop}
                   onSortOrderChange={noop}
                   onPaginationChange={noop}
                   entityName={'scr_Car'}
                   columnDefinitions={[
                     'manufacturer',
                     'model'
                   ]}
                   items={[
                     {manufacturer: 'AAA', model: '001', id: '1'},
                     {manufacturer: 'BBB', model: '002', id: '2'},
                   ]}
                   count={2}
        />
      </IntlProvider>
    </Provider>
  );

  const dataTableTestInstance = dataTableTestRenderer.root;

  const intlComponent = dataTableTestInstance.children[0] as ReactTestInstance;
  const mainStoreComponent = intlComponent.children[0] as ReactTestInstance;
  const metadataComponent = mainStoreComponent.children[0] as ReactTestInstance;
  const observerComponent = metadataComponent.children[0] as ReactTestInstance;
  const dataTableComponent = observerComponent.children[0] as ReactTestInstance;


  it('renders',  () => {
    expect(dataTableTestInstance).not.toBeNull();
  });

  it('wrapper has a DataTable child that has a selectedRowKeys property', () => {
    expect(dataTableComponent.instance.selectedRowKeys).not.toBeUndefined();
  })

  it('selectedRowKeys must be an empty array', () => {
    expect(dataTableComponent.instance.selectedRowKeys).toBeInstanceOf(Array);
    expect(dataTableComponent.instance.selectedRowKeys).toHaveLength(0);
  })

  it('DataTable.onRowSelectionChange must be called once after click on the row', async () => {
    // Find the rows
    const rows = dataTableComponent.findAllByProps({className: 'ant-table-row ant-table-row-level-0'})

    expect(dataTableComponent.instance.disposers.length).toBeGreaterThanOrEqual(1);
    const prevSelectedRowKeys = [...dataTableComponent.instance.selectedRowKeys];
    expect(prevSelectedRowKeys).toHaveLength(0);

    rows[0].props.onClick(new Event('click'))
    const newSelectedRowKeys = dataTableComponent.instance.selectedRowKeys;
    expect(prevSelectedRowKeys).not.toEqual(newSelectedRowKeys);
    expect(newSelectedRowKeys).toHaveLength(1);
  })

  it('DataTable.items must be the same after click on the row (row selection)', () => {
    const prevItems = dataTableComponent.instance.items;

    const rows = dataTableComponent.findAllByProps({className: 'ant-table-row ant-table-row-level-0'});
    rows[0].props.onClick(new Event('click'));

    expect(dataTableComponent.instance.items === prevItems).toBe(true);
  })
});