forked from mastodon/mastodon
-
Notifications
You must be signed in to change notification settings - Fork 1
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Replace JavaScript Testing Framework from Mocha to Jest (mastodon#5412)
- Loading branch information
Showing
25 changed files
with
1,266 additions
and
682 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
|
@@ -5,6 +5,7 @@ env: | |
browser: true | ||
node: true | ||
es6: true | ||
jest: true | ||
|
||
parser: babel-eslint | ||
|
||
|
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
33 changes: 33 additions & 0 deletions
33
app/javascript/mastodon/components/__tests__/__snapshots__/avatar-test.js.snap
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,33 @@ | ||
// Jest Snapshot v1, https://goo.gl/fbAQLP | ||
|
||
exports[`<Avatar /> Autoplay renders a animated avatar 1`] = ` | ||
<div | ||
className="account__avatar" | ||
onMouseEnter={[Function]} | ||
onMouseLeave={[Function]} | ||
style={ | ||
Object { | ||
"backgroundImage": "url(/animated/alice.gif)", | ||
"backgroundSize": "100px 100px", | ||
"height": "100px", | ||
"width": "100px", | ||
} | ||
} | ||
/> | ||
`; | ||
|
||
exports[`<Avatar /> Still renders a still avatar 1`] = ` | ||
<div | ||
className="account__avatar" | ||
onMouseEnter={[Function]} | ||
onMouseLeave={[Function]} | ||
style={ | ||
Object { | ||
"backgroundImage": "url(/static/alice.jpg)", | ||
"backgroundSize": "100px 100px", | ||
"height": "100px", | ||
"width": "100px", | ||
} | ||
} | ||
/> | ||
`; |
24 changes: 24 additions & 0 deletions
24
app/javascript/mastodon/components/__tests__/__snapshots__/avatar_overlay-test.js.snap
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,24 @@ | ||
// Jest Snapshot v1, https://goo.gl/fbAQLP | ||
|
||
exports[`<AvatarOverlay renders a overlay avatar 1`] = ` | ||
<div | ||
className="account__avatar-overlay" | ||
> | ||
<div | ||
className="account__avatar-overlay-base" | ||
style={ | ||
Object { | ||
"backgroundImage": "url(/static/alice.jpg)", | ||
} | ||
} | ||
/> | ||
<div | ||
className="account__avatar-overlay-overlay" | ||
style={ | ||
Object { | ||
"backgroundImage": "url(/static/eve.jpg)", | ||
} | ||
} | ||
/> | ||
</div> | ||
`; |
114 changes: 114 additions & 0 deletions
114
app/javascript/mastodon/components/__tests__/__snapshots__/button-test.js.snap
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,114 @@ | ||
// Jest Snapshot v1, https://goo.gl/fbAQLP | ||
|
||
exports[`<Button /> adds class "button-secondary" if props.secondary given 1`] = ` | ||
<button | ||
className="button button-secondary" | ||
disabled={undefined} | ||
onClick={[Function]} | ||
style={ | ||
Object { | ||
"height": "36px", | ||
"lineHeight": "36px", | ||
"padding": "0 16px", | ||
} | ||
} | ||
/> | ||
`; | ||
|
||
exports[`<Button /> renders a button element 1`] = ` | ||
<button | ||
className="button" | ||
disabled={undefined} | ||
onClick={[Function]} | ||
style={ | ||
Object { | ||
"height": "36px", | ||
"lineHeight": "36px", | ||
"padding": "0 16px", | ||
} | ||
} | ||
/> | ||
`; | ||
|
||
exports[`<Button /> renders a disabled attribute if props.disabled given 1`] = ` | ||
<button | ||
className="button" | ||
disabled={true} | ||
onClick={[Function]} | ||
style={ | ||
Object { | ||
"height": "36px", | ||
"lineHeight": "36px", | ||
"padding": "0 16px", | ||
} | ||
} | ||
/> | ||
`; | ||
|
||
exports[`<Button /> renders class="button--block" if props.block given 1`] = ` | ||
<button | ||
className="button button--block" | ||
disabled={undefined} | ||
onClick={[Function]} | ||
style={ | ||
Object { | ||
"height": "36px", | ||
"lineHeight": "36px", | ||
"padding": "0 16px", | ||
} | ||
} | ||
/> | ||
`; | ||
|
||
exports[`<Button /> renders the children 1`] = ` | ||
<button | ||
className="button" | ||
disabled={undefined} | ||
onClick={[Function]} | ||
style={ | ||
Object { | ||
"height": "36px", | ||
"lineHeight": "36px", | ||
"padding": "0 16px", | ||
} | ||
} | ||
> | ||
<p> | ||
children | ||
</p> | ||
</button> | ||
`; | ||
|
||
exports[`<Button /> renders the given text 1`] = ` | ||
<button | ||
className="button" | ||
disabled={undefined} | ||
onClick={[Function]} | ||
style={ | ||
Object { | ||
"height": "36px", | ||
"lineHeight": "36px", | ||
"padding": "0 16px", | ||
} | ||
} | ||
> | ||
foo | ||
</button> | ||
`; | ||
|
||
exports[`<Button /> renders the props.text instead of children 1`] = ` | ||
<button | ||
className="button" | ||
disabled={undefined} | ||
onClick={[Function]} | ||
style={ | ||
Object { | ||
"height": "36px", | ||
"lineHeight": "36px", | ||
"padding": "0 16px", | ||
} | ||
} | ||
> | ||
foo | ||
</button> | ||
`; |
23 changes: 23 additions & 0 deletions
23
app/javascript/mastodon/components/__tests__/__snapshots__/display_name-test.js.snap
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,23 @@ | ||
// Jest Snapshot v1, https://goo.gl/fbAQLP | ||
|
||
exports[`<DisplayName /> renders display name + account name 1`] = ` | ||
<span | ||
className="display-name" | ||
> | ||
<strong | ||
className="display-name__html" | ||
dangerouslySetInnerHTML={ | ||
Object { | ||
"__html": "<p>Foo</p>", | ||
} | ||
} | ||
/> | ||
<span | ||
className="display-name__account" | ||
> | ||
@ | ||
bar@baz | ||
</span> | ||
</span> | ||
`; |
36 changes: 36 additions & 0 deletions
36
app/javascript/mastodon/components/__tests__/avatar-test.js
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,36 @@ | ||
import React from 'react'; | ||
import renderer from 'react-test-renderer'; | ||
import { fromJS } from 'immutable'; | ||
import Avatar from '../avatar'; | ||
|
||
describe('<Avatar />', () => { | ||
const account = fromJS({ | ||
username: 'alice', | ||
acct: 'alice', | ||
display_name: 'Alice', | ||
avatar: '/animated/alice.gif', | ||
avatar_static: '/static/alice.jpg', | ||
}); | ||
|
||
const size = 100; | ||
|
||
describe('Autoplay', () => { | ||
it('renders a animated avatar', () => { | ||
const component = renderer.create(<Avatar account={account} animate size={size} />); | ||
const tree = component.toJSON(); | ||
|
||
expect(tree).toMatchSnapshot(); | ||
}); | ||
}); | ||
|
||
describe('Still', () => { | ||
it('renders a still avatar', () => { | ||
const component = renderer.create(<Avatar account={account} size={size} />); | ||
const tree = component.toJSON(); | ||
|
||
expect(tree).toMatchSnapshot(); | ||
}); | ||
}); | ||
|
||
// TODO add autoplay test if possible | ||
}); |
29 changes: 29 additions & 0 deletions
29
app/javascript/mastodon/components/__tests__/avatar_overlay-test.js
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,29 @@ | ||
import React from 'react'; | ||
import renderer from 'react-test-renderer'; | ||
import { fromJS } from 'immutable'; | ||
import AvatarOverlay from '../avatar_overlay'; | ||
|
||
describe('<AvatarOverlay', () => { | ||
const account = fromJS({ | ||
username: 'alice', | ||
acct: 'alice', | ||
display_name: 'Alice', | ||
avatar: '/animated/alice.gif', | ||
avatar_static: '/static/alice.jpg', | ||
}); | ||
|
||
const friend = fromJS({ | ||
username: 'eve', | ||
acct: '[email protected]', | ||
display_name: 'Evelyn', | ||
avatar: '/animated/eve.gif', | ||
avatar_static: '/static/eve.jpg', | ||
}); | ||
|
||
it('renders a overlay avatar', () => { | ||
const component = renderer.create(<AvatarOverlay account={account} friend={friend} />); | ||
const tree = component.toJSON(); | ||
|
||
expect(tree).toMatchSnapshot(); | ||
}); | ||
}); |
75 changes: 75 additions & 0 deletions
75
app/javascript/mastodon/components/__tests__/button-test.js
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,75 @@ | ||
import { shallow } from 'enzyme'; | ||
import React from 'react'; | ||
import renderer from 'react-test-renderer'; | ||
import Button from '../button'; | ||
|
||
describe('<Button />', () => { | ||
it('renders a button element', () => { | ||
const component = renderer.create(<Button />); | ||
const tree = component.toJSON(); | ||
|
||
expect(tree).toMatchSnapshot(); | ||
}); | ||
|
||
it('renders the given text', () => { | ||
const text = 'foo'; | ||
const component = renderer.create(<Button text={text} />); | ||
const tree = component.toJSON(); | ||
|
||
expect(tree).toMatchSnapshot(); | ||
}); | ||
|
||
it('handles click events using the given handler', () => { | ||
const handler = jest.fn(); | ||
const button = shallow(<Button onClick={handler} />); | ||
button.find('button').simulate('click'); | ||
|
||
expect(handler.mock.calls.length).toEqual(1); | ||
}); | ||
|
||
it('does not handle click events if props.disabled given', () => { | ||
const handler = jest.fn(); | ||
const button = shallow(<Button onClick={handler} disabled />); | ||
button.find('button').simulate('click'); | ||
|
||
expect(handler.mock.calls.length).toEqual(0); | ||
}); | ||
|
||
it('renders a disabled attribute if props.disabled given', () => { | ||
const component = renderer.create(<Button disabled />); | ||
const tree = component.toJSON(); | ||
|
||
expect(tree).toMatchSnapshot(); | ||
}); | ||
|
||
it('renders the children', () => { | ||
const children = <p>children</p>; | ||
const component = renderer.create(<Button>{children}</Button>); | ||
const tree = component.toJSON(); | ||
|
||
expect(tree).toMatchSnapshot(); | ||
}); | ||
|
||
it('renders the props.text instead of children', () => { | ||
const text = 'foo'; | ||
const children = <p>children</p>; | ||
const component = renderer.create(<Button text={text}>{children}</Button>); | ||
const tree = component.toJSON(); | ||
|
||
expect(tree).toMatchSnapshot(); | ||
}); | ||
|
||
it('renders class="button--block" if props.block given', () => { | ||
const component = renderer.create(<Button block />); | ||
const tree = component.toJSON(); | ||
|
||
expect(tree).toMatchSnapshot(); | ||
}); | ||
|
||
it('adds class "button-secondary" if props.secondary given', () => { | ||
const component = renderer.create(<Button secondary />); | ||
const tree = component.toJSON(); | ||
|
||
expect(tree).toMatchSnapshot(); | ||
}); | ||
}); |
18 changes: 18 additions & 0 deletions
18
app/javascript/mastodon/components/__tests__/display_name-test.js
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,18 @@ | ||
import React from 'react'; | ||
import renderer from 'react-test-renderer'; | ||
import { fromJS } from 'immutable'; | ||
import DisplayName from '../display_name'; | ||
|
||
describe('<DisplayName />', () => { | ||
it('renders display name + account name', () => { | ||
const account = fromJS({ | ||
username: 'bar', | ||
acct: 'bar@baz', | ||
display_name_html: '<p>Foo</p>', | ||
}); | ||
const component = renderer.create(<DisplayName account={account} />); | ||
const tree = component.toJSON(); | ||
|
||
expect(tree).toMatchSnapshot(); | ||
}); | ||
}); |
Oops, something went wrong.