mirror of
https://github.com/microsoft/frontend-bootcamp.git
synced 2026-01-26 14:56:42 +08:00
adding enzyme test
This commit is contained in:
11
step2-04/demo/src/TestMe.spec.tsx
Normal file
11
step2-04/demo/src/TestMe.spec.tsx
Normal file
@@ -0,0 +1,11 @@
|
||||
import React from 'react';
|
||||
import { mount } from 'enzyme';
|
||||
import { TestMe } from './TestMe';
|
||||
|
||||
describe('TestMe Component', () => {
|
||||
it('should have a non-clickable component when the origina InnerMe is clicked', () => {
|
||||
const wrapper = mount(<TestMe name="world" />);
|
||||
wrapper.find('#innerMe').simulate('click');
|
||||
expect(wrapper.find('#innerMe').text()).toBe('Clicked');
|
||||
});
|
||||
});
|
||||
37
step2-04/demo/src/TestMe.tsx
Normal file
37
step2-04/demo/src/TestMe.tsx
Normal file
@@ -0,0 +1,37 @@
|
||||
import React from 'react';
|
||||
|
||||
export interface TestMeProps {
|
||||
name: string;
|
||||
}
|
||||
|
||||
export interface TestMeState {
|
||||
clicked: boolean;
|
||||
}
|
||||
|
||||
export const TestMe = (props: TestMeProps) => {
|
||||
return (
|
||||
<div id="testMe">
|
||||
<InnerMe name={props.name} />
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export class InnerMe extends React.Component<TestMeProps, TestMeState> {
|
||||
state = {
|
||||
clicked: false
|
||||
};
|
||||
|
||||
onClick = () => {
|
||||
this.setState({ clicked: true });
|
||||
};
|
||||
|
||||
render() {
|
||||
return !this.state.clicked ? (
|
||||
<div onClick={this.onClick} id="innerMe">
|
||||
Hello {this.props.name}, Click Me
|
||||
</div>
|
||||
) : (
|
||||
<div id="innerMe">Clicked</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user