Skip to content

Commit 655ed92

Browse files
committed
fix tests
1 parent 55f6a42 commit 655ed92

File tree

3 files changed

+73
-50
lines changed

3 files changed

+73
-50
lines changed

.github/workflows/ci.yml

+2-2
Original file line numberDiff line numberDiff line change
@@ -16,7 +16,7 @@ env:
1616
jobs:
1717
test:
1818
name: Lint & Test
19-
runs-on: ubuntu-20.04
19+
runs-on: ubuntu-24.04
2020
if: (!contains(github.ref, 'refs/heads/master') || contains(github.ref, 'refs/tags/v'))
2121
timeout-minutes: 10
2222
steps:
@@ -39,7 +39,7 @@ jobs:
3939
run: pnpm test:ember
4040
release:
4141
name: Release Package
42-
runs-on: ubuntu-20.04
42+
runs-on: ubuntu-24.04
4343
needs: test
4444
if: contains(github.ref, 'refs/tags/v')
4545
timeout-minutes: 10

addon/components/utils/utm-link-builder.hbs

+51-45
Original file line numberDiff line numberDiff line change
@@ -8,56 +8,62 @@
88
>
99
<:contents>
1010
<div class="activated-utms fx-col fx-1 fx-gap-px-12">
11-
<div class="fx-row">
12-
<span class="font-color-gray-500 font-size-md">
13-
{{t "utms.fields.source"}}
14-
</span>
15-
<span class="font-color-error-500">
16-
*
17-
</span>
11+
<div class="fx-col fx-gap-px-6">
12+
<div class="fx-row">
13+
<span class="font-color-gray-500 font-size-md">
14+
{{t "utms.fields.source"}}
15+
</span>
16+
<span class="font-color-error-500">
17+
*
18+
</span>
19+
</div>
20+
<OSS::InputContainer
21+
@value={{this.utmSource}}
22+
@placeholder={{t "utms.fields.source_placeholder"}}
23+
@feedbackMessage={{this.validationErrors.utmSource}}
24+
data-control-name="utm_source_input"
25+
{{on "focusout" (fn this.validateField "utmSource")}}
26+
{{on "keyup" (fn this.notifyChanges "utmSource")}}
27+
/>
1828
</div>
19-
<OSS::InputContainer
20-
@value={{this.utmSource}}
21-
@placeholder={{t "utms.fields.source_placeholder"}}
22-
@feedbackMessage={{this.validationErrors.utmSource}}
23-
data-control-name="utm_source_input"
24-
{{on "focusout" (fn this.validateField "utmSource")}}
25-
{{on "keyup" (fn this.notifyChanges "utmSource")}}
26-
/>
2729

28-
<div class="fx-row">
29-
<span class="font-color-gray-500 font-size-md">
30-
{{t "utms.fields.medium"}}
31-
</span>
32-
<span class="font-color-error-500">
33-
*
34-
</span>
30+
<div class="fx-col fx-gap-px-6">
31+
<div class="fx-row">
32+
<span class="font-color-gray-500 font-size-md">
33+
{{t "utms.fields.medium"}}
34+
</span>
35+
<span class="font-color-error-500">
36+
*
37+
</span>
38+
</div>
39+
<OSS::InputContainer
40+
@value={{this.utmMedium}}
41+
@placeholder={{t "utms.fields.medium_placeholder"}}
42+
@feedbackMessage={{this.validationErrors.utmMedium}}
43+
data-control-name="utm_medium_input"
44+
{{on "focusout" (fn this.validateField "utmMedium")}}
45+
{{on "keyup" (fn this.notifyChanges "utmMedium")}}
46+
/>
3547
</div>
36-
<OSS::InputContainer
37-
@value={{this.utmMedium}}
38-
@placeholder={{t "utms.fields.medium_placeholder"}}
39-
@feedbackMessage={{this.validationErrors.utmMedium}}
40-
data-control-name="utm_medium_input"
41-
{{on "focusout" (fn this.validateField "utmMedium")}}
42-
{{on "keyup" (fn this.notifyChanges "utmMedium")}}
43-
/>
4448

45-
<div class="fx-row">
46-
<span class="font-color-gray-500 font-size-md">
47-
{{t "utms.fields.campaign"}}
48-
</span>
49-
<span class="font-color-error-500">
50-
*
51-
</span>
49+
<div class="fx-col fx-gap-px-6">
50+
<div class="fx-row">
51+
<span class="font-color-gray-500 font-size-md">
52+
{{t "utms.fields.campaign"}}
53+
</span>
54+
<span class="font-color-error-500">
55+
*
56+
</span>
57+
</div>
58+
<OSS::InputContainer
59+
@value={{this.utmCampaign}}
60+
@placeholder={{t "utms.fields.campaign_placeholder"}}
61+
@feedbackMessage={{this.validationErrors.utmCampaign}}
62+
data-control-name="utm_campaign_input"
63+
{{on "focusout" (fn this.validateField "utmCampaign")}}
64+
{{on "keyup" (fn this.notifyChanges "utmCampaign")}}
65+
/>
5266
</div>
53-
<OSS::InputContainer
54-
@value={{this.utmCampaign}}
55-
@placeholder={{t "utms.fields.campaign_placeholder"}}
56-
@feedbackMessage={{this.validationErrors.utmCampaign}}
57-
data-control-name="utm_campaign_input"
58-
{{on "focusout" (fn this.validateField "utmCampaign")}}
59-
{{on "keyup" (fn this.notifyChanges "utmCampaign")}}
60-
/>
6167
</div>
6268
{{#if this.displayPreview}}
6369
<hr />

tests/integration/components/utils/utm-link-builder-test.ts

+20-3
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@ import { hbs } from 'ember-cli-htmlbars';
22
import { module, test } from 'qunit';
33
import { setupRenderingTest } from 'ember-qunit';
44
import { setupIntl } from 'ember-intl/test-support';
5-
import { render } from '@ember/test-helpers';
5+
import { render, focus, blur } from '@ember/test-helpers';
66
import click from '@ember/test-helpers/dom/click';
77
import sinon from 'sinon';
88
import typeIn from '@ember/test-helpers/dom/type-in';
@@ -19,7 +19,7 @@ module('Integration | Component | utils/utm-link-builder', function (hooks) {
1919
test('it renders', async function (assert) {
2020
await render(hbs`<Utils::UtmLinkBuilder />`);
2121

22-
assert.dom('.utm-container').exists();
22+
assert.dom('.togglable-section').exists();
2323
});
2424

2525
test('If the toggle is disabled, the UTM inputs are hidden', async function (assert) {
@@ -79,11 +79,28 @@ module('Integration | Component | utils/utm-link-builder', function (hooks) {
7979
await settled();
8080
});
8181

82-
test('If a space character is inputed, it is replaced with a + sign', async function (assert) {
82+
test('If a space character is inputted, it is replaced with a + sign', async function (assert) {
8383
await render(hbs`<Utils::UtmLinkBuilder @onChange={{this.onChange}} />`);
8484
await click('.upf-toggle');
8585
await typeIn('[data-control-name="utm_source_input"] .upf-input', 'a a', { delay: 0 });
8686
await settled();
8787
assert.dom('[data-control-name="utm_source_input"] .upf-input').hasValue('a+a');
8888
});
89+
90+
['utm_source', 'utm_medium', 'utm_campaign'].forEach((field) => {
91+
test(`on blur on the ${field} input field, the field is validated and displays the right error if blank`, async function (assert) {
92+
await render(hbs`<Utils::UtmLinkBuilder @onChange={{this.onChange}} />`);
93+
await click('.upf-toggle');
94+
await focus(`[data-control-name="${field}_input"] input`);
95+
96+
assert.dom(`[data-control-name="${field}_input"] + .font-color-error-500`).doesNotExist();
97+
98+
await blur(`[data-control-name="${field}_input"] input`);
99+
100+
assert.dom(`[data-control-name="${field}_input"] + .font-color-error-500`).exists();
101+
assert
102+
.dom(`[data-control-name="${field}_input"] + .font-color-error-500`)
103+
.hasText(this.intl.t('utms.errors.blank_field'));
104+
});
105+
});
89106
});

0 commit comments

Comments
 (0)