test("should be able to render", () => { const titleBar = shallow(<TitleBar />); expect(toJSON(titleBar)).toMatchSnapshot(); const titleBar2 = shallow(<TitleBar theme="dark" title="great" />); expect(toJSON(titleBar2)).toMatchSnapshot(); });
test('Keyboard event with searching in the list', () => { const props = { preferredCountries: ['af', 'al'], defaultCountry: 'in', flagsImagePath: '/flags.723494a4.png', initialValue: '+9112121', inputProps: { autoFocus: true } } const wrapper = mount(<ReactTelephoneInput {...props} />) expect(toJson(wrapper)).toMatchSnapshot() wrapper.find('[data-test-id="src_reacttelephoneinput_test_id_7"]').simulate('click') wrapper .find('[data-test-id="src_reacttelephoneinput_test_id_6"]') .simulate('keyDown', { keyCode: 65, which: 65 }) wrapper .find('[data-test-id="src_reacttelephoneinput_test_id_6"]') .simulate('keyDown', { keyCode: 65, which: 65 }) wrapper .find('[data-test-id="src_reacttelephoneinput_test_id_6"]') .simulate('keyUp', { keyCode: 65, which: 65 }) wrapper .find('[data-test-id="src_reacttelephoneinput_test_id_2"]') .at(2) .simulate('click') wrapper .find('[data-test-id="src_reacttelephoneinput_test_id_5"]') .simulate('keyDown', { keyCode: 91, which: 91 }) wrapper .find('[data-test-id="src_reacttelephoneinput_test_id_5"]') .simulate('keyDown', { keyCode: 91, which: 91 }) expect(toJson(wrapper)).toMatchSnapshot() })
test("clicking dropdown content triggers the items callback and closes the menu", () => { const clicky = jest.fn(); const wrapper = mount( <DropdownMenu> <DropdownTrigger> <div className="clickMe">Click me</div> </DropdownTrigger> <DropdownContent> <li className="alsoClickMe" onClick={clicky}> 1 </li> </DropdownContent> </DropdownMenu> ); expect(toJSON(wrapper)).toMatchSnapshot(); // Trigger should be shown // Content should not be available yet expect(toJSON(wrapper)).toMatchSnapshot(); expect(wrapper.find(".alsoClickMe").length).toEqual(0); // Content should now be shown wrapper.find(".clickMe").simulate("click"); expect(toJSON(wrapper)).toMatchSnapshot(); expect(wrapper.find(".alsoClickMe").length).toEqual(1); // Clicking the item should close the menu wrapper.find(".alsoClickMe").simulate("click"); expect(wrapper.find(".alsoClickMe").length).toEqual(0); expect(toJSON(wrapper)).toMatchSnapshot(); });
test("should be able to render", () => { const logo = shallow(<Logo />); expect(toJSON(logo)).toMatchSnapshot(); logo.setProps({ theme: "dark" }); expect(toJSON(logo)).toMatchSnapshot(); });
test('Interaction test 2', () => { const onChange = jest.fn() const props = { preferredCountries: ['af', 'al'], defaultCountry: 'in', flagsImagePath: '/flags.723494a4.png', initialValue: '+9112121', inputProps: { autoFocus: true }, onChange: formattedNumber => onChange(formattedNumber) } const wrapper = mount(<ReactTelephoneInput {...props} />) expect(toJson(wrapper)).toMatchSnapshot() wrapper.find('[data-test-id="src_reacttelephoneinput_test_id_5"]').simulate('focus') wrapper.find('[data-test-id="src_reacttelephoneinput_test_id_5"]').simulate('click') wrapper .find('[data-test-id="src_reacttelephoneinput_test_id_5"]') .simulate('keyDown', { keyCode: 49, which: 49 }) wrapper .find('[data-test-id="src_reacttelephoneinput_test_id_5"]') .simulate('change', { target: { value: '+91 121211', checked: false } }) expect(onChange).toBeCalledWith('+91 12121-1') wrapper .find('[data-test-id="src_reacttelephoneinput_test_id_5"]') .simulate('keyDown', { keyCode: 50, which: 50 }) wrapper .find('[data-test-id="src_reacttelephoneinput_test_id_5"]') .simulate('change', { target: { value: '+91 12121-12', checked: false } }) expect(onChange).toBeCalledWith('+91 12121-12') wrapper .find('[data-test-id="src_reacttelephoneinput_test_id_5"]') .simulate('keyDown', { keyCode: 49, which: 49 }) wrapper .find('[data-test-id="src_reacttelephoneinput_test_id_5"]') .simulate('change', { target: { value: '+91 12121-121', checked: false } }) expect(onChange).toBeCalledWith('+91 12121-121') wrapper.find('[data-test-id="src_reacttelephoneinput_test_id_5"]').simulate('blur') wrapper.find('[data-test-id="src_reacttelephoneinput_test_id_7"]').simulate('click') wrapper .find('div') .at(9) .simulate('scroll') wrapper.find('[data-test-id="src_reacttelephoneinput_test_id_5"]').simulate('focus') wrapper.find('[data-test-id="src_reacttelephoneinput_test_id_5"]').simulate('blur') // click on a flag in the dropdown list of flags // that should trigger another onChange call wrapper .find('[data-test-id="src_reacttelephoneinput_test_id_0"]') .at(5) .simulate('click') // verify the number of times onChange would have been called expect(onChange.mock.calls.length).toBe(4) expect(toJson(wrapper)).toMatchSnapshot() })
test(caseName, () => { const element = cases[caseName]; const mountTree = mount(element); const renderTree = render(element); const shallowTree = shallow(element); expect(toJson(mountTree)).toMatchSnapshot(`enzyme.mount ${caseName}`); expect(toJson(renderTree)).toMatchSnapshot(`enzyme.render ${caseName}`); expect(toJson(shallowTree)).toMatchSnapshot(`enzyme.shallow ${caseName}`); });
it('render search', () => { const { wrapper, props: {changeFilter} } = setup(); const input = wrapper.find('.search__input'); expect(input.prop('defaultValue')).toEqual('query'); expect(toJson(wrapper)).toMatchSnapshot(); })
it('enables to set inner html', async () => { const dialog = shallow(<ConfirmDialog {...props} dangerouslySetInnerHTML={{ _html: '<b>Custom</b> html content' }} />); expect(toJson(dialog)).toMatchSnapshot(); });
it('renders a confirm dialog', async () => { const dialog = shallow(<ConfirmDialog {...props} {...{ message }} />); expect(toJson(dialog)).toMatchSnapshot(); });
it('renders the value', async () => { const controller = mockController({ editing: false }); const value = 200; const formatter = editFormatter(controller)(value, data({})); expect(toJson(shallow(formatter))).toMatchSnapshot(); });
test('it renders a list of tags', () => { const filters = { values: { 'good-submission': { label: 'Good Submission', active: false, }, 'good-quote': { label: 'Good Quote', active: false, }, }, type: 'tags', }; const component = mount( <MultiValueFilter options={filters} header={'Tags'} updateFilters={() => {}} />, ); expect(toJson(component)).toMatchSnapshot(); component.unmount(); });
it('match snapshot when not authenticated', () => { const props = { isAuthenticated: jest.fn(), }; expect(toJson(shallow(<RootContainer {...props}/>))).toMatchSnapshot(); });
test('change theme', () => { const Div = withTheme(styled.div`color: ${props => props.theme.primary};`) const TestComponent = props => ( <ThemeProvider theme={props.theme}> {props.renderChild ? <Div>this will be green then pink</Div> : null} </ThemeProvider> ) const wrapper = mount( <TestComponent renderChild theme={{ primary: 'green' }} /> ) expect(enzymeToJson(wrapper)).toMatchSnapshot() wrapper.setProps({ theme: { primary: 'pink' } }) expect(enzymeToJson(wrapper)).toMatchSnapshot() wrapper.setProps({ renderChild: false }) expect(enzymeToJson(wrapper)).toMatchSnapshot() })
it('should render ActionSheet success', function () { const wrapper = mount(<ActionSheet autoDectect type={'ios'} visible={false} onClose={() => {}} menus={['选项一', '选项二'].map((item, index) => { return { type: 'default', label: item, textStyle: {color: '#000000'}, onPress: () => {} } })} actions={[ { type: 'default', label: '取消', textStyle: {color: '#000000'}, onPress: () => {} } ]} />) expect(toJson(wrapper)).toMatchSnapshot() })
it('renders without crashing', () => { expect( toJson( Object.assign({}, Index, { _reactInternalInstance: 'censored' }), ), ).toMatchSnapshot(); });
it('should render correctly', () => { const wrapper = shallow( <TimeDisplay {...defaultProps} /> ); expect(toJson(wrapper)).toMatchSnapshot(); });
it('should render without search icon', () => { const component = shallow( <SearchBar noIcon /> ); expect(component.length).toBe(1); expect(toJson(component)).toMatchSnapshot(); });
it('should render with a custom search icon', () => { const component = shallow( <SearchBar leftIcon={<View />} /> ); expect(component.length).toBe(1); expect(toJson(component)).toMatchSnapshot(); });
it('should render social icon button', () => { const component = shallow( <SocialIcon title="Sign In With Facebook" button type="facebook" /> ); expect(component.length).toBe(1); expect(toJson(component)).toMatchSnapshot(); });
it('should render light social icon', () => { const component = shallow( <SocialIcon light raised={false} type="medium" /> ); expect(component.length).toBe(1); expect(toJson(component)).toMatchSnapshot(); });
it('should render without icon', () => { const component = shallow( <Search underlineColorAndroid="red" noIcon round /> ); expect(component.length).toBe(1); expect(toJson(component)).toMatchSnapshot(); });
it('match snapshot when precondition failed', () => { const props = { isAuthenticated: jest.fn(), authed: Actions.Auth.PRECONDITION_FAILED }; expect(toJson(shallow(<RootContainer {...props}/>))).toMatchSnapshot(); });
it('should render with a custom search icon', () => { const component = shallow( <SearchBar searchIcon={{ size: 50 }} lightTheme /> ); expect(component.length).toBe(1); expect(toJson(component)).toMatchSnapshot(); });
it('should render avatar without height', () => { const component = shallow( <Avatar width={80} title="avatar title" titleStyle={{ color: 'red' }} /> ); expect(component.length).toBe(1); expect(toJson(component)).toMatchSnapshot(); });
it('should render xlarge avatar', () => { const component = shallow( <Avatar xlarge rounded title="avatar title" activeOpacity={0.7} /> ); expect(component.length).toBe(1); expect(toJson(component)).toMatchSnapshot(); });
it('should render without issues', () => { const component = shallow( <FeaturedTile imageSrc={{ url: 'http://google.com' }} /> ); expect(component.length).toBe(1); expect(toJson(component)).toMatchSnapshot(); });
it('should render without clear icon', () => { const component = shallow( <SearchBar clearIcon={false} /> ); expect(component.length).toBe(1); expect(toJson(component)).toMatchSnapshot(); });
it('should render with a custom icon', () => { const component = shallow( <SearchBar icon={{ type: 'font-awesome', name: 'glass' }} /> ); expect(component.length).toBe(1); expect(toJson(component)).toMatchSnapshot(); });
it('should render with a custom Cancel button title', () => { const component = shallow( <SearchBar cancelButtonTitle="Annuler" /> ); expect(component.length).toBe(1); expect(toJson(component)).toMatchSnapshot(); });
it('match snapshot when login invalid', () => { const props = { isAuthenticated: jest.fn(), authed: Actions.Auth.LOGIN_INVALID }; expect(toJson(shallow(<RootContainer {...props}/>))).toMatchSnapshot(); });