@arquimedes.co/eureka-forms 2.0.32 → 2.0.34-test

package/cypress/e2e/Widget.cy.ts

@@ -0,0 +1,95 @@
+import { Form } from '../../src/@Types';
+import { FormStep } from '../../src/@Types/FormStep';
+import StepTypes from '../../src/constants/FormStepTypes';
+import { FilledStep } from '../@Types';
+import { fillStep } from '../utils/checkValidStep';
+import { validateRequest } from '../utils/validateRequest';
+
+const idOrganization = Cypress.env('idOrganization');
+const apikey = Cypress.env('apikey');
+const env = Cypress.env('environment');
+const requestTimeout = env === 'prod' ? 10000 : 30000;
+Cypress.config('defaultCommandTimeout', requestTimeout);
+
+export const DEFAULT_DATE = new Date(2018, 10, 30, 13, 23);
+
+const GlobalValues = { globalValue: 'Global Value' };
+
+const HiddenStep: FormStep = {
+    id: 'idHiddenStep',
+    type: StepTypes.TEXTINPUT,
+    description: null,
+    idSection: 'hidden',
+    label: 'Hidden Step',
+    required: true,
+    size: 1,
+};
+
+describe('Standalone Form', () => {
+    const formUrl = `http://localhost:3002/widget?apikey=${apikey}&idOrganization=${idOrganization}&data-values=${encodeURIComponent(
+        JSON.stringify({
+            idHiddenStep: 'Hidden Value',
+            ...GlobalValues,
+        })
+    )}`;
+
+    beforeEach(() => {
+        cy.clock(DEFAULT_DATE, ['Date']);
+        cy.intercept('GET', /api\/form\/[a-z0-9A-z]+/).as('getForm');
+        cy.visit(formUrl, {
+            failOnStatusCode: false,
+            timeout: env === 'prod' ? 3000 : 8000,
+        });
+
+        cy.wait('@getForm', { timeout: requestTimeout }).then(
+            ({ response }) => {
+                const form = response?.body as Form;
+                if (!form.hiddenSteps) form.hiddenSteps = [];
+                form.hiddenSteps.push(HiddenStep.id);
+                form.steps[HiddenStep.id] = HiddenStep;
+                cy.wrap(form).as('form');
+            }
+        );
+    });
+
+    it('Submit valid Form', () => {
+        const filledSteps = cy.get<Form>('@form').then((form) => {
+            let idSection: string | null = form.firstSection;
+            let filledSteps = cy.wrap<FilledStep[]>([
+                {
+                    idStep: HiddenStep.id,
+                    step: HiddenStep,
+                    value: 'Hidden Value',
+                },
+            ]);
+            while (idSection) {
+                const section = form.sections[idSection];
+                for (const idStep of section.steps) {
+                    filledSteps = filledSteps.then((filledSteps) =>
+                        fillStep(idStep, form.steps, form).then((a) => [
+                            ...filledSteps,
+                            ...a,
+                        ])
+                    );
+                }
+                idSection = section.nextSection;
+                if (form.type === 'STEPPER') {
+                    ///handle next btn
+                }
+            }
+            return filledSteps;
+        });
+
+        cy.intercept('POST', /api\/ticket\/[a-z0-9A-z]+/, {
+            case: 'ABCDEFGHI',
+            url: 'https://arquimedes.clients.capta.co/tickets/abcdefghijklmnopqrstuvwx',
+        }).as('submit');
+
+        cy.get('[data-testid= "form__submit"]').click();
+        cy.wait('@submit').then(({ request }) => {
+            filledSteps.then((filledSteps) => {
+                validateRequest(request?.body, filledSteps, GlobalValues);
+            });
+        });
+    });
+});

package/cypress/fixtures/example.json

@@ -0,0 +1,5 @@
+{
+  "name": "Using fixtures to represent data",
+  "email": "hello@cypress.io",
+  "body": "Fixtures are a great way to mock data for responses to routes"
+}

package/cypress/fixtures/example.txt

@@ -0,0 +1 @@
+Archivo Txt de Prueba

package/cypress/support/commands.ts

@@ -0,0 +1,88 @@
+/* eslint-disable @typescript-eslint/no-namespace */
+/// <reference types="cypress" />
+// ***********************************************
+// This example commands.ts shows you how to
+// create various custom commands and overwrite
+// existing commands.
+//
+// For more comprehensive examples of custom
+// commands please read more here:
+// https://on.cypress.io/custom-commands
+// ***********************************************
+//
+//
+// -- This is a parent command --
+// Cypress.Commands.add('login', (email, password) => { ... })
+//
+//
+// -- This is a child command --
+// Cypress.Commands.add('drag', { prevSubject: 'element'}, (subject, options) => { ... })
+//
+//
+// -- This is a dual command --
+// Cypress.Commands.add('dismiss', { prevSubject: 'optional'}, (subject, options) => { ... })
+//
+//
+// -- This will overwrite an existing command --
+// Cypress.Commands.overwrite('visit', (originalFn, url, options) => { ... })
+//
+// declare global {
+//   namespace Cypress {
+//     interface Chainable {
+//       login(email: string, password: string): Chainable<void>
+//       drag(subject: string, options?: Partial<TypeOptions>): Chainable<Element>
+//       dismiss(subject: string, options?: Partial<TypeOptions>): Chainable<Element>
+//       visit(originalFn: CommandOriginalFn, url: string, options: Partial<VisitOptions>): Chainable<Element>
+//     }
+//   }
+// }
+
+import axios from 'axios';
+import Bluebird from 'cypress/types/bluebird';
+import { Form } from '../../src/@Types/Form';
+
+Cypress.Commands.add(
+    'fetchForm',
+    function (env: 'test' | 'prod', idOrganization: string, apiKey: string) {
+        const domain = env === 'prod' ? 'capta.co' : 'eureka-test.click';
+        const apiUrl = `https://api.forms.${domain}/api/form/${apiKey}?idOrganization${idOrganization}`;
+        return new Cypress.Promise((resolve, reject) => {
+            axios
+                .get(apiUrl, { timeout: env === 'prod' ? 10000 : 30000 })
+                .then((response) => resolve(response.data))
+                .catch((error) => reject(error));
+        });
+    }
+);
+
+declare global {
+    namespace Cypress {
+        interface Chainable {
+            /**
+             * Custom command to select DOM element by data-cy attribute.
+             * @example cy.dataCy('greeting')
+             */
+            fetchForm(
+                env: 'prod' | 'test',
+                idOrganization: string,
+                apiKey: string
+            ): Bluebird<Form>;
+        }
+    }
+}
+
+// Cypress.Commands.add(
+//     'fetchClient' as any,
+//     function (url: string, environment: 'test' | 'prod') {
+//         const urlParts = url.split('.clients.');
+//         const apiUrl = 'https://api.clients.' + urlParts[1];
+//         return new Cypress.Promise((resolve, reject) => {
+//             axios
+//                 .get(apiUrl, {
+//                     timeout: environment === 'prod' ? 10000 : 30000,
+//                 })
+//                 .then((response) => resolve(response.data))
+//                 .catch((error) => reject(error));
+//         });
+//     }
+// );

package/cypress/support/e2e.ts

@@ -0,0 +1,20 @@
+// ***********************************************************
+// This example support/e2e.ts is processed and
+// loaded automatically before your test files.
+//
+// This is a great place to put global configuration and
+// behavior that modifies Cypress.
+//
+// You can change the location of this file or turn off
+// automatically serving support files with the
+// 'supportFile' configuration option.
+//
+// You can read more here:
+// https://on.cypress.io/configuration
+// ***********************************************************
+
+// Import commands.js using ES2015 syntax:
+import './commands';
+
+// Alternatively you can use CommonJS syntax:
+// require('./commands')

package/cypress/temp.tsconfig.json

@@ -0,0 +1,7 @@
+{
+    "extends": "../tsconfig.json",
+    "compilerOptions": {
+        "types": ["cypress", "node"]
+    },
+    "include": ["e2e", "fixtures", "suport", "utils", "@Types.ts"]
+}

package/cypress/utils/checkInvalidStep.ts

@@ -0,0 +1,148 @@
+import {
+    CheckBox,
+    ClassifierSelector,
+    DatePicker,
+    FileUpload,
+    FormSelector,
+    FormStep,
+    TextArea,
+    TextInput,
+} from '../../src/@Types/FormStep';
+import { CBRFormStep } from '../../src/@Types/CBRFormStep';
+
+export function manageInvalidStep(step: FormStep | CBRFormStep): void {
+    switch (step.type) {
+        case 'TEXTINPUT':
+            checkFailTextInput(step);
+            break;
+        case 'SELECTOR':
+            checkFailSelector(step);
+            break;
+        case 'TEXTAREA':
+            checkFailTextArea(step);
+            break;
+        case 'CHECKBOX':
+            checkFailCheckBox(step);
+            break;
+        case 'FILEUPLOAD':
+            checkFailFileUpload(step);
+            break;
+        case 'CLASSIFIER_SELECTOR':
+            checkFailClasifier(step);
+            break;
+        case 'DATEPICKER':
+            checkFailDatePicker(step);
+            break;
+        case 'CBR_FIRST_NAME':
+            break;
+        case 'CBR_MIDDLE_NAME':
+            break;
+        case 'CBR_LAST_NAME':
+            break;
+        case 'CBR_SECOND_LAST_NAME':
+            break;
+        case 'CBR_PROYECTO':
+            break;
+        case 'CBR_DOC':
+            break;
+        case 'CBR_CEL':
+            break;
+        case 'CBR_PHONE':
+            break;
+        case 'CBR_TIPO_DOC':
+            break;
+        case 'CBR_EMAIL':
+            break;
+        case 'CBR_TIPO_SOLICITANTE':
+            break;
+        case 'CBR_INMUEBLE':
+            break;
+        case 'CBR_TIPO_ESPACIO':
+            break;
+        case 'CBR_LOCATIVAS':
+            break;
+        case 'CBR_COMENTARIO':
+            break;
+        case 'CBR_INCIDENCIAS':
+            break;
+        default:
+            break;
+    }
+}
+
+function checkFailTextInput(step: TextInput): void {
+    if (step.required) {
+        cy.get('[data-testid= "form__submit"]').click();
+        cy.get('[data-testid= "' + step.id + '"] ')
+            .children()
+            .should('have.class', 'Mui-error');
+    }
+    //TODO: Check Validations
+}
+
+// function insertWrongType(step: TextInput): void {
+//     //TODO make examples that will fail the validation
+//     const validation = step.validation;
+//     if (validation != null) {
+//         const message: string = validation.message;
+//         const regular: string = validation.value;
+//     }
+// }
+
+function checkFailSelector(step: FormSelector): void {
+    if (step.required) {
+        cy.get('[data-testid= "form__submit"]').click();
+        cy.get('[data-testid= "' + step.id + '"] ').should(
+            'have.class',
+            'Mui-error'
+        );
+    }
+}
+
+function checkFailTextArea(step: TextArea): void {
+    if (step.required) {
+        cy.get('[data-testid= "form__submit"]').click();
+        cy.get('[data-testid= "' + step.id + '"] ')
+            .children()
+            .should('have.class', 'Mui-error');
+    }
+}
+function checkFailCheckBox(step: CheckBox): void {
+    if (step.required) {
+        cy.get('[data-testid= "form__submit"]').click();
+        cy.get('[data-testid= "' + step.id + '"] ')
+            .parent()
+            .parent()
+            .find('div')
+            .contains('Este campo es obligatorio');
+    }
+}
+
+function checkFailFileUpload(step: FileUpload): void {
+    if (step.required) {
+        cy.get('[data-testid= "form__submit"]').click();
+        cy.get('[data-testid= "' + step.id + '"] ')
+            .parent()
+            .find('div')
+            .contains('Este campo es obligatorio');
+    }
+}
+
+function checkFailClasifier(step: ClassifierSelector): void {
+    if (step.required) {
+        cy.get('[data-testid= "form__submit"]').click();
+        cy.get('[data-testid= "' + step.id + '"] ').should(
+            'have.class',
+            'Mui-error'
+        );
+    }
+}
+
+function checkFailDatePicker(step: DatePicker): void {
+    if (step.required) {
+        cy.get('[data-testid= "form__submit"]').click();
+        cy.get('[data-testid= "' + step.id + '"] ')
+            .children()
+            .should('have.class', 'Mui-error');
+    }
+}