Skip to content

Commit

Permalink
refactor: more adjustments in the tests
Browse files Browse the repository at this point in the history
  • Loading branch information
milenacrios committed Mar 8, 2024
1 parent 8faf680 commit defdb68
Show file tree
Hide file tree
Showing 6 changed files with 83 additions and 169 deletions.
12 changes: 2 additions & 10 deletions src/async-tokenize/async-tokenize.test.ts
Original file line number Diff line number Diff line change
Expand Up @@ -39,11 +39,6 @@ describe('async-tokenize', () => {
const form = document.querySelector('form')
fireEvent.submit(form!)

const cvvInput = document.querySelector(
'input[data-malga-tokenization-cvv]',
)
expect(form).toContain(cvvInput)

await waitFor(() => {
const tokenIdInput = document.querySelector<HTMLInputElement>(
'input[name="tokenId"]',
Expand All @@ -53,7 +48,7 @@ describe('async-tokenize', () => {
expect(tokenIdInput).toBeTruthy()
})
})
test('should be possible to return a value in tokenIdElement and if the settings include the sandbox: true option, the value must be sandox-token-id ', async () => {
test('should be return correct tokenId in sandbox environment ', async () => {
configureFormSubmissionMock()

generateForm(onSubmit)
Expand All @@ -74,7 +69,7 @@ describe('async-tokenize', () => {
expect(tokenIdInput?.value).toBe('sandbox-token-id')
})
})
test('should be possible to return a value in tokenIdElement and if the settings not include the sandbox: true option, the value must be production-token-id', async () => {
test('should be return correct tokenId in production environment', async () => {
configureFormSubmissionMock()

generateForm(onSubmit)
Expand Down Expand Up @@ -174,9 +169,6 @@ describe('async-tokenize', () => {
expect(asyncTokenizeObject.handle).toThrowError(
"Cannot read properties of undefined (reading 'elements')",
)

const form = document.querySelector('form')
fireEvent.submit(form!)
})
test('should be possible to throw an error when the elements passed are incompatible with those in the DOM', async () => {
configureFormSubmissionMock()
Expand Down
55 changes: 0 additions & 55 deletions src/common/utils/form-elements/form-elements.test.ts
Original file line number Diff line number Diff line change
@@ -1,7 +1,3 @@
import {
formElementsMock,
handleFormMock,
} from 'tests/mocks/common-configurations'
import {
createFormElement,
getFormElements,
Expand All @@ -12,42 +8,6 @@ import { generateForm } from 'tests/mocks/form-dom'
const tokenId = '54595fec-87db-44f8-996a-2f4d6bf270b9'
describe('form-elements', () => {
describe('getFormElements', () => {
test('should be returned the elements correctly', () => {
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 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).toBe(form)
expect(formElements.holderName).toBe(holderNameInput)
expect(formElements.number).toBe(numberInput)
expect(formElements.expirationDate).toBe(expirationDateInput)
expect(formElements.cvv).toBe(cvvInput)
})

test('should be possible to find the elements in the dom', () => {
generateForm()

Expand Down Expand Up @@ -82,21 +42,6 @@ describe('form-elements', () => {
expect(formElements.expirationDate).toBeNull()
expect(formElements.cvv).toBeNull()
})

test('should be possible to return null if there is no equal element in the DOM', () => {
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(() => {
Expand Down
133 changes: 55 additions & 78 deletions src/common/utils/form-values/form-values.test.ts
Original file line number Diff line number Diff line change
@@ -1,85 +1,62 @@
import {
formElementsMock,
formValuesMock,
handleFormMock,
} from 'tests/mocks/common-configurations'
import { formValuesMock } from 'tests/mocks/common-configurations'
import { getFormValues } from './form-values'
import { generateForm, generateFormEmptyValues } from 'tests/mocks/form-dom'

function Form() {
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)
}
describe('getFormValues', () => {
beforeEach(() => {
document.body.innerHTML = ''
})
test('should be the values of elements equals to sended', () => {
Form()

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

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',
describe('form-values', () => {
beforeEach(() => {
document.body.innerHTML = ''
})

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 empty when elements aren't finded", () => {
Form()

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',
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()
})

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', () => {
Form()

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()
})
})
28 changes: 3 additions & 25 deletions src/tokenization.test.ts
Original file line number Diff line number Diff line change
Expand Up @@ -7,6 +7,7 @@ import {
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<typeof import('./common/malga')>()
Expand Down Expand Up @@ -79,7 +80,7 @@ describe('MalgaTokenization', () => {
test('should be possible to return the tokenId element', async () => {
configureFormSubmissionMock()

FormForInit(onSubmit)
generateForm(onSubmit)

const malgaTokenizationObject = new MalgaTokenization(
malgaConfigurations(false),
Expand All @@ -102,30 +103,7 @@ describe('MalgaTokenization', () => {
test('should be possible to return an error if form elements do not have values assigned', async () => {
configureFormSubmissionMock()

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)
generateFormEmptyValues(onSubmit)

const malgaTokenizationObject = new MalgaTokenization(
malgaConfigurations(false),
Expand Down
2 changes: 1 addition & 1 deletion tests/mocks/common-configurations.ts
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import { MalgaFormElements } from '../../src/common/interfaces/form'
import { MalgaFormElements } from 'src/common/interfaces/form'

export function malgaConfigurations(isSandbox: boolean) {
return {
Expand Down
22 changes: 22 additions & 0 deletions tests/mocks/form-dom.ts
Original file line number Diff line number Diff line change
Expand Up @@ -31,3 +31,25 @@ export function generateForm(onSubmit?: any) {
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)
}

0 comments on commit defdb68

Please sign in to comment.