Skip to content

Commit d7c0e58

Browse files
ijlee2ijlee2
authored
Removed {{action}} helper from docs-app (#410)
* feature: Created <DemoModal> component to standardize demos * refactor: Consumed <DemoModal> component (index) * refactor: Consumed <DemoModal> component (animatable) * refactor: Consumed <DemoModal> component (tethered) * refactor: Consumed <DemoModal> component (tethered-animatable) * chore: Removed unused code * chore: Removed unused configuration --------- Co-authored-by: ijlee2 <ijlee2@users.noreply.github.com>
1 parent f3c8301 commit d7c0e58

21 files changed

+1152
-1701
lines changed

‎.eslintrc.js‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -29,7 +29,6 @@ module.exports = {
2929
},
3030
rules: {
3131
'no-setter-return': 'off',
32-
'ember/classic-decorator-no-classic-methods': 'warn',
3332
'ember/classic-decorator-hooks': 'warn',
3433
'ember/no-classic-classes': 'warn',
3534
'ember/no-classic-components': 'warn',

‎tests/acceptance/basic-test.js‎

Lines changed: 0 additions & 114 deletions
Original file line numberDiff line numberDiff line change
@@ -27,26 +27,12 @@ module('Acceptance: modal-dialog | no animation, no tether', function (hooks) {
2727
openSelector: '#example-basic button',
2828
dialogText: 'Basic',
2929
closeSelector: overlaySelector,
30-
whileOpen: async function () {
31-
assert.hasDataTest(
32-
dialogSelector,
33-
'my-data-test',
34-
'dialog has data-test attribute',
35-
);
36-
},
3730
});
3831

3932
await assert.dialogOpensAndCloses({
4033
openSelector: '#example-basic button',
4134
dialogText: 'Basic',
4235
closeSelector: dialogCloseButton,
43-
whileOpen: async function () {
44-
assert.hasDataTest(
45-
dialogSelector,
46-
'my-data-test',
47-
'dialog has data-test attribute',
48-
);
49-
},
5036
});
5137
});
5238

@@ -55,26 +41,12 @@ module('Acceptance: modal-dialog | no animation, no tether', function (hooks) {
5541
openSelector: '#example-translucent button',
5642
dialogText: 'With Translucent Overlay',
5743
closeSelector: overlaySelector,
58-
whileOpen: async function () {
59-
assert.hasDataTest(
60-
dialogSelector,
61-
'my-data-test',
62-
'dialog has data-test attribute',
63-
);
64-
},
6544
});
6645

6746
await assert.dialogOpensAndCloses({
6847
openSelector: '#example-translucent button',
6948
dialogText: 'With Translucent Overlay',
7049
closeSelector: dialogCloseButton,
71-
whileOpen: async function () {
72-
assert.hasDataTest(
73-
dialogSelector,
74-
'my-data-test',
75-
'dialog has data-test attribute',
76-
);
77-
},
7850
});
7951
});
8052

@@ -83,26 +55,12 @@ module('Acceptance: modal-dialog | no animation, no tether', function (hooks) {
8355
openSelector: '#example-without-overlay button',
8456
dialogText: 'Without Overlay',
8557
closeSelector: '#example-without-overlay',
86-
whileOpen: async function () {
87-
assert.hasDataTest(
88-
dialogSelector,
89-
'my-data-test',
90-
'dialog has data-test attribute',
91-
);
92-
},
9358
});
9459

9560
await assert.dialogOpensAndCloses({
9661
openSelector: '#example-without-overlay button',
9762
dialogText: 'Without Overlay',
9863
closeSelector: dialogCloseButton,
99-
whileOpen: async function () {
100-
assert.hasDataTest(
101-
dialogSelector,
102-
'my-data-test',
103-
'dialog has data-test attribute',
104-
);
105-
},
10664
});
10765
});
10866

@@ -111,26 +69,12 @@ module('Acceptance: modal-dialog | no animation, no tether', function (hooks) {
11169
openSelector: '#example-translucent button',
11270
dialogText: 'With Translucent Overlay',
11371
closeSelector: overlaySelector,
114-
whileOpen: async function () {
115-
assert.hasDataTest(
116-
dialogSelector,
117-
'my-data-test',
118-
'dialog has data-test attribute',
119-
);
120-
},
12172
});
12273

12374
await assert.dialogOpensAndCloses({
12475
openSelector: '#example-translucent button',
12576
dialogText: 'With Translucent Overlay',
12677
closeSelector: dialogCloseButton,
127-
whileOpen: async function () {
128-
assert.hasDataTest(
129-
dialogSelector,
130-
'my-data-test',
131-
'dialog has data-test attribute',
132-
);
133-
},
13478
});
13579
});
13680

@@ -139,26 +83,12 @@ module('Acceptance: modal-dialog | no animation, no tether', function (hooks) {
13983
openSelector: '#example-overlay-sibling button',
14084
dialogText: 'With Translucent Overlay as Sibling',
14185
closeSelector: overlaySelector,
142-
whileOpen: async function () {
143-
assert.hasDataTest(
144-
dialogSelector,
145-
'my-data-test',
146-
'dialog has data-test attribute',
147-
);
148-
},
14986
});
15087

15188
await assert.dialogOpensAndCloses({
15289
openSelector: '#example-overlay-sibling button',
15390
dialogText: 'With Translucent Overlay as Sibling',
15491
closeSelector: dialogCloseButton,
155-
whileOpen: async function () {
156-
assert.hasDataTest(
157-
dialogSelector,
158-
'my-data-test',
159-
'dialog has data-test attribute',
160-
);
161-
},
16292
});
16393
});
16494

@@ -191,24 +121,12 @@ module('Acceptance: modal-dialog | no animation, no tether', function (hooks) {
191121
'custom-styles-modal-container',
192122
'has provided container-class',
193123
);
194-
assert.hasDataTest(
195-
dialogSelector,
196-
'my-data-test',
197-
'dialog has data-test attribute',
198-
);
199124
},
200125
});
201126
await assert.dialogOpensAndCloses({
202127
openSelector: '#example-custom-styles button',
203128
dialogText: 'Custom Styles',
204129
closeSelector: dialogCloseButton,
205-
whileOpen: async function () {
206-
assert.hasDataTest(
207-
dialogSelector,
208-
'my-data-test',
209-
'dialog has data-test attribute',
210-
);
211-
},
212130
});
213131
});
214132

@@ -224,11 +142,6 @@ module('Acceptance: modal-dialog | no animation, no tether', function (hooks) {
224142
'ember-modal-dialog-target-attachment-left',
225143
'has targetAttachment class name',
226144
);
227-
assert.hasDataTest(
228-
dialogSelector,
229-
'my-data-test',
230-
'dialog has data-test attribute',
231-
);
232145
},
233146
});
234147
});
@@ -238,13 +151,6 @@ module('Acceptance: modal-dialog | no animation, no tether', function (hooks) {
238151
openSelector: '#example-target-element button',
239152
dialogText: 'Target - Element',
240153
closeSelector: dialogCloseButton,
241-
whileOpen: async function () {
242-
assert.hasDataTest(
243-
dialogSelector,
244-
'my-data-test',
245-
'dialog has data-test attribute',
246-
);
247-
},
248154
});
249155
});
250156

@@ -257,11 +163,6 @@ module('Acceptance: modal-dialog | no animation, no tether', function (hooks) {
257163
assert
258164
.dom(dialogSelector)
259165
.hasClass('my-cool-modal', 'has provided containerClassNames');
260-
assert.hasDataTest(
261-
dialogSelector,
262-
'my-data-test',
263-
'dialog has data-test attribute',
264-
);
265166
},
266167
});
267168
});
@@ -278,11 +179,6 @@ module('Acceptance: modal-dialog | no animation, no tether', function (hooks) {
278179
assert
279180
.dom(dialogSelector)
280181
.hasClass('my-cool-modal-2', 'has provided containerClassNames');
281-
assert.hasDataTest(
282-
dialogSelector,
283-
'my-data-test',
284-
'dialog has data-test attribute',
285-
);
286182
},
287183
});
288184
});
@@ -302,11 +198,6 @@ module('Acceptance: modal-dialog | no animation, no tether', function (hooks) {
302198
assert
303199
.dom(inPlaceDialogSelector)
304200
.hasClass('my-custom-class', 'has provided containerClass');
305-
assert.hasDataTest(
306-
inPlaceDialogSelector,
307-
'my-data-test',
308-
'dialog has data-test attribute',
309-
);
310201
assert.strictEqual(
311202
getComputedStyle(dialogElement).getPropertyValue('position'),
312203
'static',
@@ -356,11 +247,6 @@ module('Acceptance: modal-dialog | no animation, no tether', function (hooks) {
356247
assert
357248
.dom(inPlaceDialogSelector)
358249
.hasClass('my-custom-class-2', 'has provided containerClassNames');
359-
assert.hasDataTest(
360-
inPlaceDialogSelector,
361-
'my-data-test',
362-
'dialog has data-test attribute',
363-
);
364250
await click(inPlaceCloseButton);
365251
});
366252
});

‎tests/dummy/app/components/component-that-uses-modal-dialog.hbs‎

Lines changed: 0 additions & 17 deletions
This file was deleted.

‎tests/dummy/app/components/component-that-uses-modal-dialog.js‎

Lines changed: 0 additions & 16 deletions
This file was deleted.

‎tests/dummy/app/components/demo-modal.hbs‎

Lines changed: 34 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,34 @@
1+
<div class="example" id={{@id}}>
2+
<h2>{{@title}}</h2>
3+
4+
<div>
5+
{{yield
6+
(hash
7+
OpenButton=(component
8+
"demo-modal/button"
9+
label="Open"
10+
onClick=this.openModal
11+
)
12+
)
13+
to="menu"
14+
}}
15+
</div>
16+
17+
<div>
18+
{{yield to="code"}}
19+
</div>
20+
21+
<div>
22+
{{yield
23+
(hash
24+
CloseButton=(component
25+
"demo-modal/button"
26+
label="Close"
27+
onClick=this.closeModal
28+
)
29+
closeModal=this.closeModal
30+
isModalOpen=this.isModalOpen
31+
)
32+
}}
33+
</div>
34+
</div>

‎tests/dummy/app/components/demo-modal.js‎

Lines changed: 19 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,19 @@
1+
import { action } from '@ember/object';
2+
import Component from '@glimmer/component';
3+
import { tracked } from '@glimmer/tracking';
4+
5+
export default class DemoModal extends Component {
6+
@tracked isModalOpen = false;
7+
8+
@action closeModal() {
9+
this.isModalOpen = false;
10+
11+
this.args.onClose?.();
12+
}
13+
14+
@action openModal() {
15+
this.isModalOpen = true;
16+
17+
this.args.onOpen?.();
18+
}
19+
}

‎tests/dummy/app/components/demo-modal/button.hbs‎

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
<button
2+
data-test-button={{@label}}
3+
type="button"
4+
{{on "click" @onClick}}
5+
...attributes
6+
>
7+
{{@label}}
8+
</button>

‎tests/dummy/app/components/demo-modal/button.js‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
import templateOnlyComponent from '@ember/component/template-only';
2+
3+
const DemoModalButton = templateOnlyComponent();
4+
5+
export default DemoModalButton;

0 commit comments

Comments
 (0)