diff --git a/src/async-tokenize/async-tokenize.test.ts b/src/async-tokenize/async-tokenize.test.ts new file mode 100644 index 0000000..f80b445 --- /dev/null +++ b/src/async-tokenize/async-tokenize.test.ts @@ -0,0 +1,165 @@ +import { fireEvent, waitFor } from '@testing-library/dom' + +import { AsyncTokenize } from './async-tokenize' +import { + configureFormSubmissionMock, + formElementsMock, + malgaConfigurations, +} from 'tests/mocks/common-configurations' +import { generateForm } from 'tests/mocks/form-dom' +import { Malga } from 'src/common/malga' + +const onSubmit = vi.fn() + +vi.mock('src/common/malga', async (importOriginal) => { + const Malga = await importOriginal() + return { + ...Malga, + tokenization: vi.fn(), + } +}) + +describe('async-tokenize', () => { + beforeEach(() => { + document.body.innerHTML = '' + }) + test('should be possible to find a tokenId element in the DOM and consequently contained in the form element', async () => { + configureFormSubmissionMock() + generateForm(onSubmit) + + const malga = new Malga(malgaConfigurations(false)) + + const asyncTokenizeObject = new AsyncTokenize(malga, formElementsMock) + + asyncTokenizeObject.handle() + + const form = document.querySelector('form') + fireEvent.submit(form!) + + await waitFor(() => { + const tokenIdInput = document.querySelector( + 'input[name="tokenId"]', + ) + expect(tokenIdInput).toBeInTheDocument() + expect(form).toContain(tokenIdInput) + expect(tokenIdInput).toBeTruthy() + }) + }) + test('should be return correct tokenId in sandbox environment ', async () => { + configureFormSubmissionMock() + + generateForm(onSubmit) + + const malga = new Malga(malgaConfigurations(true)) + + const asyncTokenizeObject = new AsyncTokenize(malga, formElementsMock) + + asyncTokenizeObject.handle() + + const form = document.querySelector('form') + fireEvent.submit(form!) + + await waitFor(() => { + const tokenIdInput = document.querySelector( + 'input[name="tokenId"]', + ) + expect(tokenIdInput?.value).toBe('sandbox-token-id') + }) + }) + test('should be return correct tokenId in production environment', async () => { + configureFormSubmissionMock() + + generateForm(onSubmit) + + const malgaConfigurationsProduction = { + apiKey: '17a64c8f-a387-4682-bdd8-d280493715e0', + clientId: 'd1d2b51a-0446-432a-b055-034518c2660e', + } + + const malga = new Malga(malgaConfigurationsProduction) + + const asyncTokenizeObject = new AsyncTokenize(malga, formElementsMock) + + asyncTokenizeObject.handle() + + const form = document.querySelector('form') + fireEvent.submit(form!) + + await waitFor(() => { + const tokenIdInput = document.querySelector( + 'input[name="tokenId"]', + ) + expect(tokenIdInput?.value).toBe('production-token-id') + }) + }) + test('should be possible to remove the elements and thus there is only 1 after the creation of the tokenIdElement and 4 before its creation', async () => { + configureFormSubmissionMock() + + generateForm(onSubmit) + + const malga = new Malga(malgaConfigurations(false)) + + const asyncTokenizeObject = new AsyncTokenize(malga, formElementsMock) + + const inputs = document.querySelectorAll('input') + expect(inputs.length).toBe(4) + + asyncTokenizeObject.handle() + + const form = document.querySelector('form') + fireEvent.submit(form!) + + await waitFor(() => { + const inputs = document.querySelectorAll('input') + expect(inputs.length).toBe(1) + }) + }) + + test('should be possible to return an error if empty apiKey and clientId are sent to the Malga constructor', async () => { + configureFormSubmissionMock() + + generateForm(onSubmit) + + const malgaConfigurationsEmpty = { + apiKey: '', + clientId: '', + } + + const malga = new Malga(malgaConfigurationsEmpty) + + const asyncTokenizeObject = new AsyncTokenize(malga, formElementsMock) + + expect(asyncTokenizeObject.handle).toThrowError( + "Cannot read properties of undefined (reading 'elements')", + ) + }) + test('should be possible to throw an error when the elements passed are incompatible with those in the DOM', async () => { + configureFormSubmissionMock() + + generateForm(onSubmit) + + const malga = new Malga(malgaConfigurations(false)) + + const asyncTokenizeObject = new AsyncTokenize(malga, { + form: 'data-form', + holderName: 'data-holder-name', + number: 'data-number', + expirationDate: 'data-expiration-date', + cvv: 'data-cvv', + }) + + expect(asyncTokenizeObject.handle).toThrowError( + "Cannot read properties of undefined (reading 'elements')", + ) + }) + test('should be possible to return an error if the form inputs do not have values assigned', async () => { + configureFormSubmissionMock() + generateForm() + + const malga = new Malga(malgaConfigurations(false)) + + const asyncTokenizeObject = new AsyncTokenize(malga, formElementsMock) + + expect(asyncTokenizeObject.handle).toThrowError() + }) +}) diff --git a/src/async-tokenize/async-tokenize.ts b/src/async-tokenize/async-tokenize.ts index c903ea6..94fee1d 100644 --- a/src/async-tokenize/async-tokenize.ts +++ b/src/async-tokenize/async-tokenize.ts @@ -5,7 +5,7 @@ import { removeFormElements, createFormElement, getFormValues, -} from 'src/common/utils' +} from '../common/utils' export class AsyncTokenize { constructor( @@ -33,8 +33,9 @@ export class AsyncTokenize { removeFormElements(this.elements) const tokenIdElement = createFormElement('tokenId', tokenId) - form.appendChild(tokenIdElement) - form.submit() + form?.appendChild(tokenIdElement) + + form?.submit() }) } } diff --git a/src/common/interfaces/malga.ts b/src/common/interfaces/malga.ts new file mode 100644 index 0000000..c74448f --- /dev/null +++ b/src/common/interfaces/malga.ts @@ -0,0 +1,6 @@ +export interface MalgaCreateTokenResponse { + cardHolderName: string + cardNumber: string + cardExpirationDate: string + cardCvv: string +} diff --git a/src/common/utils/form-elements/form-elements.test.ts b/src/common/utils/form-elements/form-elements.test.ts new file mode 100644 index 0000000..f0d38f6 --- /dev/null +++ b/src/common/utils/form-elements/form-elements.test.ts @@ -0,0 +1,123 @@ +import { + createFormElement, + getFormElements, + removeFormElements, +} from './form-elements' +import { generateForm } from 'tests/mocks/form-dom' + +const tokenId = '54595fec-87db-44f8-996a-2f4d6bf270b9' +describe('form-elements', () => { + describe('getFormElements', () => { + test('should be possible to find the elements in the dom', () => { + generateForm() + + const formElements = getFormElements({ + form: 'data-malga-tokenization-form', + holderName: 'data-malga-tokenization-holder-name', + number: 'data-malga-tokenization-number', + expirationDate: 'data-malga-tokenization-expiration-date', + cvv: 'data-malga-tokenization-cvv', + }) + + expect(formElements.form).toBeInTheDocument() + expect(formElements.holderName).toBeInTheDocument() + expect(formElements.cvv).toBeInTheDocument() + expect(formElements.expirationDate).toBeInTheDocument() + expect(formElements.number).toBeInTheDocument() + }) + + test("Should be returned null when elements aren't finded", () => { + generateForm() + + const formElements = getFormElements({ + form: 'data-malga-form', + holderName: 'data-malga-holder-name', + number: 'data-malga-number', + expirationDate: 'data-malga-expiration-date', + cvv: 'data-malga-cvv', + }) + expect(formElements.form).toBeNull() + expect(formElements.holderName).toBeNull() + expect(formElements.number).toBeNull() + expect(formElements.expirationDate).toBeNull() + expect(formElements.cvv).toBeNull() + }) + }) + describe('removeFormElements', () => { + beforeEach(() => { + document.body.innerHTML = '' + }) + test('should be possible to return null when trying to find the elements in the dom after calling the function', () => { + generateForm() + + removeFormElements({ + form: 'data-malga-tokenization-form', + holderName: 'data-malga-tokenization-holder-name', + number: 'data-malga-tokenization-number', + expirationDate: 'data-malga-tokenization-expiration-date', + cvv: 'data-malga-tokenization-cvv', + }) + + expect( + document.querySelector('data-malga-tokenization-holder-name'), + ).toBeNull() + expect( + document.querySelector('data-malga-tokenization-number'), + ).toBeNull() + expect( + document.querySelector('data-malga-tokenization-expiration-date'), + ).toBeNull() + expect(document.querySelector('data-malga-tokenization-cvv')).toBeNull() + }) + test('should be returned the elements in the DOM, when the function are called with selectores wrong, since the elements could not be removed', () => { + generateForm() + + removeFormElements({ + form: 'data-malga-form', + holderName: 'data-malga-holder-name', + number: 'data-malga-number', + expirationDate: 'data-malga-expiration-date', + cvv: 'data-malga-cvv', + }) + const formElements = getFormElements({ + form: 'data-malga-tokenization-form', + holderName: 'data-malga-tokenization-holder-name', + number: 'data-malga-tokenization-number', + expirationDate: 'data-malga-tokenization-expiration-date', + cvv: 'data-malga-tokenization-cvv', + }) + expect(formElements.form).toBeInTheDocument() + expect(formElements.holderName).toBeInTheDocument() + expect(formElements.number).toBeInTheDocument() + expect(formElements.expirationDate).toBeInTheDocument() + expect(formElements.cvv).toBeInTheDocument() + }) + }) + describe('createFormElements', () => { + test('should be possible to return a field with attributes of name, type and value which must be the passed tokenId', () => { + const tokenIdElement = createFormElement('tokenId', tokenId) + + expect(tokenIdElement).toHaveAttribute('name', 'tokenId') + expect(tokenIdElement).toHaveValue(tokenId) + expect(tokenIdElement).toHaveAttribute('type', 'hidden') + }) + + test('should be possible for the field field to be the same as the one mounted in the dom', () => { + const tokenIdElement = createFormElement('tokenId', tokenId) + + const field = document.createElement('input') + field.type = 'hidden' + field.name = 'tokenId' + field.value = '54595fec-87db-44f8-996a-2f4d6bf270b9' + + expect(tokenIdElement).toEqual(field) + }) + test('should be possible to insert the element in the body in the dom', () => { + const tokenIdElement = createFormElement('tokenId', tokenId) + + document.body.appendChild(tokenIdElement) + + expect(tokenIdElement).toBeInTheDocument() + }) + }) +}) diff --git a/src/common/utils/form-values/form-values.test.ts b/src/common/utils/form-values/form-values.test.ts new file mode 100644 index 0000000..8dde353 --- /dev/null +++ b/src/common/utils/form-values/form-values.test.ts @@ -0,0 +1,62 @@ +import { formValuesMock } from 'tests/mocks/common-configurations' +import { getFormValues } from './form-values' +import { generateForm, generateFormEmptyValues } from 'tests/mocks/form-dom' + +describe('getFormValues', () => { + describe('form-values', () => { + beforeEach(() => { + document.body.innerHTML = '' + }) + test('should be the values of elements equals to sended', () => { + generateForm() + + const formValue = getFormValues({ + form: 'data-malga-tokenization-form', + holderName: 'data-malga-tokenization-holder-name', + number: 'data-malga-tokenization-number', + expirationDate: 'data-malga-tokenization-expiration-date', + cvv: 'data-malga-tokenization-cvv', + }) + + expect(formValue.holderName).toEqual('Taylor Swift') + expect(formValue.number).toEqual('5173000265860114') + expect(formValue.expirationDate).toEqual('05/08/2024') + expect(formValue.cvv).toEqual('114') + }) + test('should be returned elements with empty values', () => { + generateFormEmptyValues() + + const formValue = getFormValues({ + form: 'data-malga-tokenization-form', + holderName: 'data-malga-tokenization-holder-name', + number: 'data-malga-tokenization-number', + expirationDate: 'data-malga-tokenization-expiration-date', + cvv: 'data-malga-tokenization-cvv', + }) + + expect(formValue.holderName).toBe('') + expect(formValue.number).toBe('') + expect(formValue.expirationDate).toBe('') + expect(formValue.cvv).toBe('') + }) + test('should be possible to return error if the elements are not found', () => { + generateForm() + + const inputs = document.querySelectorAll('input') + inputs[0].value = formValuesMock.holderName + inputs[1].value = formValuesMock.number + inputs[2].value = formValuesMock.expirationDate + inputs[3].value = formValuesMock.cvv + + expect(() => + getFormValues({ + form: 'data-malga-form', + holderName: 'data-malga-holder-name', + number: 'data-malga-number', + expirationDate: 'data-malga-expiration-date', + cvv: 'data-malga-cvv', + }), + ).toThrowError() + }) + }) +}) diff --git a/src/tokenization.test.ts b/src/tokenization.test.ts new file mode 100644 index 0000000..561a843 --- /dev/null +++ b/src/tokenization.test.ts @@ -0,0 +1,207 @@ +import { fireEvent, waitFor } from '@testing-library/dom' +import { + configureFormSubmissionMock, + formElementsMock, + formValuesMock, + handleFormMock, + malgaConfigurations, +} from '../tests/mocks/common-configurations' +import { MalgaTokenization } from './tokenization' +import { generateForm, generateFormEmptyValues } from 'tests/mocks/form-dom' + +vi.mock('./common/malga', async (importOriginal) => { + const Malga = await importOriginal() + return { + ...Malga, + tokenization: vi.fn(), + } +}) +const onSubmit = vi.fn() + +function FormForInit(onSubmit: any) { + const { form, holderNameInput, cvvInput, expirationDateInput, numberInput } = + handleFormMock() + + form.setAttribute(formElementsMock.form, '') + form.onsubmit = onSubmit + form.id = 'form' + form.method = 'POST' + form.action = '/test' + + holderNameInput.setAttribute(formElementsMock.holderName, '') + numberInput.setAttribute(formElementsMock.number, '') + cvvInput.setAttribute(formElementsMock.cvv, '') + expirationDateInput.setAttribute(formElementsMock.expirationDate, '') + + document.body.appendChild(form) + form.appendChild(holderNameInput) + form.appendChild(numberInput) + form.appendChild(expirationDateInput) + form.appendChild(cvvInput) + + const inputs = document.querySelectorAll('input') + inputs[0].value = formValuesMock.holderName + inputs[1].value = formValuesMock.number + inputs[2].value = formValuesMock.expirationDate + inputs[3].value = formValuesMock.cvv +} +function FormForTokenize() { + const { form, holderNameInput, cvvInput, expirationDateInput, numberInput } = + handleFormMock() + + form.setAttribute(formElementsMock.form, '') + + form.id = 'form' + form.method = 'POST' + form.action = '/test' + + holderNameInput.setAttribute(formElementsMock.holderName, '') + numberInput.setAttribute(formElementsMock.number, '') + cvvInput.setAttribute(formElementsMock.cvv, '') + expirationDateInput.setAttribute(formElementsMock.expirationDate, '') + + document.body.appendChild(form) + form.appendChild(holderNameInput) + form.appendChild(numberInput) + form.appendChild(expirationDateInput) + form.appendChild(cvvInput) + + const inputs = document.querySelectorAll('input') + inputs[0].value = formValuesMock.holderName + inputs[1].value = formValuesMock.number + inputs[2].value = formValuesMock.expirationDate + inputs[3].value = formValuesMock.cvv +} +describe('MalgaTokenization', () => { + describe('init', () => { + beforeEach(() => { + document.body.innerHTML = '' + }) + test('should be possible to return the tokenId element', async () => { + configureFormSubmissionMock() + + generateForm(onSubmit) + + const malgaTokenizationObject = new MalgaTokenization( + malgaConfigurations(false), + ) + + malgaTokenizationObject.init() + + const form = document.querySelector('form') + fireEvent.submit(form!) + + await waitFor(() => { + const tokenIdInput = document.querySelector( + 'input[name="tokenId"]', + ) + expect(tokenIdInput).toBeInTheDocument() + expect(form).toContain(tokenIdInput) + expect(tokenIdInput).toBeTruthy() + }) + }) + test('should be possible to return an error if form elements do not have values assigned', async () => { + configureFormSubmissionMock() + + generateFormEmptyValues(onSubmit) + + const malgaTokenizationObject = new MalgaTokenization( + malgaConfigurations(false), + ) + + await waitFor(() => { + expect(malgaTokenizationObject.init).rejects.toThrowError() + }) + }) + test('should be possible to return an error if apiKey and clientId are passed empty', async () => { + configureFormSubmissionMock() + + FormForInit(onSubmit) + + const malgaConfigurationsEmpty = { + apiKey: '', + clientId: '', + } + + const malgaTokenizationObject = new MalgaTokenization( + malgaConfigurationsEmpty, + ) + + await waitFor(() => { + expect(malgaTokenizationObject.init).rejects.toThrowError() + }) + }) + }) + describe('tokenize', () => { + beforeEach(() => { + document.body.innerHTML = '' + }) + test('should be possible to return a not falsy value equal to production-token-id', async () => { + configureFormSubmissionMock() + const malgaTokenizationObject = new MalgaTokenization( + malgaConfigurations(false), + ) + FormForTokenize() + const form = document.querySelector('form') + fireEvent.submit(form!) + const { tokenId } = await malgaTokenizationObject.tokenize() + await waitFor(() => { + expect(tokenId).toBe('production-token-id') + }) + }) + test('should be possible to return an error if form elements do not have values assigned', async () => { + configureFormSubmissionMock() + const malgaTokenizationObject = new MalgaTokenization( + malgaConfigurations(false), + ) + + const { + form, + holderNameInput, + cvvInput, + expirationDateInput, + numberInput, + } = handleFormMock() + + form.setAttribute(formElementsMock.form, '') + form.id = 'form' + form.method = 'POST' + form.action = '/test' + + holderNameInput.setAttribute(formElementsMock.holderName, '') + numberInput.setAttribute(formElementsMock.number, '') + cvvInput.setAttribute(formElementsMock.cvv, '') + expirationDateInput.setAttribute(formElementsMock.expirationDate, '') + + document.body.appendChild(form) + form.appendChild(holderNameInput) + form.appendChild(numberInput) + form.appendChild(expirationDateInput) + form.appendChild(cvvInput) + + const form2 = document.querySelector('form') + fireEvent.submit(form2!) + + await expect(malgaTokenizationObject.tokenize()).rejects.toThrowError() + }) + test('should be possible to return an error if apiKey and clientId are passed empty', async () => { + configureFormSubmissionMock() + + const malgaConfigurationsEmpty = { + apiKey: '', + clientId: '', + } + + const malgaTokenizationObject = new MalgaTokenization( + malgaConfigurationsEmpty, + ) + + FormForTokenize() + + const form = document.querySelector('form') + fireEvent.submit(form!) + + await expect(malgaTokenizationObject.tokenize()).rejects.toThrowError() + }) + }) +}) diff --git a/src/tokenization.ts b/src/tokenization.ts index 12d8f00..5b1d2d7 100644 --- a/src/tokenization.ts +++ b/src/tokenization.ts @@ -1,14 +1,14 @@ import { Malga } from './common/malga' -import { AsyncTokenize } from './async-tokenize' -import { Tokenize } from './tokenize' - import type { MalgaConfigurations, MalgaConfigurationsElements, MalgaFormElements, } from 'src/common/interfaces' +import { AsyncTokenize } from './async-tokenize' +import { Tokenize } from './tokenize' + export class MalgaTokenization { private readonly malga: Malga private readonly elements: MalgaFormElements diff --git a/src/tokenize/tokenize.test.ts b/src/tokenize/tokenize.test.ts new file mode 100644 index 0000000..d611d18 --- /dev/null +++ b/src/tokenize/tokenize.test.ts @@ -0,0 +1,116 @@ +import { + formElementsMock, + handleFormMock, + malgaConfigurations, +} from 'tests/mocks/common-configurations' +import { generateForm } from 'tests/mocks/form-dom' +import { Malga } from 'src/common/malga' +import { Tokenize } from './tokenize' + +vi.mock('src/common/malga', async (importOriginal) => { + const Malga = await importOriginal() + return { + ...Malga, + tokenization: vi.fn(), + } +}) + +describe('Tokenize', () => { + describe('handle', () => { + beforeEach(() => { + document.body.innerHTML = '' + }) + + test('should be possible for a tokenId to exist when elements are passed correctly', async () => { + generateForm() + + const malga = new Malga(malgaConfigurations(false)) + + const tokenizeObject = new Tokenize(malga, formElementsMock) + const tokenId = await tokenizeObject.handle() + + expect(tokenId).toBeTruthy() + }) + test('should be possible to return a tokenId equal to sandbox-token-id when configurations include sandbox equal to true', async () => { + generateForm() + + const malga = new Malga(malgaConfigurations(true)) + + const tokenizeObject = new Tokenize(malga, formElementsMock) + + const tokenId = await tokenizeObject.handle() + expect(tokenId).toMatchObject({ tokenId: 'sandbox-token-id' }) + }) + test('should be possible to return a tokenId equal to sandbox-token-id when configurations include production equal to true', async () => { + generateForm() + + const malga = new Malga(malgaConfigurations(false)) + + const tokenizeObject = new Tokenize(malga, formElementsMock) + + const tokenId = await tokenizeObject.handle() + expect(tokenId).toMatchObject({ tokenId: 'production-token-id' }) + }) + test('should be possible to return error when elements are not passed correctly', async () => { + generateForm() + + const malga = new Malga(malgaConfigurations(false)) + + const elementsMock = { + form: 'jenjen', + holderName: 'le', + number: 'li', + expirationDate: 'lo', + cvv: 'lu', + } + const tokenizeObject = new Tokenize(malga, elementsMock) + + await expect(tokenizeObject.handle()).rejects.toThrowError( + "Cannot read properties of null (reading 'value')", + ) + }) + test('should be possible to return an error if the apiKey and clientId settings are empty', async () => { + generateForm() + + const malgaConfigurationsEmpty = { + apiKey: '', + clientId: '', + } + + const malga = new Malga(malgaConfigurationsEmpty) + + const tokenizeObject = new Tokenize(malga, formElementsMock) + + await expect(tokenizeObject.handle).rejects.toThrowError( + "Cannot read properties of undefined (reading 'elements')", + ) + }) + test('should be possible to return an error if the form inputs do not have values assigned', async () => { + const { + form, + holderNameInput, + cvvInput, + expirationDateInput, + numberInput, + } = handleFormMock() + + form.setAttribute(formElementsMock.form, '') + holderNameInput.setAttribute(formElementsMock.holderName, '') + numberInput.setAttribute(formElementsMock.number, '') + cvvInput.setAttribute(formElementsMock.cvv, '') + expirationDateInput.setAttribute(formElementsMock.expirationDate, '') + + document.body.appendChild(form) + form.appendChild(holderNameInput) + form.appendChild(numberInput) + form.appendChild(expirationDateInput) + form.appendChild(cvvInput) + + const malga = new Malga(malgaConfigurations(false)) + + const tokenizeObject = new Tokenize(malga, formElementsMock) + + await expect(tokenizeObject.handle()).rejects.toThrowError() + }) + }) +}) diff --git a/src/tokenize/tokenize.ts b/src/tokenize/tokenize.ts index 65136ba..f2f06bf 100644 --- a/src/tokenize/tokenize.ts +++ b/src/tokenize/tokenize.ts @@ -1,6 +1,6 @@ import { Malga } from 'src/common/malga' import { MalgaFormElements } from 'src/common/interfaces' -import { getFormValues } from 'src/common/utils' +import { getFormValues } from '../common/utils' export class Tokenize { constructor( diff --git a/tests/mocks/common-configurations.ts b/tests/mocks/common-configurations.ts new file mode 100644 index 0000000..4a36d7b --- /dev/null +++ b/tests/mocks/common-configurations.ts @@ -0,0 +1,46 @@ +import { MalgaFormElements } from 'src/common/interfaces/form' + +export function malgaConfigurations(isSandbox: boolean) { + return { + apiKey: '17a64c8f-a387-4682-bdd8-d280493715e0', + clientId: 'd1d2b51a-0446-432a-b055-034518c2660e', + options: { + sandbox: isSandbox, + }, + } +} + +export function configureFormSubmissionMock(eventSubmit?: any) { + eventSubmit + ? (window.HTMLFormElement.prototype.submit = eventSubmit) + : (window.HTMLFormElement.prototype.submit = () => {}) + const onSubmit = vi.fn() + onSubmit.mockImplementation((event) => { + event.preventDefault() + }) +} + +export const formValuesMock = { + holderName: 'Taylor Swift', + number: '5173000265860114', + expirationDate: '05/08/2024', + cvv: '114', +} + +export function handleFormMock() { + return { + form: document.createElement('form'), + holderNameInput: document.createElement('input'), + numberInput: document.createElement('input'), + expirationDateInput: document.createElement('input'), + cvvInput: document.createElement('input'), + } +} + +export const formElementsMock: MalgaFormElements = { + form: 'data-malga-tokenization-form', + holderName: 'data-malga-tokenization-holder-name', + number: 'data-malga-tokenization-number', + expirationDate: 'data-malga-tokenization-expiration-date', + cvv: 'data-malga-tokenization-cvv', +} diff --git a/tests/mocks/form-dom.ts b/tests/mocks/form-dom.ts new file mode 100644 index 0000000..f7dda88 --- /dev/null +++ b/tests/mocks/form-dom.ts @@ -0,0 +1,55 @@ +import { + formElementsMock, + formValuesMock, + handleFormMock, +} from './common-configurations' + +export function generateForm(onSubmit?: any) { + const { form, holderNameInput, cvvInput, expirationDateInput, numberInput } = + handleFormMock() + + form.setAttribute(formElementsMock.form, '') + form.onsubmit = onSubmit + form.id = 'form' + form.method = 'POST' + form.action = '/test' + + holderNameInput.setAttribute(formElementsMock.holderName, '') + numberInput.setAttribute(formElementsMock.number, '') + cvvInput.setAttribute(formElementsMock.cvv, '') + expirationDateInput.setAttribute(formElementsMock.expirationDate, '') + + document.body.appendChild(form) + form.appendChild(holderNameInput) + form.appendChild(numberInput) + form.appendChild(expirationDateInput) + form.appendChild(cvvInput) + + const inputs = document.querySelectorAll('input') + inputs[0].value = formValuesMock.holderName + inputs[1].value = formValuesMock.number + inputs[2].value = formValuesMock.expirationDate + inputs[3].value = formValuesMock.cvv +} + +export function generateFormEmptyValues(onSubmit?: any) { + const { form, holderNameInput, cvvInput, expirationDateInput, numberInput } = + handleFormMock() + + form.setAttribute(formElementsMock.form, '') + form.onsubmit = onSubmit + form.id = 'form' + form.method = 'POST' + form.action = '/test' + + holderNameInput.setAttribute(formElementsMock.holderName, '') + numberInput.setAttribute(formElementsMock.number, '') + cvvInput.setAttribute(formElementsMock.cvv, '') + expirationDateInput.setAttribute(formElementsMock.expirationDate, '') + + document.body.appendChild(form) + form.appendChild(holderNameInput) + form.appendChild(numberInput) + form.appendChild(expirationDateInput) + form.appendChild(cvvInput) +} diff --git a/tests/mocks/request-handlers.ts b/tests/mocks/request-handlers.ts index 49f3782..929b190 100644 --- a/tests/mocks/request-handlers.ts +++ b/tests/mocks/request-handlers.ts @@ -1,17 +1,36 @@ -import { http, HttpResponse } from 'msw' +import { http, HttpResponse, PathParams } from 'msw' +import { MalgaCreateTokenResponse } from 'src/common/interfaces/malga' export const handlers = [ http.post('https://sandbox-api.malga.io/v1/tokens', () => { return HttpResponse.json({ tokenId: 'sandbox-token-id' }) }), - http.post('https://api.malga.io/v1/tokens', async ({ request }) => { - const apiKey = request.headers.get('X-Api-Key') - const clientId = request.headers.get('X-Client-Id') + http.post( + 'https://api.malga.io/v1/tokens', + async ({ request }) => { + const apiKey = request.headers.get('X-Api-Key') + const clientId = request.headers.get('X-Client-Id') - if (!apiKey && !clientId) { - return new HttpResponse({ message: 'Forbidden' } as any, { status: 403 }) - } + const data = await request.json() - return HttpResponse.json({ tokenId: 'production-token-id' }) - }), + const cardHolderName = data.cardHolderName + const cardNumber = data.cardNumber + const cardExpirationDate = data.cardExpirationDate + const cardCvv = data.cardCvv + + if (!cardHolderName || !cardNumber || !cardExpirationDate || !cardCvv) { + return new HttpResponse({ message: 'invalid card number' } as any, { + status: 400, + }) + } + + if (!apiKey && !clientId) { + return new HttpResponse({ message: 'Forbidden' } as any, { + status: 403, + }) + } + + return HttpResponse.json({ tokenId: 'production-token-id' }) + }, + ), ]