61 lines
2.4 KiB
JavaScript
61 lines
2.4 KiB
JavaScript
|
import EmberObject from '@ember/object';
|
||
|
|
import sinon from 'sinon';
|
||
|
|
import { module, test } from 'qunit';
|
||
|
|
import { setupRenderingTest } from 'ember-qunit';
|
||
|
|
import { render, click, fillIn } from '@ember/test-helpers';
|
||
|
|
import { hbs } from 'ember-cli-htmlbars';
|
||
|
|
|
||
|
|
module('Integration | Component | regex-validator', function(hooks) {
|
||
|
|
setupRenderingTest(hooks);
|
||
|
|
|
||
|
|
test('it renders input and validation messages', async function(assert) {
|
||
|
|
let attr = EmberObject.create({
|
||
|
|
name: 'example',
|
||
|
|
});
|
||
|
|
let spy = sinon.spy();
|
||
|
|
this.set('onChange', spy);
|
||
|
|
this.set('attr', attr);
|
||
|
|
this.set('value', '(\\d{4})');
|
||
|
|
this.set('labelString', 'Regex Example');
|
||
|
|
|
||
|
|
await render(
|
||
|
|
hbs`<RegexValidator
|
||
|
|
@onChange={{onChange}}
|
||
|
|
@attr={{attr}}
|
||
|
|
@value={{value}}
|
||
|
|
@labelString={{labelString}}
|
||
|
|
/>`
|
||
|
|
);
|
||
|
|
assert.dom('.regex-label label').hasText('Regex Example', 'Label is correct');
|
||
|
|
assert.dom('[data-test-toggle-input="example-validation-toggle"]').exists('Validation toggle exists');
|
||
|
|
assert.dom('[data-test-regex-validator-test-string]').doesNotExist('Test string input does not show');
|
||
|
|
|
||
|
|
await click('[data-test-toggle-input="example-validation-toggle"]');
|
||
|
|
assert.dom('[data-test-regex-validator-test-string]').exists('Test string input shows after toggle');
|
||
|
|
assert
|
||
|
|
.dom('[data-test-regex-validation-message]')
|
||
|
|
.doesNotExist('Validation message does not show if test string is empty');
|
||
|
|
|
||
|
|
await fillIn('[data-test-input="example-testval"]', '123a');
|
||
|
|
assert.dom('[data-test-regex-validation-message]').exists('Validation message shows after input filled');
|
||
|
|
assert
|
||
|
|
.dom('[data-test-inline-error-message]')
|
||
|
|
.hasText("Your regex doesn't match the subject string", 'Shows error when regex does not match string');
|
||
|
|
|
||
|
|
await fillIn('[data-test-input="example-testval"]', '1234');
|
||
|
|
assert
|
||
|
|
.dom('[data-test-inline-success-message]')
|
||
|
|
.hasText('Your regex matches the subject string', 'Shows success when regex matches');
|
||
|
|
|
||
|
|
await fillIn('[data-test-input="example-testval"]', '12345');
|
||
|
|
assert
|
||
|
|
.dom('[data-test-inline-error-message]')
|
||
|
|
.hasText(
|
||
|
|
"Your regex doesn't match the subject string",
|
||
|
|
"Shows error if regex doesn't match complete string"
|
||
|
|
);
|
||
|
|
await fillIn('[data-test-input="example"]', '(\\d{5})');
|
||
|
|
assert.ok(spy.calledOnce, 'Calls the passed onChange function when main input is changed');
|
||
|
|
});
|
||
|
|
});
|