diff options
author | 2019-05-04 21:13:12 +0300 | |
---|---|---|
committer | 2023-01-13 10:37:54 +0300 | |
commit | f470636a70943a8ecad8bddc791a1c2dddd28e1e (patch) | |
tree | c43d109d88adbde9a696084070cdd92c6b9a004b /vnext/src/ui/__tests__ | |
parent | 3d7d213e3ddc5bf4f71d536f31677b768aa3b7c0 (diff) |
Components -> UI
Diffstat (limited to 'vnext/src/ui/__tests__')
-rw-r--r-- | vnext/src/ui/__tests__/Avatar.test.js | 15 | ||||
-rw-r--r-- | vnext/src/ui/__tests__/LoginButton.test.js | 21 | ||||
-rw-r--r-- | vnext/src/ui/__tests__/MessageInput-test.js | 95 | ||||
-rw-r--r-- | vnext/src/ui/__tests__/UserLink.test.js | 20 | ||||
-rw-r--r-- | vnext/src/ui/__tests__/__snapshots__/Avatar.test.js.snap | 41 | ||||
-rw-r--r-- | vnext/src/ui/__tests__/__snapshots__/LoginButton.test.js.snap | 178 | ||||
-rw-r--r-- | vnext/src/ui/__tests__/__snapshots__/UserLink.test.js.snap | 33 |
7 files changed, 403 insertions, 0 deletions
diff --git a/vnext/src/ui/__tests__/Avatar.test.js b/vnext/src/ui/__tests__/Avatar.test.js new file mode 100644 index 00000000..e7221871 --- /dev/null +++ b/vnext/src/ui/__tests__/Avatar.test.js @@ -0,0 +1,15 @@ +import React from 'react'; +import { MemoryRouter } from 'react-router-dom'; + +import Avatar from '../Avatar'; +import renderer from 'react-test-renderer'; + +test('Avatar renders correctly', () => { + const component = renderer.create( + <MemoryRouter> + <Avatar user={{ uid: 1, uname: 'ugnich', avatar: 'https://juick.com/i/a/1-deadbeef.png' }} /> + </MemoryRouter> + ); + let tree = component.toJSON(); + expect(tree).toMatchSnapshot(); +}); diff --git a/vnext/src/ui/__tests__/LoginButton.test.js b/vnext/src/ui/__tests__/LoginButton.test.js new file mode 100644 index 00000000..da80abb0 --- /dev/null +++ b/vnext/src/ui/__tests__/LoginButton.test.js @@ -0,0 +1,21 @@ +import React from 'react'; + +import LoginButton from '../LoginButton'; +import { create, act } from 'react-test-renderer'; + +test('Login button and form are renders correctly', () => { + var button = null; + act(() => { + button = create( + <LoginButton title="Log in" onAuth={() => { }} /> + ); + }); + let link = button.toJSON(); + expect(link).toMatchSnapshot(); + + act(() => { + button.root.findByType('a').props.onClick(); + }); + let modal = button.toJSON(); + expect(modal).toMatchSnapshot(); +}); diff --git a/vnext/src/ui/__tests__/MessageInput-test.js b/vnext/src/ui/__tests__/MessageInput-test.js new file mode 100644 index 00000000..7ac69ed0 --- /dev/null +++ b/vnext/src/ui/__tests__/MessageInput-test.js @@ -0,0 +1,95 @@ +import React from 'react'; +import { create, act } from 'react-test-renderer'; + +import MessageInput from '../MessageInput'; + +const testMessage = { + mid: 1, + rid: 0, + body: 'test message', + timestamp: new Date().toISOString(), + attach: '', + to: {} +}; + +window.matchMedia = window.matchMedia || function () { + return { + matches: true, + addListener: function () { }, + removeListener: function () { } + }; +}; + +it('Gives immediate focus on to textarea on load', () => { + let focused = false; + act(() => { + create(<MessageInput data={testMessage} onSend={() => { }} />, { + createNodeMock: (element) => { + if (element.type === 'textarea') { + // mock a focus function + return { + focus: () => { + focused = true; + }, + style: {} + }; + } + return null; + } + }); + }); + expect(focused).toEqual(true, 'textarea was not focused'); +}); + + +it('Submits on ctrl-enter', () => { + const onSend = jest.fn(); + var messageInput = null; + act(() => { + messageInput = create(<MessageInput data={testMessage} onSend={onSend} />, { + createNodeMock: (element) => { + if (element.type === 'textarea') { + return { + focus: () => { }, + style: {} + }; + } + return null; + } + }); + }); + let textarea = messageInput.root.findByType('textarea'); + act(() => { + + textarea.props.onKeyPress({ + charCode: 13, + which: 13, + keyCode: 13, + ctrlKey: false + }); + }); + expect(onSend).toHaveBeenCalledTimes(0); + act(() => { + textarea.props.onKeyPress({ + charCode: 13, + which: 13, + keyCode: 13, + ctrlKey: true + }); + }); + expect(onSend).toHaveBeenCalledTimes(1); + expect(textarea.props.value).toEqual(''); + act(() => { + textarea.props.onChange({ + target: { + value: ' ', + validity: {} + } + }); + }); + expect(textarea.props.value).toEqual(' '); + act(() => { + messageInput.root.findByType('form').props.onSubmit({ event: {} }); + }); + expect(textarea.props.value).toEqual('', 'Value should be cleared after submit'); +}); diff --git a/vnext/src/ui/__tests__/UserLink.test.js b/vnext/src/ui/__tests__/UserLink.test.js new file mode 100644 index 00000000..a75344b0 --- /dev/null +++ b/vnext/src/ui/__tests__/UserLink.test.js @@ -0,0 +1,20 @@ +import React from 'react'; +import { MemoryRouter, Switch, Route } from 'react-router-dom'; + +import { UserLink } from '../UserInfo'; +import renderer from 'react-test-renderer'; + +test('UserLink renders correctly', async () => { + const component = renderer.create( + <MemoryRouter> + <> + <UserLink user={{ uid: 1, uname: 'ugnich', avatar: 'https://juick.com/i/a/1-deadbeef.png' }} /> + <UserLink user={{ uid: 1, uname: 'ugnich', avatar: 'https://juick.com/i/a/1-deadbeef.png', uri: '' }} /> + <UserLink user={{ uid: 0, uname: '', uri: 'https://example.com/u/test' }} /> + </> + </MemoryRouter> + ); + await Promise.resolve(); + let tree = component.toJSON(); + expect(tree).toMatchSnapshot(); +}); diff --git a/vnext/src/ui/__tests__/__snapshots__/Avatar.test.js.snap b/vnext/src/ui/__tests__/__snapshots__/Avatar.test.js.snap new file mode 100644 index 00000000..47614f5a --- /dev/null +++ b/vnext/src/ui/__tests__/__snapshots__/Avatar.test.js.snap @@ -0,0 +1,41 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[`Avatar renders correctly 1`] = ` +<div + className="Avatar" +> + <div + className="msg-avatar" + > + <a + href="/ugnich/" + onClick={[Function]} + > + <img + alt="ugnich" + src="https://juick.com/i/a/1-deadbeef.png" + /> + </a> + </div> + <div + style={ + Object { + "display": "flex", + "flexDirection": "column", + "justifyContent": "center", + } + } + > + <span> + <a + href="/ugnich/" + onClick={[Function]} + > + <span> + ugnich + </span> + </a> + </span> + </div> +</div> +`; diff --git a/vnext/src/ui/__tests__/__snapshots__/LoginButton.test.js.snap b/vnext/src/ui/__tests__/__snapshots__/LoginButton.test.js.snap new file mode 100644 index 00000000..cd08b1b4 --- /dev/null +++ b/vnext/src/ui/__tests__/__snapshots__/LoginButton.test.js.snap @@ -0,0 +1,178 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[`Login button and form are renders correctly 1`] = ` +<a + onClick={[Function]} +> + <div + className="icon icon--ei-user icon--s" + > + <svg + className="icon__cnt" + dangerouslySetInnerHTML={ + Object { + "__html": "<use xlink:href=#ei-user-icon />", + } + } + /> + </div> + <span + className="desktop" + > + Log in + </span> +</a> +`; + +exports[`Login button and form are renders correctly 2`] = ` +Array [ + <a + onClick={[Function]} + > + <div + className="icon icon--ei-user icon--s" + > + <svg + className="icon__cnt" + dangerouslySetInnerHTML={ + Object { + "__html": "<use xlink:href=#ei-user-icon />", + } + } + /> + </div> + <span + className="desktop" + > + Log in + </span> + </a>, + <div + id="dialogt" + > + <div + id="dialogw" + > + <div + id="dialog_header" + > + <div + id="dialogc" + onClick={[Function]} + > + <div + className="icon icon--ei-close icon--s" + > + <svg + className="icon__cnt" + dangerouslySetInnerHTML={ + Object { + "__html": "<use xlink:href=#ei-close-icon />", + } + } + /> + </div> + </div> + </div> + <div + className="dialoglogin" + > + <p> + Please, introduce yourself: + </p> + <div + style={ + Object { + "display": "flex", + "justifyContent": "space-evenly", + "padding": "4px", + } + } + > + <a + href="https://juick.com/api/_fblogin?state=http://localhost/" + style={ + Object { + "background": "#3b5998", + "color": "#fff", + "padding": "2px 14px", + } + } + > + <div + className="icon icon--s" + > + <svg + className="icon__cnt" + dangerouslySetInnerHTML={ + Object { + "__html": "<use xlink:href=#ei-sc-facebook-icon />", + } + } + /> + </div> + Log in + </a> + <a + href="https://juick.com/api/_vklogin?state=http://localhost/" + style={ + Object { + "background": "#4c75a3", + "color": "#fff", + "padding": "2px 14px", + } + } + > + <div + className="icon icon--s" + > + <svg + className="icon__cnt" + dangerouslySetInnerHTML={ + Object { + "__html": "<use xlink:href=#ei-sc-vk-icon />", + } + } + /> + </div> + Log in + </a> + </div> + <p> + Already registered? + </p> + <form + onSubmit={[Function]} + > + <input + className="input" + name="username" + onBlur={[Function]} + onChange={[Function]} + placeholder="Username..." + type="text" + value="" + /> + <br /> + <input + className="input" + name="password" + onBlur={[Function]} + onChange={[Function]} + placeholder="Password..." + type="password" + value="" + /> + <br /> + <button + className="Button" + onClick={[Function]} + > + OK + </button> + </form> + </div> + </div> + </div>, +] +`; diff --git a/vnext/src/ui/__tests__/__snapshots__/UserLink.test.js.snap b/vnext/src/ui/__tests__/__snapshots__/UserLink.test.js.snap new file mode 100644 index 00000000..15e25367 --- /dev/null +++ b/vnext/src/ui/__tests__/__snapshots__/UserLink.test.js.snap @@ -0,0 +1,33 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[`UserLink renders correctly 1`] = ` +Array [ + <a + className="info-avatar" + href="/ugnich/" + onClick={[Function]} + > + <img + src="https://juick.com/i/a/1-deadbeef.png" + /> + ugnich + </a>, + <a + className="info-avatar" + href="/ugnich/" + onClick={[Function]} + > + <img + src="https://juick.com/i/a/1-deadbeef.png" + /> + ugnich + </a>, + <a + className="info-avatar" + href="https://example.com/u/test" + > + <img /> + + </a>, +] +`; |