Skip to content

Commit ff5ad3b

Browse files
authored
Merge pull request #308 from kaliber5/fix-patterns-in-tests-not-supported-by-ember-v4
fix patterns not supported by Ember v4 in tests
2 parents 15c3957 + 0f40b0d commit ff5ad3b

File tree

2 files changed

+52
-44
lines changed

2 files changed

+52
-44
lines changed

tests/integration/components/bs-form/element/control/power-select-multiple-test.js

Lines changed: 26 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -10,14 +10,16 @@ module(
1010
setupRenderingTest(hooks);
1111

1212
hooks.beforeEach(function () {
13+
this.set('model', {
14+
prop: ['foo'],
15+
});
1316
this.set('options', ['foo', 'bar']);
14-
this.set('prop', ['foo']);
1517
});
1618

1719
test('it renders as blockless element', async function (assert) {
1820
await render(hbs`
19-
<BsForm @model={{this}} as |form|>
20-
<form.element @controlType="power-select-multiple" @property="prop" @options={{options}} />
21+
<BsForm @model={{this.model}} as |form|>
22+
<form.element @controlType="power-select-multiple" @property="prop" @options={{this.options}} />
2123
</BsForm>`);
2224
assert.dom('.ember-power-select-trigger').exists({ count: 1 });
2325
assert.equal(
@@ -31,13 +33,13 @@ module(
3133
assert.dom(findAll('.ember-power-select-option')[0]).hasText('foo');
3234
assert.dom(findAll('.ember-power-select-option')[1]).hasText('bar');
3335
await click(findAll('.ember-power-select-option')[1]);
34-
assert.deepEqual(this.prop, ['foo', 'bar']);
36+
assert.deepEqual(this.model.prop, ['foo', 'bar']);
3537
});
3638

3739
test('it renders as blockless control component', async function (assert) {
3840
await render(hbs`
39-
<BsForm @model={{this}} as |form|>
40-
<form.element @controlType="power-select-multiple" @property="prop" @options={{options}} as |el|>
41+
<BsForm @model={{this.model}} as |form|>
42+
<form.element @controlType="power-select-multiple" @property="prop" @options={{this.options}} as |el|>
4143
<el.control />
4244
</form.element>
4345
</BsForm>`);
@@ -53,13 +55,13 @@ module(
5355
assert.dom(findAll('.ember-power-select-option')[0]).hasText('foo');
5456
assert.dom(findAll('.ember-power-select-option')[1]).hasText('bar');
5557
await click(findAll('.ember-power-select-option')[1]);
56-
assert.deepEqual(this.prop, ['foo', 'bar']);
58+
assert.deepEqual(this.model.prop, ['foo', 'bar']);
5759
});
5860

5961
test('it renders as block control component', async function (assert) {
6062
await render(hbs`
61-
<BsForm @model={{this}} as |form|>
62-
<form.element @controlType="power-select-multiple" @property="prop" @options={{options}} as |el|>
63+
<BsForm @model={{this.model}} as |form|>
64+
<form.element @controlType="power-select-multiple" @property="prop" @options={{this.options}} as |el|>
6365
<el.control as |val|>
6466
{{val}}
6567
</el.control>
@@ -77,21 +79,21 @@ module(
7779
assert.dom(findAll('.ember-power-select-option')[0]).hasText('foo');
7880
assert.dom(findAll('.ember-power-select-option')[1]).hasText('bar');
7981
await click(findAll('.ember-power-select-option')[1]);
80-
assert.deepEqual(this.prop, ['foo', 'bar']);
82+
assert.deepEqual(this.model.prop, ['foo', 'bar']);
8183
});
8284

8385
test('it can disable select', async function (assert) {
8486
await render(hbs`
85-
<BsForm @model={{this}} @disabled={{true}} as |form|>
86-
<form.element @controlType="power-select-multiple" @property="prop" @options={{options}} />
87+
<BsForm @disabled={{true}} as |form|>
88+
<form.element @controlType="power-select-multiple" @property="prop" @options={{this.options}} />
8789
</BsForm>`);
8890
assert.ok(
8991
find('.ember-power-select-trigger').getAttribute('aria-disabled')
9092
);
9193

9294
await render(hbs`
93-
<BsForm @model={{this}} @disabled={{true}} as |form|>
94-
<form.element @controlType="power-select-multiple" @property="prop" @options={{options}} as |el|>
95+
<BsForm @disabled={{true}} as |form|>
96+
<form.element @controlType="power-select-multiple" @property="prop" @options={{this.options}} as |el|>
9597
<el.control as |val|>
9698
{{val}}
9799
</el.control>
@@ -107,10 +109,12 @@ module(
107109
'options',
108110
this.options.map((title) => ({ title }))
109111
);
110-
this.set('prop', [this.options[0]]);
112+
this.set('model', {
113+
prop: [this.options[0]],
114+
});
111115
await render(hbs`
112-
<BsForm @model={{this}} as |form|>
113-
<form.element @controlType="power-select-multiple" @property="prop" @options={{options}} @optionLabelPath="title" />
116+
<BsForm @model={{this.model}} as |form|>
117+
<form.element @controlType="power-select-multiple" @property="prop" @options={{this.options}} @optionLabelPath="title" />
114118
</BsForm>`);
115119
assert.dom('.ember-power-select-trigger').exists({ count: 1 });
116120
assert.equal(
@@ -124,13 +128,13 @@ module(
124128
assert.dom(findAll('.ember-power-select-option')[0]).hasText('foo');
125129
assert.dom(findAll('.ember-power-select-option')[1]).hasText('bar');
126130
await click(findAll('.ember-power-select-option')[1]);
127-
assert.deepEqual(this.prop, this.options);
131+
assert.deepEqual(this.model.prop, this.options);
128132
});
129133

130134
test('it passes power-select @options', async function (assert) {
131135
await render(hbs`
132-
<BsForm @model={{this}} as |form|>
133-
<form.element @controlType="power-select-multiple" @property="prop2" @options={{options}} @placeholder="something" as |el|>
136+
<BsForm as |form|>
137+
<form.element @controlType="power-select-multiple" @property="prop2" @options={{this.options}} @placeholder="something" as |el|>
134138
<el.control @searchEnabled={{false}} @triggerClass="form-control" />
135139
</form.element>
136140
</BsForm>`);
@@ -142,8 +146,8 @@ module(
142146
test('it passes HTML attributes', async function (assert) {
143147
// HTML attributes are not applied to any element if `renderInPlace` is `false`
144148
await render(hbs`
145-
<BsForm @model={{hash}} as |form|>
146-
<form.element @controlType="power-select-multiple" @property="prop" @options={{array}} as |el|>
149+
<BsForm as |form|>
150+
<form.element @controlType="power-select-multiple" @property="prop" as |el|>
147151
<el.control @renderInPlace={{true}} data-test-foo />
148152
</form.element>
149153
</BsForm>`);

tests/integration/components/bs-form/element/control/power-select-test.js

Lines changed: 26 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -10,14 +10,16 @@ module(
1010
setupRenderingTest(hooks);
1111

1212
hooks.beforeEach(function () {
13+
this.set('model', {
14+
prop: 'foo',
15+
});
1316
this.set('options', ['foo', 'bar']);
14-
this.set('prop', 'foo');
1517
});
1618

1719
test('it renders as blockless element', async function (assert) {
1820
await render(hbs`
19-
<BsForm @model={{this}} as |form|>
20-
<form.element @controlType="power-select" @property="prop" @options={{options}} />
21+
<BsForm @model={{this.model}} as |form|>
22+
<form.element @controlType="power-select" @property="prop" @options={{this.options}} />
2123
</BsForm>`);
2224
assert.dom('.ember-power-select-trigger').exists({ count: 1 });
2325
assert.dom('.ember-power-select-selected-item').hasText('foo');
@@ -26,13 +28,13 @@ module(
2628
assert.dom(findAll('.ember-power-select-option')[0]).hasText('foo');
2729
assert.dom(findAll('.ember-power-select-option')[1]).hasText('bar');
2830
await click(findAll('.ember-power-select-option')[1]);
29-
assert.equal(this.prop, 'bar');
31+
assert.equal(this.model.prop, 'bar');
3032
});
3133

3234
test('it renders as blockless control component', async function (assert) {
3335
await render(hbs`
34-
<BsForm @model={{this}} as |form|>
35-
<form.element @controlType="power-select" @property="prop" @options={{options}} as |el|>
36+
<BsForm @model={{this.model}} as |form|>
37+
<form.element @controlType="power-select" @property="prop" @options={{this.options}} as |el|>
3638
{{el.control}}
3739
</form.element>
3840
</BsForm>`);
@@ -43,13 +45,13 @@ module(
4345
assert.dom(findAll('.ember-power-select-option')[0]).hasText('foo');
4446
assert.dom(findAll('.ember-power-select-option')[1]).hasText('bar');
4547
await click(findAll('.ember-power-select-option')[1]);
46-
assert.equal(this.prop, 'bar');
48+
assert.equal(this.model.prop, 'bar');
4749
});
4850

4951
test('it renders as block control component', async function (assert) {
5052
await render(hbs`
51-
<BsForm @model={{this}} as |form|>
52-
<form.element @controlType="power-select" @property="prop" @options={{options}} as |el|>
53+
<BsForm @model={{this.model}} as |form|>
54+
<form.element @controlType="power-select" @property="prop" @options={{this.options}} as |el|>
5355
<el.control as |val|>
5456
{{val}}
5557
</el.control>
@@ -62,21 +64,21 @@ module(
6264
assert.dom(findAll('.ember-power-select-option')[0]).hasText('foo');
6365
assert.dom(findAll('.ember-power-select-option')[1]).hasText('bar');
6466
await click(findAll('.ember-power-select-option')[1]);
65-
assert.equal(this.prop, 'bar');
67+
assert.equal(this.model.prop, 'bar');
6668
});
6769

6870
test('it can disable select', async function (assert) {
6971
await render(hbs`
70-
<BsForm @model={{this}} @disabled={{true}} as |form|>
71-
<form.element @controlType="power-select" @property="prop" @options={{options}} />
72+
<BsForm @disabled={{true}} as |form|>
73+
<form.element @controlType="power-select" @property="prop" @options={{this.options}} />
7274
</BsForm>`);
7375
assert.ok(
7476
find('.ember-power-select-trigger').getAttribute('aria-disabled')
7577
);
7678

7779
await render(hbs`
78-
<BsForm @model={{this}} @disabled={{true}} as |form|>
79-
<form.element @controlType="power-select" @property="prop" @options={{options}} as |el|>
80+
<BsForm @disabled={{true}} as |form|>
81+
<form.element @controlType="power-select" @property="prop" @options={{this.options}} as |el|>
8082
<el.control as |val|>
8183
{{val}}
8284
</el.control>
@@ -92,10 +94,12 @@ module(
9294
'options',
9395
this.options.map((title) => ({ title }))
9496
);
95-
this.set('prop', this.options[0]);
97+
this.set('model', {
98+
prop: this.options[0],
99+
});
96100
await render(hbs`
97-
<BsForm @model={{this}} as |form|>
98-
<form.element @controlType="power-select" @property="prop" @options={{options}} @optionLabelPath="title" />
101+
<BsForm @model={{this.model}} as |form|>
102+
<form.element @controlType="power-select" @property="prop" @options={{this.options}} @optionLabelPath="title" />
99103
</BsForm>`);
100104
assert.dom('.ember-power-select-trigger').exists({ count: 1 });
101105
assert.dom('.ember-power-select-selected-item').hasText('foo');
@@ -104,13 +108,13 @@ module(
104108
assert.dom(findAll('.ember-power-select-option')[0]).hasText('foo');
105109
assert.dom(findAll('.ember-power-select-option')[1]).hasText('bar');
106110
await click(findAll('.ember-power-select-option')[1]);
107-
assert.equal(this.prop, this.options[1]);
111+
assert.equal(this.model.prop, this.options[1]);
108112
});
109113

110114
test('it passes power-select options', async function (assert) {
111115
await render(hbs`
112-
<BsForm @model={{this}} as |form|>
113-
<form.element @controlType="power-select" @property="prop2" @options={{options}} @placeholder="something" as |el|>
116+
<BsForm as |form|>
117+
<form.element @controlType="power-select" @property="prop2" @options={{this.options}} @placeholder="something" as |el|>
114118
<el.control @searchEnabled={{false}} @triggerClass="form-control" />
115119
</form.element>
116120
</BsForm>`);
@@ -122,8 +126,8 @@ module(
122126
test('it passes HTML attributes', async function (assert) {
123127
// HTML attributes are not applied to any element if `renderInPlace` is `false`
124128
await render(hbs`
125-
<BsForm @model={{hash}} as |form|>
126-
<form.element @controlType="power-select" @property="prop" @options={{array}} as |el|>
129+
<BsForm as |form|>
130+
<form.element @controlType="power-select" @property="prop" as |el|>
127131
<el.control @renderInPlace={{true}} data-test-foo />
128132
</form.element>
129133
</BsForm>`);

0 commit comments

Comments
 (0)