version to test page

Author: jsagardoy

.vscode/launch.json

@@ -0,0 +1,16 @@
+{
+    // Use IntelliSense para saber los atributos posibles.
+    // Mantenga el puntero para ver las descripciones de los existentes atributos 
+    // Para más información, visite: https://go.microsoft.com/fwlink/?linkid=830387
+    "version": "0.2.0",
+    "configurations": [
+        
+        {
+            "type": "chrome",
+            "request": "launch",
+            "name": "Lanzar Chrome contra localhost",
+            "url": "http://localhost:8080",
+            "webRoot": "${workspaceFolder}"
+        }
+    ]
+}

13 TestAction/src/common/components/form/__snapshots__/button.spec.tsx.snap

@@ -0,0 +1,11 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`common/components/form/button specs should render as expected when passing required properties 1`] = `
+<button
+  className="test className"
+  onClick={[Function]}
+  type="button"
+>
+  test label
+</button>
+`;

13 TestAction/src/common/components/form/__snapshots__/input.spec.tsx.snap

@@ -0,0 +1,55 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`/common/components specs should render as expected when passing required and optional properties 1`] = `
+<div
+  className="form-group has-error"
+>
+  <label
+    htmlFor="test name"
+  >
+    test label
+  </label>
+  <div
+    className="field"
+  >
+    <input
+      className="form-control"
+      name="test name"
+      onChange={[Function]}
+      type="text"
+      value="test value"
+    />
+  </div>
+  <div
+    className="help-block"
+  >
+    test error
+  </div>
+</div>
+`;
+
+exports[`/common/components specs should render as expected when passing required properties 1`] = `
+<div
+  className="form-group"
+>
+  <label
+    htmlFor="test name"
+  >
+    test label
+  </label>
+  <div
+    className="field"
+  >
+    <input
+      className="form-control"
+      name="test name"
+      onChange={[Function]}
+      type="text"
+      value="test value"
+    />
+  </div>
+  <div
+    className="help-block"
+  />
+</div>
+`;

13 TestAction/src/common/components/form/button.spec.tsx

@@ -0,0 +1,45 @@
+import * as React from 'react';
+import { shallow } from 'enzyme';
+import { Button } from './button';
+
+describe('common/components/form/button specs', () => {
+    it('should render as expected when passing required properties', () => {
+        // Arrange
+        const props = {
+            label: 'test label',
+            className:'test className',
+            onClick: () => { },
+        };
+
+        // Act
+        const component = shallow(
+            <Button
+                {...props}
+            />,
+        );
+
+        // Assert
+        expect(component).toMatchSnapshot();
+    });
+
+    it('should call onClick prop when simulate button click', () => {
+        // Arrange
+        const props = {
+            label: 'test label',
+            onClick: jest.fn(),
+            className: 'test className',
+        };
+
+        // Act
+        const component = shallow(
+            <Button
+                {...props}
+            />,
+        );
+        component.simulate('click');
+        
+        // Assert
+        expect(props.onClick).toHaveBeenCalled();
+    });
+   
+});

13 TestAction/src/common/components/form/input.spec.tsx

@@ -0,0 +1,79 @@
+import * as React from 'react';
+import { shallow } from 'enzyme';
+import { Input } from '.';
+
+
+describe('/common/components specs',()=>{
+
+    it('should render as expected when passing required properties', () => {
+        // Arrange
+        const props = {
+            name: 'test name',
+            label: 'test label',
+            value: 'test value',
+            onChange: () => { },
+        };
+
+        // Act
+        const component = shallow(
+            <Input
+                {...props}
+            />,
+        );
+
+        // Assert
+        expect(component).toMatchSnapshot();
+    });
+    it('should render as expected when passing required and optional properties', () => {
+        // Arrange
+        const props = {
+            name: 'test name',
+            label: 'test label',
+            value: 'test value',
+            onChange: () => { },
+            onBlur: () => { },
+            error: 'test error',
+            type: 'test type',
+        };
+
+        // Act
+        const component = shallow(
+            <Input
+                {...props}
+            />,
+        );
+
+        // Assert
+        expect(component).toMatchSnapshot();
+    });
+    it('should call to onChange prop when simulate input onChange', () => {
+        // Arrange
+        const props = {
+            name: 'test name',
+            label: 'test label',
+            value: 'test value',
+            onChange: jest.fn(),
+            onBlur: () => { },
+            error: 'test error',
+            type: 'test type',
+        };
+
+        // Act
+        const component = shallow(
+            <Input
+                {...props}
+            />,
+        );
+
+        component.find('input').simulate('change', {
+            target: {
+                name: 'test name',
+                value: 'updated value',
+            },
+        });
+
+        // Assert
+        expect(props.onChange).toHaveBeenCalledWith('test name', 'updated value');
+    });
+
+});