Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

test: extract validation tests, improve test coverage #4093

Merged
merged 4 commits into from
Jun 27, 2022
Merged
Show file tree
Hide file tree
Changes from 2 commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
254 changes: 0 additions & 254 deletions packages/number-field/test/number-field.test.js
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