I working on React credit card input component.
I need to test credit card numbers by brand type using jest-each.
Existing code works but need to replace it with jest-each
for dynamic data testing.
I think it needs to create an array and put inside my variables like visaNumber
, mastercardNumber
, amexNumber
, expectedResult
.
So how can i refactor in my case using jest-each
?
Code:
import { mount } from 'enzyme';
import each from 'jest-each';
import * as React from 'react';
import { getCardTypeByValue } from '../../utils/formatter';
import CardNumber from './CardNumber';
const props = {
placeholder: '',
title: '',
};
// Valid Credit card numbers
const visaNumber = '4242 4242 4242 4242';
const mastercardNumber = '5555 5555 5555 4444';
const amexNumber = '3782 822463 10005';
function setup(ownProps = props) {
return mount(<CardNumber {...ownProps} />);
}
describe('Card number component', () => {
const wrapper = setup();
it('Card number component should render properly', () => {
expect(wrapper.instance() instanceof React.Component).toBe(true);
});
});
describe('Get a card type by value', () => {
it('Should get type for VISA', () => {
const expectedResult = {
maxCardNumberLength: 19,
startPattern: /^4/,
type: 'visa',
};
expect(getCardTypeByValue(visaNumber)).toEqual(expectedResult);
});
it('Should get type for MASTERCARD', () => {
const expectedResult = {
maxCardNumberLength: 16,
startPattern: /^(5[1-5]|677189)|^(222[1-9]|2[3-6]\d{2}|27[0-1]\d|2720)/,
type: 'mastercard',
};
expect(getCardTypeByValue(mastercardNumber)).toEqual(expectedResult);
});
it('Should get type for AMERICAN EXPRESS', () => {
const expectedResult = {
format: /(\d{1,4})(\d{1,6})?(\d{1,5})?/,
maxCardNumberLength: 15,
startPattern: /^3[47]/,
type: 'amex',
};
expect(getCardTypeByValue(amexNumber)).toEqual(expectedResult);
});
});
Aucun commentaire:
Enregistrer un commentaire