Skip to content

Commit

Permalink
[enzyme_v3.x.x] Add invoke method definition (#3725)
Browse files Browse the repository at this point in the history
Fixes #3720
Enzyme 3.10.0 introduced `invoke` function to wrappers. This function
accepts a prop name and returns a function, decorated with enzyme internal magic.
  • Loading branch information
ipwnponies committed Feb 6, 2020
1 parent 86cef51 commit 5175c53
Show file tree
Hide file tree
Showing 4 changed files with 65 additions and 0 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -44,6 +44,7 @@ declare module "enzyme" {
unmount(): this,
text(): string,
html(): string,
invoke(propName: string): (...args: $ReadOnlyArray<any>) => mixed,
get(index: number): React$Node,
getDOMNode(): HTMLElement | HTMLInputElement,
at(index: number): this,
Expand Down
32 changes: 32 additions & 0 deletions definitions/npm/enzyme_v3.x.x/flow_v0.104.x-/test_enzyme-v3.x.js
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,7 @@ import {
type ShallowWrapper,
type ReactWrapper
} from "enzyme";
import { describe, it } from 'flow-typed-test';

configure({
disableLifecycleMethods: true
Expand Down Expand Up @@ -157,3 +158,34 @@ mount(<div><DeepInstance onChange={() => {}}/></div>).children(DeepInstance).ins
(mount(<div />).containsAllMatchingElements([<div />, <div />]): boolean);
(mount(<div />).containsAnyMatchingElements(<div />): boolean);
(mount(<div />).containsAnyMatchingElements([<div />, <div />]): boolean);

describe('invoke', () => {
describe('invoke event handler prop on shallowWrapper', () => {
it('test', () => {
// This is common use case for triggering event handler for user action
const shallowWrapper = shallow(<div onClick={() => {}} />);
shallowWrapper.invoke('onClick')();
});
});

describe('invoke regular function prop on shallowWrapper', () => {
// Less common use case, allowable by enzyime for prop to simply be a function

it('user uses type refinement', () => {
const shallowWrapper = shallow(<div getName={() => {return 'test';}} />);
const name = shallowWrapper.invoke('getName')();

if (typeof name === 'string') {
name.substring(0);
};
});

it('user does not refine type', () => {
const shallowWrapper = shallow(<div getNumber={() => {return 'not a number';}} />);
const string = shallowWrapper.invoke('getNumber')();

// $ExpectError
name.toFixed();
});
});
});
Original file line number Diff line number Diff line change
Expand Up @@ -44,6 +44,7 @@ declare module "enzyme" {
unmount(): this,
text(): string,
html(): string,
invoke(propName: string): (...args: $ReadOnlyArray<any>) => mixed,
get(index: number): React$Node,
getDOMNode(): HTMLElement | HTMLInputElement,
at(index: number): this,
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -152,3 +152,34 @@ mount(<div><DeepInstance onChange={() => {}}/></div>).children(DeepInstance).ins
(mount(<div />).containsAllMatchingElements([<div />, <div />]): boolean);
(mount(<div />).containsAnyMatchingElements(<div />): boolean);
(mount(<div />).containsAnyMatchingElements([<div />, <div />]): boolean);

describe('invoke', () => {
describe('invoke event handler prop on shallowWrapper', () => {
it('test', () => {
// This is common use case for triggering event handler for user action
const shallowWrapper = shallow(<div onClick={() => {}} />);
shallowWrapper.invoke('onClick')();
});
});

describe('invoke regular function prop on shallowWrapper', () => {
// Less common use case, allowable by enzyime for prop to simply be a function

it('user uses type refinement', () => {
const shallowWrapper = shallow(<div getName={() => {return 'test';}} />);
const name = shallowWrapper.invoke('getName')();

if (typeof name === 'string') {
name.substring(0);
};
});

it('user does not refine type', () => {
const shallowWrapper = shallow(<div getNumber={() => {return 'not a number';}} />);
const string = shallowWrapper.invoke('getNumber')();

// $ExpectError
name.toFixed();
});
});
});

0 comments on commit 5175c53

Please sign in to comment.