LoginButton refactoring and snapshots

2 files changed, 194 insertions, 0 deletions

diff --git a/vnext/src/components/__tests__/LoginButton.test.js b/vnext/src/components/__tests__/LoginButton.test.js
new file mode 100644
index 00000000..0b672365
--- /dev/null
+++ b/vnext/src/components/__tests__/LoginButton.test.js
@@ -0,0 +1,16 @@
+import React from 'react';
+
+import LoginButton from '../LoginButton';
+import renderer from 'react-test-renderer';
+
+test('Login button and form are renders correctly', () => {
+    const button = renderer.create(
+        <LoginButton title="Log in" onAuth={() => {}} />
+    );
+    let link = button.toJSON();
+    expect(link).toMatchSnapshot();
+
+    button.root.instance.toggleModal();
+    let modal = button.toJSON();
+    expect(modal).toMatchSnapshot();
+});
\ No newline at end of file
diff --git a/vnext/src/components/__tests__/__snapshots__/LoginButton.test.js.snap b/vnext/src/components/__tests__/__snapshots__/LoginButton.test.js.snap
new file mode 100644
index 00000000..cc01126f
--- /dev/null
+++ b/vnext/src/components/__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>
+  Log in
+</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>
+    Log in
+  </a>,
+  <div
+    id="dialogt"
+    style={
+      Object {
+        "backgroundColor": "rgba(0,0,0,0.3)",
+        "bottom": 0,
+        "left": 0,
+        "padding": 50,
+        "position": "fixed",
+        "right": 0,
+        "top": 0,
+      }
+    }
+  >
+    <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://api.juick.com/_fblogin?state=about://blank"
+            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://api.juick.com/_vklogin?state=about://blank"
+            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="signinput"
+            name="username"
+            onChange={[Function]}
+            placeholder="Username..."
+            type="text"
+            value=""
+          />
+          <br />
+          <input
+            className="signinput"
+            name="password"
+            onChange={[Function]}
+            placeholder="Password..."
+            type="password"
+            value=""
+          />
+          <br />
+          <input
+            className="signsubmit"
+            type="submit"
+            value="OK"
+          />
+        </form>
+      </div>
+    </div>
+  </div>,
+]
+`;