it('should contain options to change miles driven timeframe', () => { const wrapper = shallow(<FuelSavingsForm onSaveClick={jest.fn()} onChange={jest.fn()} fuelSavings={getFuelSavings()} />); const expectedOption1 = '<option value="week">Week</option>'; const expectedOption2 = '<option value="month">Month</option>'; const expectedOption3 = '<option value="year">Year</option>'; expect(wrapper.find('select').childAt(0).html()).toEqual(expectedOption1); expect(wrapper.find('select').childAt(1).html()).toEqual(expectedOption2); expect(wrapper.find('select').childAt(2).html()).toEqual(expectedOption3); });
describe('IssueList', () => { it('should display a loading message', () => { const wrapper = shallow(<IssueList />); expect(wrapper.html()).toBe('<p>Fetching issues...</p>'); }); // TODO: tests with issues });
describe('single.js component', () => { it('contains a msg passed by props', () => { const single = shallow(<Single msg="umamensagem" />); expect(single.html()).to.contain('umamensagem'); }); it('change css class when change props stateTransition - closing', () => { const single = shallow(<Single transitionState="closing" />); expect(single.html()).to.contain('closing'); }); it('change css class when change props stateTransition - opened', () => { const single = shallow(<Single transitionState="opened" />); expect(single.html()).to.contain('opened'); }); });
describe("<Toggle />", () => { it("should match snaphot", () => { const fn = jest.fn() const wrapper = shallow(<Toggle onToggle={fn} checked={false} />) expect(wrapper).toMatchSnapshot() expect(wrapper.html()).toMatchSnapshot() }) it("should fire onChange event if a change occurs", () => { const onToggle = jest.fn() const changeEvent = { target: { checked: true } } const wrapper = shallow(<Toggle onToggle={onToggle} checked={false} />) wrapper.find("input").simulate("change", changeEvent) expect(onToggle).toBeCalledTimes(1) expect(onToggle).toBeCalledWith(changeEvent) }) })
describe( "Component FormRegister -", () => { describe( "when rendering", () => { it( "with no properties - succeeds", () => { const div = document.createElement( "div" ); ReactDOM.render( <FormRegister />, div ); ReactDOM.unmountComponentAtNode( div ); } ); it( "with no properties - delivers expected result (-> check snapshot, too)", () => { // eslint-disable-next-line quotes const testString = `<FormRegister />`; const testElement = <FormRegister />; const filename = "FormRegister"; const component = shallow( testElement ); expect( component.exists() ).toBe( true ); const html = `${component.html()}<br/><br/>${testString.replace( "<", "<" ).replace( ">", ">" )}`; return expect( html ).toAsyncMatchNamedHTMLSnapshot( filename ); } ); } ); } );
describe('Alert', () => { it('renders without crashing', () => { const div = document.createElement('div'); ReactDOM.render(<Alert type="success" />, div); }); it('renders null when no content is provided', () => { const wrapper = shallow(<Alert type="success" />); expect(wrapper.html()).toBeNull(); }); it('renders content when content is provided', () => { const wrapper = shallow( <Alert type="success" content="some msg" />, ); expect(wrapper.text()).toBe('some msg'); }); });
describe('Selection' , () => { it('exists', () => { const user = { "name": "someone", "username" : "someonesUsername", "phone" : "012345678", "email": "someone@something.com" } const wrapper = shallow(<Selection user={user} />) expect(wrapper.find('ul').childAt(0).type()).to.equal('li'); expect(wrapper.find('ul').childAt(0).text()).to.equal(`Name: ${user.name}`); expect(wrapper.find('ul').childAt(0).text()).to.include(user.name); expect(wrapper.find('ul').childAt(1).type()).to.equal('li'); expect(wrapper.find('ul').childAt(1).text()).to.equal(`Username: ${user.username}`); expect(wrapper.find('ul').childAt(1).text()).to.include(user.username); expect(wrapper.find('ul').childAt(2).type()).to.equal('li'); expect(wrapper.find('ul').childAt(2).text()).to.equal(`Phone: ${user.phone}`); expect(wrapper.find('ul').childAt(2).text()).to.include(user.phone); expect(wrapper.find('ul').childAt(3).type()).to.equal('li'); expect(wrapper.find('ul').childAt(3).html()).to.equal(`<li>Email: <a href="mailto:${user.email}">${user.email}</a></li>`); expect(wrapper.find('ul').childAt(3).text()).to.include(user.email); }); });
describe('ContactListItem component', () => { it('should render self', () => { const wrapper = shallow(<ContactListItem {...props} />) expect(wrapper.find('.contact-list-item')).toHaveLength(1) }) it('should render contact text', () => { const wrapper = shallow(<ContactListItem {...props} />) expect(wrapper.find('.contact-list-item').text()).toBe('Bob Smith') }) it('should not render if no id is supplied', () => { const wrapper = shallow(<ContactListItem firstName={props.firstName} />) expect(wrapper.html()).toBeNull() }) })
describe("<ControlRow />", () => { it("should match snapshot", () => { const wrapper = shallow(<ControlRow label={testLabel} />) expect(wrapper).toMatchSnapshot() expect(wrapper.html()).toMatchSnapshot() }) it("should render label", () => { const wrapper = shallow(<ControlRow label={testLabel} />) expect(wrapper.find(".label").exists()).toBe(true) expect(wrapper.find(".label").text()).toBe(testLabel) }) it("should render inline when prop is passed", () => { const wrapper = shallow(<ControlRow label={testLabel} inline />) expect(wrapper.find(".row").hasClass("inline")).toBe(true) }) })
const profile = shallow(<Profile {...defaultProps} />); expect(profile.html()).toContain( '<span class="MuiTypography-root-39 MuiTypography-headline-44 MuiCardHeader-title-36">FB</span>', ); expect(profile.html()).toContain( '<span class="MuiTypography-root-39 MuiTypography-body1-48 MuiTypography-colorSecondary-59 MuiCardHeader-subheader-37">Nasdaq Global Select</span', ); expect(profile.html()).toContain( '<h1 class="MuiTypography-root-39 MuiTypography-display1-43 Profile-display-4">$166.23</h1>', ); expect(profile.html()).toContain('<p>2017-8-25 00:00:00</p>'); }); });
describe('ContactDetails component', () => { it('should render self', () => { const wrapper = shallow(<ContactDetails {...props} />) expect(wrapper.find('.contact-details')).toHaveLength(1) }) it('should render contact details text', () => { const wrapper = shallow(<ContactDetails {...props} />) expect(wrapper.find('.contact-details__name').text()).toBe('Bob Smith') expect(wrapper.find('.contact-details__email a').text()).toBe('bob.smith@email.com') }) it('should not render if no contact is supplied', () => { const wrapper = shallow(<ContactDetails />) expect(wrapper.html()).toBeNull() }) })
); expect(renderedComponent.html()).toEqual(null); }); });
expect(wrapper.html()).toMatchSnapshot() })
describe('Droparea component', () => { it('can drop a file', () => { const droparea = shallow(<Droparea tags={() => {}} thumbs={() => {}} progress={() => {}} />); expect(droparea.html()).toMatch('Click to select a file or drag it here.'); }) })
describe( "Component FormRegister -", () => { describe( "when rendering", () => { it( "with no properties - succeeds", () => { const div = document.createElement( "div" ); ReactDOM.render( <FormRegister />, div ); ReactDOM.unmountComponentAtNode( div ); } ); it( "with no properties - delivers expected result (-> check snapshot, too)", () => { // eslint-disable-next-line quotes const testString = `<FormRegister />`; const testElement = <FormRegister />; const filename = "FormRegister"; const component = shallow( testElement ); expect( component.exists() ).toBe( true ); const html = `${component.html()}<br/><br/>${testString.replace( "<", "<" ).replace( ">", ">" )}`; return expect( html ).toAsyncMatchNamedHTMLSnapshot( filename ); } ); } ); } );