From 3feee840aa424819eb27241b8aeea07c1dab2388 Mon Sep 17 00:00:00 2001
From: Pivi Lartisant <90157528+pivilartisant@users.noreply.github.com>
Date: Mon, 23 Oct 2023 11:14:54 +0200
Subject: [PATCH] Add Input Test (#366)

---
 ...x-regular-input-with-content-and-error.png | Bin 0 -> 9675 bytes
 ...gular-input-with-placeholder-and-error.png | Bin 0 -> 8824 bytes
 ...lar-input-with-placeholder-and-warning.png | Bin 0 -> 9252 bytes
 ....cy.tsx-regular-input-with-placeholder.png | Bin 0 -> 8174 bytes
 cypress/component/integration/Input.cy.tsx    | 133 ++++++++++++++++++
 5 files changed, 133 insertions(+)
 create mode 100755 cypress-visual-screenshots/baseline/Input.cy.tsx-regular-input-with-content-and-error.png
 create mode 100755 cypress-visual-screenshots/baseline/Input.cy.tsx-regular-input-with-placeholder-and-error.png
 create mode 100755 cypress-visual-screenshots/baseline/Input.cy.tsx-regular-input-with-placeholder-and-warning.png
 create mode 100755 cypress-visual-screenshots/baseline/Input.cy.tsx-regular-input-with-placeholder.png
 create mode 100644 cypress/component/integration/Input.cy.tsx

diff --git a/cypress-visual-screenshots/baseline/Input.cy.tsx-regular-input-with-content-and-error.png b/cypress-visual-screenshots/baseline/Input.cy.tsx-regular-input-with-content-and-error.png
new file mode 100755
index 0000000000000000000000000000000000000000..9c15f938b288510cda761fa29a7d3b3a26459fc7
GIT binary patch
literal 9675
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

literal 0
HcmV?d00001

diff --git a/cypress-visual-screenshots/baseline/Input.cy.tsx-regular-input-with-placeholder-and-error.png b/cypress-visual-screenshots/baseline/Input.cy.tsx-regular-input-with-placeholder-and-error.png
new file mode 100755
index 0000000000000000000000000000000000000000..66882a15334e7e5d8f615eed4c66e040c1354344
GIT binary patch
literal 8824
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
E1tux-;Q#;t

literal 0
HcmV?d00001

diff --git a/cypress-visual-screenshots/baseline/Input.cy.tsx-regular-input-with-placeholder-and-warning.png b/cypress-visual-screenshots/baseline/Input.cy.tsx-regular-input-with-placeholder-and-warning.png
new file mode 100755
index 0000000000000000000000000000000000000000..49d311ac8176391db7f02597e4a0b8ce19211215
GIT binary patch
literal 9252
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
J@TZG^{$IApyj1`I

literal 0
HcmV?d00001

diff --git a/cypress-visual-screenshots/baseline/Input.cy.tsx-regular-input-with-placeholder.png b/cypress-visual-screenshots/baseline/Input.cy.tsx-regular-input-with-placeholder.png
new file mode 100755
index 0000000000000000000000000000000000000000..e71c23ffef62f85e9c5efa7982b6639b5e1e6f0c
GIT binary patch
literal 8174
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
E6F?@NHUIzs

literal 0
HcmV?d00001

diff --git a/cypress/component/integration/Input.cy.tsx b/cypress/component/integration/Input.cy.tsx
new file mode 100644
index 00000000..92dc2b64
--- /dev/null
+++ b/cypress/component/integration/Input.cy.tsx
@@ -0,0 +1,133 @@
+import '../../../src/global.css';
+import React from 'react';
+import { Input } from '../../../src/components';
+import { compareSnapshot } from '../../compareSnapshot';
+
+describe('Component | Integration | Input', function () {
+  describe('Input', () => {
+    describe('regular input with placeholder', () => {
+      beforeEach(() => {
+        cy.mount(
+          <div className="theme-dark">
+            <Input placeholder={'placeholder'} />
+          </div>,
+        );
+      });
+
+      it('should render and have placeholder', () => {
+        cy.get('[data-testid="input-field"]')
+          .should('exist')
+          .and('have.attr', 'placeholder');
+      });
+
+      it('should focus on click', () => {
+        cy.get('[data-testid="input-field"]').click().should('be.focused');
+      });
+
+      it('should receive typed input', () => {
+        cy.get('[data-testid="input-field"]')
+          .type('typed content')
+          .should('have.value', 'typed content')
+          .clear()
+          .should('have.attr', 'placeholder');
+      });
+
+      it('should match snapshot', () => {
+        compareSnapshot(cy, 'regular-input-with-placeholder');
+      });
+    });
+
+    describe('regular input with placeholder and error', () => {
+      beforeEach(() => {
+        cy.mount(
+          <div className="theme-dark">
+            <Input placeholder={'placeholder'} error={'error'} />
+          </div>,
+        );
+      });
+
+      it('should render and have placeholder', () => {
+        cy.get('[data-testid="input-field"]')
+          .should('exist')
+          .and('have.attr', 'placeholder');
+      });
+
+      it('should display error message', () => {
+        cy.get('[data-testid="input-field-message"]').contains('error');
+      });
+
+      it('should match snapshot', () => {
+        compareSnapshot(cy, 'regular-input-with-placeholder-and-error');
+      });
+    });
+
+    describe('regular input with content and error', () => {
+      beforeEach(() => {
+        cy.mount(
+          <div className="theme-dark">
+            <Input
+              placeholder={'placeholder'}
+              value={'wrong content'}
+              error={'error'}
+            />
+          </div>,
+        );
+      });
+
+      it('should render and have placeholder', () => {
+        cy.get('[data-testid="input-field"]')
+          .should('exist')
+          .and('have.attr', 'placeholder');
+      });
+
+      it('should wrong content displayed', () => {
+        cy.get('[data-testid="input-field"]')
+          .should('exist')
+          .and('have.value', 'wrong content');
+      });
+
+      it('should display error message', () => {
+        cy.get('[data-testid="input-field-message"]').contains('error');
+      });
+
+      it('should match snapshot', () => {
+        compareSnapshot(cy, 'regular-input-with-content-and-error');
+      });
+    });
+
+    describe('regular input with placeholder and warning', () => {
+      beforeEach(() => {
+        cy.mount(
+          <div className="theme-dark">
+            <Input placeholder={'placeholder'} warning={'warning'} />
+          </div>,
+        );
+      });
+
+      it('should render placeholder and warning', () => {
+        cy.get('[data-testid="input-field"]')
+          .should('exist')
+          .and('have.attr', 'placeholder');
+        cy.get('[data-testid="input-field-message"]').contains('warning');
+      });
+
+      it('should receive typed input and render warning', () => {
+        cy.get('[data-testid="input-field"]')
+          .type('typed content')
+          .should('have.value', 'typed content');
+        cy.get('[data-testid="input-field-message"]').contains('warning');
+      });
+
+      it('should render warning with no content', () => {
+        cy.get('[data-testid="input-field"]')
+          .clear()
+          .should('have.attr', 'placeholder');
+
+        cy.get('[data-testid="input-field-message"]').should('exist');
+      });
+      it('should match snapshot', () => {
+        compareSnapshot(cy, 'regular-input-with-placeholder-and-warning');
+      });
+    });
+  });
+});