Skip to content

Commit

Permalink
test: extract validation tests
Browse files Browse the repository at this point in the history
  • Loading branch information
@vursen
vursen committed Jun 25, 2022
1 parent a811bb9 commit 561f905
Show file tree
Hide file tree
Showing 2 changed files with 269 additions and 254 deletions.
254 changes: 0 additions & 254 deletions packages/number-field/test/number-field.test.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -655,260 +655,6 @@ describe('number-field', () => {
});
});
});

describe('input validation', () => {
it('should be valid with numeric values', () => {
expect(numberField.validate()).to.be.true;

numberField.value = '1';
expect(input.value).to.be.equal('1');
expect(numberField.validate()).to.be.true;
});

it('should prevent setting non-numeric values', () => {
numberField.value = 'foo';
expect(numberField.value).to.be.empty;
expect(numberField.validate()).to.be.true;
});

it('should align checkValidity with the native input element', () => {
numberField.value = -1;
numberField.min = 0;

expect(numberField.checkValidity()).to.equal(input.checkValidity());
});

it('should not validate when explicitly set to invalid', () => {
numberField.invalid = true;

expect(numberField.value).to.be.empty;
expect(numberField.validate()).to.be.false;

expect(numberField.invalid).to.be.true;
});

it('should allow setting decimals', () => {
numberField.value = 7.6;
expect(numberField.value).to.be.equal('7.6');
});

it('should not prevent invalid values applied programmatically (step)', () => {
numberField.step = 0.1;
numberField.value = 7.686;
expect(numberField.value).to.be.equal('7.686');
});

it('should not prevent invalid values applied programmatically (min)', () => {
numberField.min = 2;
numberField.value = 1;
expect(numberField.value).to.be.equal('1');
});

it('should not prevent invalid values applied programmatically (max)', () => {
numberField.max = 2;
numberField.value = 3;
expect(numberField.value).to.be.equal('3');
});

it('should validate when setting limits', () => {
numberField.min = 2;
numberField.max = 4;

numberField.value = '';
expect(numberField.validate(), 'empty value is allowed because not required').to.be.true;

numberField.value = '3';
expect(numberField.validate(), 'valid value should be in the range').to.be.true;

numberField.value = '1';
expect(numberField.validate(), 'value should not be below min').to.be.false;

numberField.value = '3';
expect(numberField.validate(), 'invalid status should be reset when setting valid value').to.be.true;

numberField.value = '5';
expect(numberField.validate(), 'value should not be greater than max').to.be.false;
});

it('should dispatch change event after validation', () => {
const validateSpy = sinon.spy(numberField, 'validate');
const changeSpy = sinon.spy();
numberField.required = true;
numberField.addEventListener('change', changeSpy);
numberField.value = '123';
input.dispatchEvent(new CustomEvent('change'));
expect(validateSpy.calledOnce).to.be.true;
expect(changeSpy.calledAfter(validateSpy)).to.be.true;
});

describe('step values', () => {
beforeEach(() => {
numberField.step = 1.5;
});

[-6, -1.5, 0, 1.5, 4.5].forEach((validValue) => {
it(`should validate valid value "${validValue}" by step when defined by user`, () => {
numberField.value = validValue;
expect(numberField.validate()).to.be.true;
});
});

[-3.5, -1, 2, 2.5].forEach((invalidValue) => {
it(`should validate invalid value "${invalidValue}" by step when defined by user`, () => {
numberField.value = invalidValue;
expect(numberField.validate()).to.be.false;
});
});
});

describe('step basis', () => {
beforeEach(() => {
numberField.min = 1;
numberField.step = 1.5;
});

[1, 2.5, 4, 5.5].forEach((validValue) => {
it(`should validate valid value "${validValue}" using min as basis`, () => {
numberField.value = validValue;
expect(numberField.validate()).to.be.true;
});
});

[1.5, 3, 5].forEach((invalidValue) => {
it(`should validate invalid value "${invalidValue}" using min as basis`, () => {
numberField.value = invalidValue;
expect(numberField.validate()).to.be.false;
});
});
});

it('should not validate by step when only min and max are set', () => {
numberField.min = 1;
numberField.max = 5;
numberField.value = 1.5; // Would be invalid by default step=1
expect(numberField.validate()).to.be.true;
});

describe('removing validation constraints', () => {
it('should update "invalid" state when "min" is removed', () => {
numberField.value = '42';
numberField.min = 50;
numberField.validate();
expect(numberField.invalid).to.be.true;

numberField.min = '';
expect(numberField.invalid).to.be.false;
});

it('should update "invalid" state when "max" is removed', () => {
numberField.value = '42';
numberField.max = 20;
numberField.validate();
expect(numberField.invalid).to.be.true;

numberField.max = '';
expect(numberField.invalid).to.be.false;
});

it('should update "invalid" state when "step" is removed', () => {
numberField.value = '3';
numberField.min = 0;
numberField.step = 2;
numberField.validate();
expect(numberField.invalid).to.be.true;

numberField.step = '';
expect(numberField.invalid).to.be.false;
});

it('should not set "invalid" to false when "min" is set to 0', () => {
numberField.value = '-5';
numberField.min = -1;
numberField.validate();
expect(numberField.invalid).to.be.true;

numberField.min = 0;
expect(numberField.invalid).to.be.true;
});

it('should not set "invalid" to false when "max" is set to 0', () => {
numberField.value = '5';
numberField.max = 1;
numberField.validate();
expect(numberField.invalid).to.be.true;

numberField.max = 0;
expect(numberField.invalid).to.be.true;
});
});
});
});

describe('step attribute', () => {
let numberField;

beforeEach(() => {
numberField = fixtureSync('<vaadin-number-field step="1.5"></vaadin-number-field>');
});

it('should validate by step when defined as attribute', () => {
numberField.value = 1;
expect(numberField.validate()).to.be.false;
numberField.value = 1.5;
expect(numberField.validate()).to.be.true;
});
});

describe('default step attribute', () => {
let numberField;

beforeEach(() => {
numberField = fixtureSync('<vaadin-number-field step="1"></vaadin-number-field>');
});

it('should validate by step when default value defined as attribute', () => {
numberField.value = 1.5;
expect(numberField.validate()).to.be.false;
numberField.value = 1;
expect(numberField.validate()).to.be.true;
});
});

describe('checkValidity', () => {
it('should return true when called before connected to the DOM', () => {
const numberField = document.createElement('vaadin-number-field');
expect(numberField.checkValidity()).to.be.true;
});

it('should return false when called before connected to the DOM and invalid', () => {
const numberField = document.createElement('vaadin-number-field');
numberField.invalid = true;
expect(numberField.checkValidity()).to.be.false;
});
});

describe('invalid', () => {
let numberField;

beforeEach(() => {
numberField = fixtureSync('<vaadin-number-field invalid></vaadin-number-field>');
});

it('should not remove "invalid" state when ready', () => {
expect(numberField.invalid).to.be.true;
});
});

describe('invalid with value', () => {
let numberField;

beforeEach(() => {
numberField = fixtureSync('<vaadin-number-field invalid value="123456"></vaadin-number-field>');
});

it('should not remove "invalid" state when ready', () => {
expect(numberField.invalid).to.be.true;
});
});

describe('required', () => {
Expand Down
Loading

0 comments on commit 561f905

Please sign in to comment.