diff options
Diffstat (limited to 'spec/javascript/components')
| -rw-r--r-- | spec/javascript/components/dropdown_menu.test.js | 132 | ||||
| -rw-r--r-- | spec/javascript/components/emojify.test.js | 16 |
2 files changed, 8 insertions, 140 deletions
diff --git a/spec/javascript/components/dropdown_menu.test.js b/spec/javascript/components/dropdown_menu.test.js deleted file mode 100644 index a5af730ef..000000000 --- a/spec/javascript/components/dropdown_menu.test.js +++ /dev/null @@ -1,132 +0,0 @@ -import { expect } from 'chai'; -import { shallow, mount } from 'enzyme'; -import sinon from 'sinon'; -import React from 'react'; -import DropdownMenu from '../../../app/javascript/mastodon/components/dropdown_menu'; -import Dropdown, { DropdownTrigger, DropdownContent } from 'react-simple-dropdown'; - -const isTrue = () => true; - -describe('<DropdownMenu />', () => { - const icon = 'my-icon'; - const size = 123; - let items; - let wrapper; - let action; - - beforeEach(() => { - action = sinon.spy(); - - items = [ - { text: 'first item', action: action, href: '/some/url' }, - { text: 'second item', action: 'noop' }, - ]; - wrapper = shallow(<DropdownMenu icon={icon} items={items} size={size} />); - }); - - it('contains one <Dropdown />', () => { - expect(wrapper).to.have.exactly(1).descendants(Dropdown); - }); - - it('contains one <DropdownTrigger />', () => { - expect(wrapper.find(Dropdown)).to.have.exactly(1).descendants(DropdownTrigger); - }); - - it('contains one <DropdownContent />', () => { - expect(wrapper.find(Dropdown)).to.have.exactly(1).descendants(DropdownContent); - }); - - it('does not contain a <DropdownContent /> if isUserTouching', () => { - const touchingWrapper = shallow(<DropdownMenu icon={icon} items={items} size={size} isUserTouching={isTrue} />); - expect(touchingWrapper.find(Dropdown)).to.have.exactly(0).descendants(DropdownContent); - }); - - it('does not contain a <DropdownContent /> if isUserTouching', () => { - const touchingWrapper = shallow(<DropdownMenu icon={icon} items={items} size={size} isUserTouching={isTrue} />); - expect(touchingWrapper.find(Dropdown)).to.have.exactly(0).descendants(DropdownContent); - }); - - it('uses props.size for <DropdownTrigger /> style values', () => { - ['font-size', 'width', 'line-height'].map((property) => { - expect(wrapper.find(DropdownTrigger)).to.have.style(property, `${size}px`); - }); - }); - - it('uses props.icon as icon class name', () => { - expect(wrapper.find(DropdownTrigger).find('i')).to.have.className(`fa-${icon}`); - }); - - it('is not expanded by default', () => { - expect(wrapper.state('expanded')).to.be.equal(false); - }); - - it('does not render the list elements if not expanded', () => { - const lis = wrapper.find(DropdownContent).find('li'); - expect(lis.length).to.be.equal(0); - }); - - it('sets expanded to true when clicking the trigger', () => { - const wrapper = mount(<DropdownMenu icon={icon} items={items} size={size} />); - wrapper.find(DropdownTrigger).first().simulate('click'); - expect(wrapper.state('expanded')).to.be.equal(true); - }); - - it('calls onModalOpen when clicking the trigger if isUserTouching', () => { - const onModalOpen = sinon.spy(); - const touchingWrapper = mount(<DropdownMenu icon={icon} items={items} status={3.14} size={size} onModalOpen={onModalOpen} isUserTouching={isTrue} />); - touchingWrapper.find(DropdownTrigger).first().simulate('click'); - expect(onModalOpen.calledOnce).to.be.equal(true); - expect(onModalOpen.args[0][0]).to.be.deep.equal({ status: 3.14, actions: items, onClick: touchingWrapper.node.handleClick }); - }); - - it('calls onModalClose when clicking an action if isUserTouching and isModalOpen', () => { - const onModalOpen = sinon.spy(); - const onModalClose = sinon.spy(); - const touchingWrapper = mount(<DropdownMenu icon={icon} items={items} status={3.14} size={size} isModalOpen onModalOpen={onModalOpen} onModalClose={onModalClose} isUserTouching={isTrue} />); - touchingWrapper.find(DropdownTrigger).first().simulate('click'); - touchingWrapper.node.handleClick({ currentTarget: { getAttribute: () => '0' }, preventDefault: () => null }); - expect(onModalClose.calledOnce).to.be.equal(true); - }); - - // Error: ReactWrapper::state() can only be called on the root - /*it('sets expanded to false when clicking outside', () => { - const wrapper = mount(( - <div> - <DropdownMenu icon={icon} items={items} size={size} /> - <span /> - </div> - )); - - wrapper.find(DropdownTrigger).first().simulate('click'); - expect(wrapper.find(DropdownMenu).first().state('expanded')).to.be.equal(true); - - wrapper.find('span').first().simulate('click'); - expect(wrapper.find(DropdownMenu).first().state('expanded')).to.be.equal(false); - })*/ - - it('renders list elements for each props.items if expanded', () => { - const wrapper = mount(<DropdownMenu icon={icon} items={items} size={size} />); - wrapper.find(DropdownTrigger).first().simulate('click'); - const lis = wrapper.find(DropdownContent).find('li'); - expect(lis.length).to.be.equal(items.length); - }); - - it('uses the href passed in via props.items', () => { - wrapper - .find(DropdownContent).find('li a') - .forEach((a, i) => expect(a).to.have.attr('href', items[i].href)); - }); - - it('uses the text passed in via props.items', () => { - wrapper - .find(DropdownContent).find('li a') - .forEach((a, i) => expect(a).to.have.text(items[i].text)); - }); - - it('uses the action passed in via props.items as click handler', () => { - const wrapper = mount(<DropdownMenu icon={icon} items={items} size={size} />); - wrapper.find(DropdownTrigger).first().simulate('click'); - wrapper.find(DropdownContent).find('li a').first().simulate('click'); - expect(action.calledOnce).to.equal(true); - }); -}); diff --git a/spec/javascript/components/emojify.test.js b/spec/javascript/components/emojify.test.js index e165b4519..6e73c9251 100644 --- a/spec/javascript/components/emojify.test.js +++ b/spec/javascript/components/emojify.test.js @@ -22,23 +22,23 @@ describe('emojify', () => { it('does unicode', () => { expect(emojify('\uD83D\uDC69\u200D\uD83D\uDC69\u200D\uD83D\uDC66\u200D\uD83D\uDC66')).to.equal( - '<img draggable="false" class="emojione" alt="๐ฉโ๐ฉโ๐ฆโ๐ฆ" title=":family_wwbb:" src="/emoji/1f469-1f469-1f466-1f466.svg" />'); - expect(emojify('\uD83D\uDC68\uD83D\uDC69\uD83D\uDC67\uD83D\uDC67')).to.equal( - '<img draggable="false" class="emojione" alt="๐จ๐ฉ๐ง๐ง" title=":family_mwgg:" src="/emoji/1f468-1f469-1f467-1f467.svg" />'); - expect(emojify('\uD83D\uDC69\uD83D\uDC69\uD83D\uDC66')).to.equal('<img draggable="false" class="emojione" alt="๐ฉ๐ฉ๐ฆ" title=":family_wwb:" src="/emoji/1f469-1f469-1f466.svg" />'); + '<img draggable="false" class="emojione" alt="๐ฉโ๐ฉโ๐ฆโ๐ฆ" title=":woman-woman-boy-boy:" src="/emoji/1f469-200d-1f469-200d-1f466-200d-1f466.svg" />'); + expect(emojify('๐จโ๐ฉโ๐งโ๐ง')).to.equal( + '<img draggable="false" class="emojione" alt="๐จโ๐ฉโ๐งโ๐ง" title=":man-woman-girl-girl:" src="/emoji/1f468-200d-1f469-200d-1f467-200d-1f467.svg" />'); + expect(emojify('๐ฉโ๐ฉโ๐ฆ')).to.equal('<img draggable="false" class="emojione" alt="๐ฉโ๐ฉโ๐ฆ" title=":woman-woman-boy:" src="/emoji/1f469-200d-1f469-200d-1f466.svg" />'); expect(emojify('\u2757')).to.equal( '<img draggable="false" class="emojione" alt="โ" title=":exclamation:" src="/emoji/2757.svg" />'); }); it('does multiple unicode', () => { expect(emojify('\u2757 #\uFE0F\u20E3')).to.equal( - '<img draggable="false" class="emojione" alt="โ" title=":exclamation:" src="/emoji/2757.svg" /> <img draggable="false" class="emojione" alt="#๏ธโฃ" title=":hash:" src="/emoji/0023-20e3.svg" />'); + '<img draggable="false" class="emojione" alt="โ" title=":exclamation:" src="/emoji/2757.svg" /> <img draggable="false" class="emojione" alt="#๏ธโฃ" title=":hash:" src="/emoji/23-20e3.svg" />'); expect(emojify('\u2757#\uFE0F\u20E3')).to.equal( - '<img draggable="false" class="emojione" alt="โ" title=":exclamation:" src="/emoji/2757.svg" /><img draggable="false" class="emojione" alt="#๏ธโฃ" title=":hash:" src="/emoji/0023-20e3.svg" />'); + '<img draggable="false" class="emojione" alt="โ" title=":exclamation:" src="/emoji/2757.svg" /><img draggable="false" class="emojione" alt="#๏ธโฃ" title=":hash:" src="/emoji/23-20e3.svg" />'); expect(emojify('\u2757 #\uFE0F\u20E3 \u2757')).to.equal( - '<img draggable="false" class="emojione" alt="โ" title=":exclamation:" src="/emoji/2757.svg" /> <img draggable="false" class="emojione" alt="#๏ธโฃ" title=":hash:" src="/emoji/0023-20e3.svg" /> <img draggable="false" class="emojione" alt="โ" title=":exclamation:" src="/emoji/2757.svg" />'); + '<img draggable="false" class="emojione" alt="โ" title=":exclamation:" src="/emoji/2757.svg" /> <img draggable="false" class="emojione" alt="#๏ธโฃ" title=":hash:" src="/emoji/23-20e3.svg" /> <img draggable="false" class="emojione" alt="โ" title=":exclamation:" src="/emoji/2757.svg" />'); expect(emojify('foo \u2757 #\uFE0F\u20E3 bar')).to.equal( - 'foo <img draggable="false" class="emojione" alt="โ" title=":exclamation:" src="/emoji/2757.svg" /> <img draggable="false" class="emojione" alt="#๏ธโฃ" title=":hash:" src="/emoji/0023-20e3.svg" /> bar'); + 'foo <img draggable="false" class="emojione" alt="โ" title=":exclamation:" src="/emoji/2757.svg" /> <img draggable="false" class="emojione" alt="#๏ธโฃ" title=":hash:" src="/emoji/23-20e3.svg" /> bar'); }); it('ignores unicode inside of tags', () => { |