` **class** The class of the button
215 |
--------------------------------------------------------------------------------
/tests/dummy/app/templates/docs/index.md:
--------------------------------------------------------------------------------
1 | # Introduction
2 |
3 | This [ember-cli](http://www.ember-cli.com) addon is based on the following
4 | excellent addons
5 |
6 | - [ember-changeset](https://github.com/DockYard/ember-changeset)
7 | - [ember-changeset-validations](https://github.com/DockYard/ember-changeset-validations/)
8 |
9 | and provides a handy out-of-the-box setup for user-friendly client-side
10 | validations, featuring
11 |
12 | - Hiding of validation errors until field has been interacted with (or submit button was pressed)
13 | - Preventing submit action until form is valid
14 | - Live-updating validation errors
15 | - Bootstrap integration
16 | - Loading class on submit button while async task is executed
17 | - Loading contextual template parameter set while async submit task is executed
18 |
19 | ## Why \*YAEFA?
20 |
21 | \*_Yet another ember form addon_
22 |
23 | There are many [existing ember
24 | addons](https://emberobserver.com/categories/forms) with this style of API,
25 | the most prominent probably being
26 | [ember-form-for](https://github.com/martndemus/ember-form-for). With this
27 | addon, we want to:
28 |
29 | - focus on forms that require client-side validations
30 | - provide good user experience out of the box
31 |
32 | For more information, see this [blog
33 | post](https://adfinis.com/en/blog/form-validation-with-ember-js/).
34 |
--------------------------------------------------------------------------------
/tests/dummy/app/templates/docs/migration-v6.md:
--------------------------------------------------------------------------------
1 | # Migration to v6
2 |
3 | ## Config
4 |
5 | `ember-validated-form` is heavily based on dynamic component invokation which
6 | needed alot of changes in order to make it work with embroider. For the
7 | consumers of the addon, the only thing that changes is the static configuration.
8 |
9 | Since we switched from runtime configuration to build time configuration, the
10 | current configuration of `ember-validated-form` needs to be moved from
11 | `config/environment.js` to the `ember-cli-build.js` file:
12 |
13 | **Before:**
14 |
15 | ```js
16 | // config/environment.js
17 | var ENV = {
18 | // ...
19 | "ember-validated-form": {
20 | theme: "bootstrap",
21 | features: {
22 | scrollErrorIntoView: true,
23 | },
24 | defaults: {
25 | error: "some-component",
26 | // ...
27 | },
28 | },
29 | // ...
30 | };
31 | ```
32 |
33 | **After:**
34 |
35 | ```js
36 | // ember-cli-build.js
37 | const app = new EmberAddon(defaults, {
38 | // ...
39 | "ember-validated-form": {
40 | theme: "bootstrap",
41 | features: {
42 | scrollErrorIntoView: true,
43 | },
44 | defaults: {
45 | error: "myapp/components/some-component",
46 | // ...
47 | },
48 | },
49 | // ...
50 | });
51 | ```
52 |
53 | As you can see above, the values in the section `defaults` changed as well.
54 | Previously the value was just the name of the component used as default, since
55 | v6 this needs to be an importable path (which allows static analysis).
56 |
57 | ## Removed deprecations
58 |
59 | The `includeBlank` argument for validated inputs has been removed in favor of
60 | `prompt`.
61 |
--------------------------------------------------------------------------------
/tests/dummy/app/templates/docs/quickstart.md:
--------------------------------------------------------------------------------
1 | # Quickstart
2 |
3 | You'll find a basic example in [this
4 | twiddle](https://ember-twiddle.com/95b040c96b7dc60dc4d0bb2dc5f5de26?openFiles=templates.application.hbs%2C)
--------------------------------------------------------------------------------
/tests/dummy/app/templates/docs/troubleshooting.md:
--------------------------------------------------------------------------------
1 | # Troubleshooting
2 |
3 | ## 'Proxy' is undefined (IE11)
4 |
5 | `ember-validated-form` installs `ember-changeset` and
6 | `ember-changeset-validations` **v3+** per default which relies heavily on
7 | `Proxy` which is not supported by IE11. If you need to support IE11 you'll
8 | need to [polyfill it](https://github.com/GoogleChrome/proxy-polyfill) or if
9 | you don't want to polyfill it, you can use `ember-changeset` and
10 | `ember-changeset-validations` **v2.x**.
11 |
--------------------------------------------------------------------------------
/tests/dummy/app/templates/docs/usage.md:
--------------------------------------------------------------------------------
1 | # Usage
2 |
3 | First, install the addon:
4 |
5 | ```bash
6 | $ ember install ember-validated-form
7 | ```
8 |
9 | This will also install `ember-changeset` and `ember-changeset-validations`.
10 | After, you'll need to set up
11 |
12 | - a template containing your form elements
13 | - a validations file (see [ember-changeset-validations](https://github.com/poteto/ember-changeset-validations))
14 | - a controller, route and/or component that provides your template with the validations and your model
15 |
--------------------------------------------------------------------------------
/tests/dummy/app/templates/index.hbs:
--------------------------------------------------------------------------------
1 | Built with ♥ by
11 | Adfinis
12 |
13 |
35 |
36 |
37 |
38 |
39 | {{! BEGIN-SNIPPET quickstart-template.hbs }}
40 | {{#if @model.saved}}
41 |
42 | Model was successfully saved!
43 |
44 | {{/if}}
45 |
46 |
51 |
109 | {{! END-SNIPPET }}
110 |
111 |
112 |
128 |
2 |
Not found
3 |
This page doesn't exist. Head home?
4 |
Dummy Tests
6 |
24 |
29 |
30 |
31 |
32 |
33 |
34 |
35 |
36 | {{content-for "body-footer"}}
37 | {{content-for "test-body-footer"}}
38 |
39 |
40 |
--------------------------------------------------------------------------------
/tests/integration/components/validated-button-test.js:
--------------------------------------------------------------------------------
1 | import { render } from "@ember/test-helpers";
2 | import { setupRenderingTest } from "ember-qunit";
3 | import hbs from "htmlbars-inline-precompile";
4 | import { module } from "qunit";
5 |
6 | import { testDefault } from "dummy/tests/helpers/scenarios";
7 |
8 | module("Integration | Component | validated button", function (hooks) {
9 | setupRenderingTest(hooks);
10 |
11 | hooks.beforeEach(function () {
12 | this.noop = () => {};
13 | });
14 |
15 | testDefault("it renders a button with a label", async function (assert) {
16 | await render(hbs`Test `,
23 | );
24 | assert.dom("button").hasText("Test");
25 | });
26 | });
27 |
--------------------------------------------------------------------------------
/tests/integration/components/validated-button/button-test.js:
--------------------------------------------------------------------------------
1 | import { render } from "@ember/test-helpers";
2 | import { setupRenderingTest } from "ember-qunit";
3 | import hbs from "htmlbars-inline-precompile";
4 | import { module } from "qunit";
5 |
6 | import {
7 | testDefault,
8 | testUikit,
9 | testBootstrap,
10 | } from "dummy/tests/helpers/scenarios";
11 |
12 | module("Integration | Component | validated-button/button", function (hooks) {
13 | setupRenderingTest(hooks);
14 |
15 | hooks.beforeEach(function () {
16 | this.noop = () => {};
17 | });
18 |
19 | testDefault("it renders", async function (assert) {
20 | await render(hbs`
25 | Test
26 | `);
27 |
28 | assert.dom("button").hasText("Test");
29 | });
30 |
31 | testUikit("it renders", async function (assert) {
32 | await render(
33 | hbs`
43 | Test
44 | `);
45 |
46 | assert.dom("button").hasText("Test");
47 | });
48 |
49 | testUikit(
50 | "it renders a primary button for submit buttons",
51 | async function (assert) {
52 | await render(
53 | hbs`
72 | Test
73 | `);
74 |
75 | assert.dom("button").hasText("Test");
76 | });
77 |
78 | testBootstrap(
79 | "it renders a primary button for submit buttons",
80 | async function (assert) {
81 | await render(
82 | hbs`
17 | `);
26 |
27 | assert.dom("custom-render").exists();
28 | assert.dom("custom-label").exists();
29 | assert.dom("custom-hint").exists();
30 | assert.dom("custom-error").exists();
31 | });
32 |
33 | testCustomComponents(
34 | "renders custom button components",
35 | async function (assert) {
36 | assert.expect(1);
37 |
38 | await render(hbs`
39 | `);
41 |
42 | assert.dom("custom-button").exists();
43 | },
44 | );
45 |
46 | testCustomComponents(
47 | "renders custom type components",
48 | async function (assert) {
49 | assert.expect(7);
50 |
51 | await render(hbs`
52 | `);
60 |
61 | assert.dom("custom-checkbox").exists();
62 | assert.dom("custom-checkbox-group").exists();
63 | assert.dom("custom-input").exists();
64 | assert.dom("custom-radio-group").exists();
65 | assert.dom("custom-select").exists();
66 | assert.dom("custom-textarea").exists();
67 | assert.dom("custom-date").exists();
68 | },
69 | );
70 | });
71 |
--------------------------------------------------------------------------------
/tests/integration/components/validated-form-test.js:
--------------------------------------------------------------------------------
1 | import EmberObject from "@ember/object";
2 | import { run } from "@ember/runloop";
3 | import { render, click, blur, fillIn, focus } from "@ember/test-helpers";
4 | import { validateLength } from "ember-changeset-validations/validators";
5 | import { setupRenderingTest } from "ember-qunit";
6 | import hbs from "htmlbars-inline-precompile";
7 | import { module } from "qunit";
8 | import { defer } from "rsvp";
9 |
10 | import { testDefault, testBootstrap } from "dummy/tests/helpers/scenarios";
11 | import UserValidations from "dummy/validations/user";
12 |
13 | module("Integration | Component | validated form", function (hooks) {
14 | setupRenderingTest(hooks);
15 |
16 | testDefault("it renders simple inputs", async function (assert) {
17 | await render(hbs`
18 | `);
20 |
21 | assert.dom("form label").hasText("First name");
22 | assert.dom("form input").hasAttribute("type", "text");
23 | });
24 |
25 | testDefault("it renders textareas", async function (assert) {
26 | await render(hbs`
27 | `);
29 |
30 | assert.dom("form label").hasText("my label");
31 | assert.dom("form textarea").exists({ count: 1 });
32 | });
33 |
34 | testBootstrap("it renders a radio group", async function (assert) {
35 | this.set("buttonGroupData", {
36 | options: [
37 | { key: "1", label: "Option 1" },
38 | { key: "2", label: "Option 2" },
39 | { key: "3", label: "Option 3" },
40 | ],
41 | });
42 |
43 | await render(hbs`
44 | `);
51 |
52 | assert.dom('input[type="radio"]').exists({ count: 3 });
53 | assert.dom("label:nth-of-type(1)").hasText("Options");
54 | assert.dom("div:nth-of-type(1) > input + label").hasText("Option 1");
55 | assert.dom("div:nth-of-type(2) > input + label").hasText("Option 2");
56 | assert.dom("div:nth-of-type(3) > input + label").hasText("Option 3");
57 | assert.dom("div > input + label").exists({ count: 3 });
58 | assert.dom('input[type="radio"][value="1"]').exists();
59 | assert.dom('input[type="radio"][value="2"]').exists();
60 | assert.dom('input[type="radio"][value="3"]').exists();
61 | });
62 |
63 | testDefault("it renders submit buttons", async function (assert) {
64 | this.set("stub", function () {});
65 |
66 | await render(hbs`
67 | `);
70 |
71 | assert.dom("form button").hasAttribute("type", "submit");
72 | assert.dom("form button").hasText("Save!");
73 | });
74 |
75 | testDefault("it renders an always-showing hint", async function (assert) {
76 | await render(hbs`
77 | `);
79 |
80 | assert.dom("input + div").doesNotExist();
81 | assert.dom("input + small").exists({ count: 1 });
82 | assert.dom("input + small").hasText("Not your middle name!");
83 |
84 | const hintId = this.element.querySelector("input + small").id;
85 |
86 | assert.dom("input").hasAria("describedby", hintId);
87 | });
88 |
89 | testDefault(
90 | "does not render a tag for buttons if no callbacks were passed",
91 | async function (assert) {
92 | await render(hbs`
93 | `);
95 |
96 | assert.dom("form > p").doesNotExist();
97 | },
98 | );
99 |
100 | testDefault("it supports default button labels", async function (assert) {
101 | this.set("stub", function () {});
102 |
103 | await render(hbs`
104 | `);
106 |
107 | assert.dom("form button[type=submit]").hasText("Save");
108 | });
109 |
110 | testBootstrap(
111 | "it performs basic validations on submit",
112 | async function (assert) {
113 | this.set("submit", function () {});
114 | this.set("UserValidations", UserValidations);
115 |
116 | run(() => {
117 | this.set(
118 | "model",
119 | EmberObject.create({
120 | firstName: "x",
121 | }),
122 | );
123 | });
124 |
125 | await render(hbs`
130 | `);
133 |
134 | assert.dom("span.invalid-feedback").doesNotExist();
135 | assert.dom("input").doesNotHaveAria("invalid");
136 |
137 | await click("button");
138 |
139 | assert.dom("input").hasValue("x");
140 | assert.dom("span.invalid-feedback").exists({ count: 1 });
141 | assert
142 | .dom("span.invalid-feedback")
143 | .hasText("First name must be between 3 and 40 characters");
144 |
145 | const errorId = this.element.querySelector("span.invalid-feedback").id;
146 |
147 | assert.dom("input").hasAria("invalid", "true");
148 | assert.dom("input").hasAria("describedby", errorId);
149 | },
150 | );
151 |
152 | testBootstrap(
153 | "it shows error message for custom buttons if (and only if) triggerValidations is passed",
154 | async function (assert) {
155 | this.set("UserValidations", UserValidations);
156 |
157 | run(() => {
158 | this.set(
159 | "model",
160 | EmberObject.create({
161 | firstName: "x",
162 | }),
163 | );
164 | });
165 |
166 | this.set("triggerValidations", false);
167 |
168 | await render(hbs`
169 | `);
172 |
173 | assert.dom("span.invalid-feedback").doesNotExist();
174 | await click("button");
175 | assert.dom("span.invalid-feedback").doesNotExist();
176 |
177 | this.set("triggerValidations", true);
178 | await click("button");
179 |
180 | assert.dom("input").hasValue("x");
181 | assert.dom("span.invalid-feedback").exists({ count: 1 });
182 | assert
183 | .dom("span.invalid-feedback")
184 | .hasText("First name must be between 3 and 40 characters");
185 | },
186 | );
187 |
188 | testDefault(
189 | "it calls on-invalid-submit after submit if changeset is invalid",
190 | async function (assert) {
191 | let invalidSubmitCalled;
192 | this.set("invalidSubmit", function () {
193 | invalidSubmitCalled = true;
194 | });
195 | this.set("UserValidations", UserValidations);
196 |
197 | run(() => {
198 | this.set(
199 | "model",
200 | EmberObject.create({
201 | firstName: "x",
202 | }),
203 | );
204 | });
205 |
206 | await render(hbs`
211 | `);
214 |
215 | await click("button");
216 |
217 | assert.true(invalidSubmitCalled);
218 | },
219 | );
220 |
221 | testDefault(
222 | "it does not call on-invalid-submit after submit if changeset is valid",
223 | async function (assert) {
224 | let invalidSubmitCalled;
225 | let submitCalled;
226 | this.set("submit", function () {
227 | submitCalled = true;
228 | });
229 | this.set("invalidSubmit", function () {
230 | invalidSubmitCalled = true;
231 | });
232 |
233 | run(() => {
234 | this.set("model", EmberObject.create({}));
235 | });
236 |
237 | await render(hbs`
243 | `);
246 |
247 | await click("button");
248 |
249 | assert.notOk(invalidSubmitCalled);
250 | assert.true(submitCalled);
251 | },
252 | );
253 |
254 | testDefault(
255 | "it performs validation and calls onInvalidClick function on custom buttons",
256 | async function (assert) {
257 | assert.expect(5);
258 |
259 | this.set("onClick", function () {
260 | assert.step("onClick");
261 | });
262 | this.set("onInvalidClick", function (model) {
263 | assert.step("onInvalidClick");
264 | assert.strictEqual(model.firstName, "x");
265 | });
266 | this.set("SimpleValidations", {
267 | firstName: [validateLength({ min: 3, max: 40 })],
268 | });
269 |
270 | run(() => {
271 | this.set(
272 | "model",
273 | EmberObject.create({
274 | firstName: "x",
275 | }),
276 | );
277 | });
278 |
279 | await render(hbs`
280 | `);
286 |
287 | await click("button");
288 | assert.verifySteps(["onInvalidClick"]);
289 | await fillIn("input[name=firstName]", "Some name");
290 | await click("button");
291 | assert.verifySteps(["onClick"]);
292 | },
293 | );
294 |
295 | testBootstrap(
296 | "it performs basic validations on focus out",
297 | async function (assert) {
298 | this.set("submit", function () {});
299 | this.set("UserValidations", UserValidations);
300 |
301 | run(() => {
302 | this.set("model", EmberObject.create({}));
303 | });
304 |
305 | await render(hbs`
310 | `);
313 |
314 | assert.dom("input + div").doesNotExist();
315 |
316 | await focus("input");
317 | await blur("input");
318 |
319 | assert.dom("span.invalid-feedback").exists({ count: 1 });
320 | assert.dom("span.invalid-feedback").hasText("First name can't be blank");
321 | },
322 | );
323 |
324 | testBootstrap(
325 | "it skips basic validations on focus out with validateBeforeSubmit=false set on the form",
326 | async function (assert) {
327 | this.set("submit", function () {});
328 | this.set("UserValidations", UserValidations);
329 |
330 | run(() => {
331 | this.set("model", EmberObject.create({}));
332 | });
333 |
334 | await render(hbs`
340 | `);
343 |
344 | assert.dom("span.invalid-feedback").doesNotExist();
345 |
346 | await focus("input");
347 | await blur("input");
348 |
349 | assert.dom("span.invalid-feedback").doesNotExist();
350 |
351 | await click("button");
352 |
353 | assert.dom("span.invalid-feedback").exists({ count: 1 });
354 | },
355 | );
356 |
357 | testDefault(
358 | "it skips basic validations on focus out with validateBeforeSubmit=false set on the input",
359 | async function (assert) {
360 | this.set("submit", function () {});
361 | this.set("UserValidations", UserValidations);
362 |
363 | run(() => {
364 | this.set("model", EmberObject.create({}));
365 | });
366 |
367 | await render(hbs`
372 | `);
378 |
379 | assert.dom("input + div").doesNotExist();
380 |
381 | await focus("input");
382 | await blur("input");
383 |
384 | assert.dom("input + div").doesNotExist();
385 | },
386 | );
387 |
388 | testDefault(
389 | "on-submit can be an action returning a promise",
390 | async function (assert) {
391 | const deferred = defer();
392 |
393 | this.set("submit", () => deferred.promise);
394 |
395 | run(() => {
396 | this.set("model", EmberObject.create({}));
397 | });
398 |
399 | await render(hbs`
404 | `);
406 |
407 | assert.dom("button").doesNotHaveClass("loading");
408 |
409 | await click("button");
410 |
411 | assert.dom("button").hasClass("loading");
412 |
413 | run(() => deferred.resolve());
414 |
415 | assert.dom("button").doesNotHaveClass("loading");
416 | },
417 | );
418 |
419 | testDefault(
420 | "on-submit can be an action returning a non-promise",
421 | async function (assert) {
422 | this.set("submit", () => undefined);
423 |
424 | run(() => {
425 | this.set("model", EmberObject.create({}));
426 | });
427 |
428 | await render(hbs`
433 | `);
435 |
436 | assert.dom("button").doesNotHaveClass("loading");
437 |
438 | await click("button");
439 |
440 | assert.dom("button").doesNotHaveClass("loading");
441 | },
442 | );
443 |
444 | testDefault("it yields the loading state", async function (assert) {
445 | const deferred = defer();
446 |
447 | this.set("submit", () => deferred.promise);
448 |
449 | run(() => {
450 | this.set("model", EmberObject.create({}));
451 | });
452 |
453 | await render(hbs`
458 | {{#if f.loading}}
459 | loading...
460 | {{/if}}
461 | `);
463 | assert.dom("span.loading").doesNotExist();
464 |
465 | await click("button");
466 |
467 | assert.dom("span.loading").exists();
468 |
469 | run(() => deferred.resolve());
470 |
471 | assert.dom("span.loading").doesNotExist();
472 | });
473 |
474 | testDefault(
475 | "it handles being removed from the DOM during sync submit",
476 | async function (assert) {
477 | this.set("show", true);
478 |
479 | this.set("submit", () => {
480 | this.set("show", false);
481 | });
482 |
483 | run(() => {
484 | this.set("model", EmberObject.create({}));
485 | });
486 |
487 | await render(hbs`{{#if this.show}}
488 |
493 | {{#if f.loading}}
494 | loading...
495 | {{/if}}
496 |
498 | {{/if}}`);
499 |
500 | await click("button");
501 | assert.ok(true);
502 | },
503 | );
504 |
505 | testDefault(
506 | "it handles being removed from the DOM during async submit",
507 | async function (assert) {
508 | this.set("show", true);
509 | const deferred = defer();
510 |
511 | this.set("submit", () => {
512 | return deferred.promise.then(() => {
513 | this.set("show", false);
514 | });
515 | });
516 |
517 | run(() => {
518 | this.set("model", EmberObject.create({}));
519 | });
520 |
521 | await render(hbs`{{#if this.show}}
522 |
527 | {{#if f.loading}}
528 | loading...
529 | {{/if}}
530 |
532 | {{/if}}`);
533 |
534 | await click("button");
535 | run(() => deferred.resolve());
536 | assert.ok(true);
537 | },
538 | );
539 |
540 | testDefault("it binds the autocomplete attribute", async function (assert) {
541 | await render(hbs`
159 |
160 | `,
161 | );
162 |
163 | assert.dom("#custom-input").exists();
164 | });
165 |
166 | testDefault(
167 | "it yields the value provided to the block",
168 | async function (assert) {
169 | await render(
170 | hbs`
171 | `,
173 | );
174 |
175 | assert.dom("input").hasValue("my-value");
176 | },
177 | );
178 |
179 | testDefault(
180 | "it yields the name from the model as value",
181 | async function (assert) {
182 | this.set("model", new Changeset({ firstName: "Max" }));
183 |
184 | await render(
185 | hbs`
186 | `,
188 | );
189 |
190 | assert.dom("input").hasValue("Max");
191 | },
192 | );
193 |
194 | testDefault(
195 | "it yields the value as value if both model and value is provided",
196 | async function (assert) {
197 | this.set("model", new Changeset({ firstName: "Max" }));
198 |
199 | await render(
200 | hbs`
206 | `,
208 | );
209 |
210 | assert.dom("input").hasValue("Other Value");
211 | },
212 | );
213 |
214 | testDefault("it yields the provided name", async function (assert) {
215 | await render(
216 | hbs`
217 | `,
219 | );
220 |
221 | assert.dom("input").hasAttribute("name", "foobar");
222 | });
223 |
224 | testDefault("it yields the model", async function (assert) {
225 | this.set("model", new Changeset({ firstName: "Max" }));
226 |
227 | await render(
228 | hbs`
229 | `,
231 | );
232 |
233 | assert.dom("input").hasValue("Max");
234 | });
235 |
236 | testDefault(
237 | "it yields an action for updating the model",
238 | async function (assert) {
239 | const model = new Changeset({ firstName: "Max" });
240 | this.set("model", model);
241 |
242 | await render(
243 | hbs`
244 | `,
246 | );
247 |
248 | await click("button");
249 |
250 | assert.strictEqual(model.get("firstName"), "Merlin");
251 | },
252 | );
253 |
254 | testBootstrap(
255 | "it yields an action marking the input as dirty",
256 | async function (assert) {
257 | this.set("model", { error: { test: { validation: ["Error"] } } });
258 |
259 | await render(
260 | hbs`
261 | `,
263 | );
264 |
265 | assert.dom("span.invalid-feedback").doesNotExist();
266 |
267 | await click("button");
268 |
269 | assert.dom("span.invalid-feedback").exists();
270 | },
271 | );
272 |
273 | testDefault("it yields the input id to the block", async function (assert) {
274 | await render(
275 | hbs`
276 | `,
278 | );
279 |
280 | const label = this.element.querySelector("label");
281 | const input = this.element.querySelector("input");
282 | assert.strictEqual(label.getAttribute("for"), input.getAttribute("id"));
283 | });
284 |
285 | testDefault(
286 | "it can change the value from outside the input",
287 | async function (assert) {
288 | this.set("model", new Changeset({ firstName: "Max" }));
289 |
290 | await render(
291 | hbs`{{this.model.nested.name}}
322 |
323 | {{Input.value}}
324 | `,
325 | );
326 |
327 | assert.dom("#raw").hasText("Max");
328 | assert.dom("#_val").hasText("Max");
329 |
330 | this.model.set("nested.name", "Tom");
331 | await settled();
332 |
333 | assert.dom("#raw").hasText("Tom");
334 | assert.dom("#_val").hasText("Tom");
335 | });
336 | });
337 |
--------------------------------------------------------------------------------
/tests/integration/components/validated-input/error-test.js:
--------------------------------------------------------------------------------
1 | import { render } from "@ember/test-helpers";
2 | import { setupRenderingTest } from "ember-qunit";
3 | import hbs from "htmlbars-inline-precompile";
4 | import { module } from "qunit";
5 |
6 | import {
7 | testDefault,
8 | testUikit,
9 | testBootstrap,
10 | } from "dummy/tests/helpers/scenarios";
11 |
12 | module("Integration | Component | validated-input/error", function (hooks) {
13 | setupRenderingTest(hooks);
14 |
15 | testDefault("it renders", async function (assert) {
16 | this.set("errors", ["foo", "bar", "baz"]);
17 |
18 | await render(hbs`Test `,
20 | );
21 |
22 | assert.dom(this.element).hasText("Test");
23 | });
24 |
25 | testBootstrap("it renders", async function (assert) {
26 | await render(
27 | hbs`Test `,
28 | );
29 |
30 | assert.dom(this.element).hasText("Test");
31 | });
32 |
33 | testUikit("it renders", async function (assert) {
34 | await render(
35 | hbs`Test `,
36 | );
37 |
38 | assert.dom("div.uk-form-controls").hasText("Test");
39 | });
40 | },
41 | );
42 |
--------------------------------------------------------------------------------
/tests/integration/components/validated-input/types/checkbox-group-test.js:
--------------------------------------------------------------------------------
1 | import { click, render } from "@ember/test-helpers";
2 | import { setupRenderingTest } from "ember-qunit";
3 | import hbs from "htmlbars-inline-precompile";
4 | import { module } from "qunit";
5 |
6 | import {
7 | testDefault,
8 | testUikit,
9 | testBootstrap,
10 | } from "dummy/tests/helpers/scenarios";
11 |
12 | module(
13 | "Integration | Component | validated-input/types/checkbox-group",
14 | function (hooks) {
15 | setupRenderingTest(hooks);
16 |
17 | testDefault("it renders", async function (assert) {
18 | this.set("options", [
19 | { key: 1, label: 1 },
20 | { key: 2, label: 2 },
21 | ]);
22 |
23 | await render(hbs`
44 | {{@label}}
45 | {{@inputId}}
46 | {{@required}}
47 | `,
48 | CustomLabel,
49 | );
50 | this.CustomLabel = CustomLabel;
51 |
52 | await render(hbs`{{@customVariable}} `,
74 | CustomLabel,
75 | );
76 | this.CustomLabel = CustomLabel;
77 |
78 | await render(hbs`