Skip to content

Commit d0e1b82

Browse files
SwikritiTSwikritiT
committed
Remove the id attribute from the Text input for assistance in e2e tests
Signed-off-by: Swikriti Tripathi <[email protected]>
1 parent 8e17459 commit d0e1b82

File tree

4 files changed

+44
-50
lines changed

4 files changed

+44
-50
lines changed

‎src/components/admin/TextInput.vue‎

Lines changed: 1 addition & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@
44
{{ labelText }}
55
</div>
66
<div class="text-input-input-wrapper">
7-
<input :id="id"
7+
<input
88
ref="textInput"
99
:value="value"
1010
:type="type"
@@ -69,10 +69,6 @@ export default {
6969
default: '',
7070
type: String,
7171
},
72-
id: {
73-
type: String,
74-
required: true,
75-
},
7672
type: {
7773
type: String,
7874
default: 'text',

‎tests/jest/components/AdminSettings.spec.js‎

Lines changed: 3 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -36,9 +36,7 @@ global.navigator = {
3636
}
3737

3838
const selectors = {
39-
oauthInstanceInput: '#openproject-oauth-instance',
40-
oauthClientId: '#openproject-client-id',
41-
oauthClientSecret: '#openproject-client-secret',
39+
oauthInstanceInput: 'div#openproject-oauth-instance > div.text-input-input-wrapper > input',
4240
serverHostForm: '.openproject-server-host',
4341
opOauthForm: '.openproject-oauth-values',
4442
ncOauthForm: '.nextcloud-oauth-values',
@@ -48,8 +46,8 @@ const selectors = {
4846
resetOPOAuthFormButton: '[data-test-id="reset-op-oauth-btn"]',
4947
resetNcOAuthFormButton: '[data-test-id="reset-nc-oauth-btn"]',
5048
submitOPOAuthFormButton: '[data-test-id="submit-op-oauth-btn"]',
51-
opOauthClientIdInput: '#openproject-oauth-client-id',
52-
opOauthClientSecretInput: '#openproject-oauth-client-secret',
49+
opOauthClientIdInput: 'div#openproject-oauth-client-id > div.text-input-input-wrapper > input',
50+
opOauthClientSecretInput: 'div#openproject-oauth-client-secret > div.text-input-input-wrapper > input',
5351
submitServerHostFormButton: '[data-test-id="submit-server-host-form-btn"]',
5452
submitNcOAuthFormButton: '[data-test-id="submit-nc-oauth-values-form-btn"]',
5553
resetAllAppSettingsButton: '#reset-all-app-settings-btn',

‎tests/jest/components/__snapshots__/AdminSettings.spec.js.snap‎

Lines changed: 26 additions & 26 deletions
Original file line numberDiff line numberDiff line change
@@ -4,8 +4,8 @@ exports[`AdminSettings.vue Nextcloud OAuth values form edit mode should show the
44
<div class="nextcloud-oauth-values">
55
<formheading-stub index="3" title="Nextcloud OAuth client" iscomplete="true"></formheading-stub>
66
<div>
7-
<textinput-stub value="nc-client-id" id="nextcloud-oauth-client-id" type="text" placeholder="" label="Nextcloud OAuth client ID" hinttext="Copy the following values back into the OpenProject {htmlLink} as an Administrator." isrequired="true" withcopybtn="true" readonly="true" class="py-1"></textinput-stub>
8-
<textinput-stub value="nc-client-secret" id="nextcloud-oauth-client-secret" type="text" placeholder="" label="Nextcloud OAuth client secret" hinttext="Copy the following values back into the OpenProject {htmlLink} as an Administrator." isrequired="true" withcopybtn="true" readonly="true" class="py-1"></textinput-stub>
7+
<textinput-stub value="nc-client-id" type="text" placeholder="" label="Nextcloud OAuth client ID" hinttext="Copy the following values back into the OpenProject {htmlLink} as an Administrator." isrequired="true" withcopybtn="true" readonly="true" id="nextcloud-oauth-client-id" class="py-1"></textinput-stub>
8+
<textinput-stub value="nc-client-secret" type="text" placeholder="" label="Nextcloud OAuth client secret" hinttext="Copy the following values back into the OpenProject {htmlLink} as an Administrator." isrequired="true" withcopybtn="true" readonly="true" id="nextcloud-oauth-client-secret" class="py-1"></textinput-stub>
99
<div class="form-actions">
1010
<button-stub type="primary" nativetype="button" data-test-id="submit-nc-oauth-values-form-btn">
1111
Yes, I have copied these values
@@ -41,22 +41,22 @@ exports[`AdminSettings.vue OpenProject OAuth values form edit mode should show t
4141
</div>
4242
</div>
4343
<div>
44-
<div class="text-input py-1">
44+
<div class="text-input py-1" id="openproject-oauth-client-id">
4545
<div class="text-input-label">
4646
OpenProject OAuth client ID *
4747
</div>
48-
<div class="text-input-input-wrapper"><input id="openproject-oauth-client-id" type="text" placeholder="" class="">
48+
<div class="text-input-input-wrapper"><input type="text" placeholder="" class="">
4949
<!---->
5050
</div>
5151
<div>
5252
<div class="text-input-hint">Go to your OpenProject {htmlLink} as an Administrator and start the setup and copy the values here.</div>
5353
</div>
5454
</div>
55-
<div class="text-input py-1">
55+
<div class="text-input py-1" id="openproject-oauth-client-secret">
5656
<div class="text-input-label">
5757
OpenProject OAuth client secret *
5858
</div>
59-
<div class="text-input-input-wrapper"><input id="openproject-oauth-client-secret" type="text" placeholder="" class="">
59+
<div class="text-input-input-wrapper"><input type="text" placeholder="" class="">
6060
<!---->
6161
</div>
6262
<div>
@@ -126,16 +126,16 @@ exports[`AdminSettings.vue server host url form edit mode cancel button should b
126126
</span></span></button>
127127
`;
128128
129-
exports[`AdminSettings.vue server host url form edit mode readonly state should clear the readonly state when clicked on the input 1`] = `<input id="openproject-oauth-instance" type="text" placeholder="https://www.my-openproject.com" class="">`;
129+
exports[`AdminSettings.vue server host url form edit mode readonly state should clear the readonly state when clicked on the input 1`] = `<input type="text" placeholder="https://www.my-openproject.com" class="">`;
130130
131-
exports[`AdminSettings.vue server host url form edit mode readonly state should set the input field to readonly at first 1`] = `<input id="openproject-oauth-instance" type="text" readonly="readonly" placeholder="https://www.my-openproject.com" class="text-input-readonly">`;
131+
exports[`AdminSettings.vue server host url form edit mode readonly state should set the input field to readonly at first 1`] = `<input type="text" readonly="readonly" placeholder="https://www.my-openproject.com" class="text-input-readonly">`;
132132
133133
exports[`AdminSettings.vue server host url form edit mode submit button should set the input to error state and display correct message when the url is invalid 1`] = `
134-
<div class="text-input pb-1">
134+
<div class="text-input pb-1" id="openproject-oauth-instance">
135135
<div class="text-input-label">
136136
OpenProject host *
137137
</div>
138-
<div class="text-input-input-wrapper"><input id="openproject-oauth-instance" type="text" readonly="readonly" placeholder="https://www.my-openproject.com" class="text-input-error text-input-readonly">
138+
<div class="text-input-input-wrapper"><input type="text" readonly="readonly" placeholder="https://www.my-openproject.com" class="text-input-error text-input-readonly">
139139
<!---->
140140
</div>
141141
<div>
@@ -150,11 +150,11 @@ exports[`AdminSettings.vue server host url form edit mode submit button should s
150150
`;
151151
152152
exports[`AdminSettings.vue server host url form edit mode submit button should set the input to error state and display correct message when the url is invalid 2`] = `
153-
<div class="text-input pb-1">
153+
<div class="text-input pb-1" id="openproject-oauth-instance">
154154
<div class="text-input-label">
155155
OpenProject host *
156156
</div>
157-
<div class="text-input-input-wrapper"><input id="openproject-oauth-instance" type="text" readonly="readonly" placeholder="https://www.my-openproject.com" class="text-input-error text-input-readonly">
157+
<div class="text-input-input-wrapper"><input type="text" readonly="readonly" placeholder="https://www.my-openproject.com" class="text-input-error text-input-readonly">
158158
<!---->
159159
</div>
160160
<div>
@@ -169,11 +169,11 @@ exports[`AdminSettings.vue server host url form edit mode submit button should s
169169
`;
170170
171171
exports[`AdminSettings.vue server host url form edit mode submit button should set the input to error state and display correct message when the url is invalid 3`] = `
172-
<div class="text-input pb-1">
172+
<div class="text-input pb-1" id="openproject-oauth-instance">
173173
<div class="text-input-label">
174174
OpenProject host *
175175
</div>
176-
<div class="text-input-input-wrapper"><input id="openproject-oauth-instance" type="text" readonly="readonly" placeholder="https://www.my-openproject.com" class="text-input-error text-input-readonly">
176+
<div class="text-input-input-wrapper"><input type="text" readonly="readonly" placeholder="https://www.my-openproject.com" class="text-input-error text-input-readonly">
177177
<!---->
178178
</div>
179179
<div>
@@ -188,11 +188,11 @@ exports[`AdminSettings.vue server host url form edit mode submit button should s
188188
`;
189189
190190
exports[`AdminSettings.vue server host url form edit mode submit button should set the input to error state and display correct message when the url is invalid 4`] = `
191-
<div class="text-input pb-1">
191+
<div class="text-input pb-1" id="openproject-oauth-instance">
192192
<div class="text-input-label">
193193
OpenProject host *
194194
</div>
195-
<div class="text-input-input-wrapper"><input id="openproject-oauth-instance" type="text" readonly="readonly" placeholder="https://www.my-openproject.com" class="text-input-error text-input-readonly">
195+
<div class="text-input-input-wrapper"><input type="text" readonly="readonly" placeholder="https://www.my-openproject.com" class="text-input-error text-input-readonly">
196196
<!---->
197197
</div>
198198
<div>
@@ -207,11 +207,11 @@ exports[`AdminSettings.vue server host url form edit mode submit button should s
207207
`;
208208
209209
exports[`AdminSettings.vue server host url form edit mode submit button should set the input to error state and display correct message when the url is invalid 5`] = `
210-
<div class="text-input pb-1">
210+
<div class="text-input pb-1" id="openproject-oauth-instance">
211211
<div class="text-input-label">
212212
OpenProject host *
213213
</div>
214-
<div class="text-input-input-wrapper"><input id="openproject-oauth-instance" type="text" readonly="readonly" placeholder="https://www.my-openproject.com" class="text-input-error text-input-readonly">
214+
<div class="text-input-input-wrapper"><input type="text" readonly="readonly" placeholder="https://www.my-openproject.com" class="text-input-error text-input-readonly">
215215
<!---->
216216
</div>
217217
<div>
@@ -226,11 +226,11 @@ exports[`AdminSettings.vue server host url form edit mode submit button should s
226226
`;
227227
228228
exports[`AdminSettings.vue server host url form edit mode submit button should set the input to error state and display correct message when the url is invalid 6`] = `
229-
<div class="text-input pb-1">
229+
<div class="text-input pb-1" id="openproject-oauth-instance">
230230
<div class="text-input-label">
231231
OpenProject host *
232232
</div>
233-
<div class="text-input-input-wrapper"><input id="openproject-oauth-instance" type="text" readonly="readonly" placeholder="https://www.my-openproject.com" class="text-input-error text-input-readonly">
233+
<div class="text-input-input-wrapper"><input type="text" readonly="readonly" placeholder="https://www.my-openproject.com" class="text-input-error text-input-readonly">
234234
<!---->
235235
</div>
236236
<div>
@@ -245,11 +245,11 @@ exports[`AdminSettings.vue server host url form edit mode submit button should s
245245
`;
246246
247247
exports[`AdminSettings.vue server host url form edit mode submit button should set the input to error state and display correct message when the url is invalid 7`] = `
248-
<div class="text-input pb-1">
248+
<div class="text-input pb-1" id="openproject-oauth-instance">
249249
<div class="text-input-label">
250250
OpenProject host *
251251
</div>
252-
<div class="text-input-input-wrapper"><input id="openproject-oauth-instance" type="text" readonly="readonly" placeholder="https://www.my-openproject.com" class="text-input-error text-input-readonly">
252+
<div class="text-input-input-wrapper"><input type="text" readonly="readonly" placeholder="https://www.my-openproject.com" class="text-input-error text-input-readonly">
253253
<!---->
254254
</div>
255255
<div>
@@ -264,11 +264,11 @@ exports[`AdminSettings.vue server host url form edit mode submit button should s
264264
`;
265265
266266
exports[`AdminSettings.vue server host url form edit mode submit button should set the input to error state and display correct message when the url is invalid 8`] = `
267-
<div class="text-input pb-1">
267+
<div class="text-input pb-1" id="openproject-oauth-instance">
268268
<div class="text-input-label">
269269
OpenProject host *
270270
</div>
271-
<div class="text-input-input-wrapper"><input id="openproject-oauth-instance" type="text" readonly="readonly" placeholder="https://www.my-openproject.com" class="text-input-error text-input-readonly">
271+
<div class="text-input-input-wrapper"><input type="text" readonly="readonly" placeholder="https://www.my-openproject.com" class="text-input-error text-input-readonly">
272272
<!---->
273273
</div>
274274
<div>
@@ -281,11 +281,11 @@ exports[`AdminSettings.vue server host url form edit mode submit button should s
281281
`;
282282
283283
exports[`AdminSettings.vue server host url form edit mode submit button should set the input to error state and display correct message when the url is invalid 9`] = `
284-
<div class="text-input pb-1">
284+
<div class="text-input pb-1" id="openproject-oauth-instance">
285285
<div class="text-input-label">
286286
OpenProject host *
287287
</div>
288-
<div class="text-input-input-wrapper"><input id="openproject-oauth-instance" type="text" readonly="readonly" placeholder="https://www.my-openproject.com" class="text-input-error text-input-readonly">
288+
<div class="text-input-input-wrapper"><input type="text" readonly="readonly" placeholder="https://www.my-openproject.com" class="text-input-error text-input-readonly">
289289
<!---->
290290
</div>
291291
<div>

‎tests/jest/components/admin/__snapshots__/TextInput.spec.js.snap‎

Lines changed: 14 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -13,23 +13,23 @@ exports[`TextInput.vue is required prop should not add asterik to the label text
1313
`;
1414

1515
exports[`TextInput.vue messages should not show error message details if not error message is provided 1`] = `
16-
<div class="text-input">
16+
<div class="text-input" id="unique-id">
1717
<div class="text-input-label">
1818
some label
1919
</div>
20-
<div class="text-input-input-wrapper"><input id="unique-id" type="text" placeholder="" class="">
20+
<div class="text-input-input-wrapper"><input type="text" placeholder="" class="">
2121
<!---->
2222
</div>
2323
<!---->
2424
</div>
2525
`;
2626
2727
exports[`TextInput.vue messages should show error message details if both error message and details are provided 1`] = `
28-
<div class="text-input">
28+
<div class="text-input" id="unique-id">
2929
<div class="text-input-label">
3030
some label
3131
</div>
32-
<div class="text-input-input-wrapper"><input id="unique-id" type="text" placeholder="" class="text-input-error">
32+
<div class="text-input-input-wrapper"><input type="text" placeholder="" class="text-input-error">
3333
<!---->
3434
</div>
3535
<div>
@@ -44,11 +44,11 @@ exports[`TextInput.vue messages should show error message details if both error
4444
`;
4545
4646
exports[`TextInput.vue messages should show error message if both error message and hint text are provided 1`] = `
47-
<div class="text-input">
47+
<div class="text-input" id="unique-id">
4848
<div class="text-input-label">
4949
some label
5050
</div>
51-
<div class="text-input-input-wrapper"><input id="unique-id" type="text" placeholder="" class="text-input-error">
51+
<div class="text-input-input-wrapper"><input type="text" placeholder="" class="text-input-error">
5252
<!---->
5353
</div>
5454
<div>
@@ -61,11 +61,11 @@ exports[`TextInput.vue messages should show error message if both error message
6161
`;
6262
6363
exports[`TextInput.vue messages should show error message if provided 1`] = `
64-
<div class="text-input">
64+
<div class="text-input" id="unique-id">
6565
<div class="text-input-label">
6666
some label
6767
</div>
68-
<div class="text-input-input-wrapper"><input id="unique-id" type="text" placeholder="" class="text-input-error">
68+
<div class="text-input-input-wrapper"><input type="text" placeholder="" class="text-input-error">
6969
<!---->
7070
</div>
7171
<div>
@@ -78,11 +78,11 @@ exports[`TextInput.vue messages should show error message if provided 1`] = `
7878
`;
7979
8080
exports[`TextInput.vue messages should show hint text if provided 1`] = `
81-
<div class="text-input">
81+
<div class="text-input" id="unique-id">
8282
<div class="text-input-label">
8383
some label
8484
</div>
85-
<div class="text-input-input-wrapper"><input id="unique-id" type="text" placeholder="" class="">
85+
<div class="text-input-input-wrapper"><input type="text" placeholder="" class="">
8686
<!---->
8787
</div>
8888
<div>
@@ -92,23 +92,23 @@ exports[`TextInput.vue messages should show hint text if provided 1`] = `
9292
`;
9393
9494
exports[`TextInput.vue readonly prop should set the input to readonly 1`] = `
95-
<div class="text-input">
95+
<div class="text-input" id="unique-id">
9696
<div class="text-input-label">
9797
some label
9898
</div>
99-
<div class="text-input-input-wrapper"><input id="unique-id" type="text" readonly="readonly" placeholder="" class="text-input-readonly">
99+
<div class="text-input-input-wrapper"><input type="text" readonly="readonly" placeholder="" class="text-input-readonly">
100100
<!---->
101101
</div>
102102
<!---->
103103
</div>
104104
`;
105105
106106
exports[`TextInput.vue with copy button prop should render copy button if set 1`] = `
107-
<div class="text-input">
107+
<div class="text-input" id="unique-id">
108108
<div class="text-input-label">
109109
some label
110110
</div>
111-
<div class="text-input-input-wrapper"><input id="unique-id" type="text" placeholder="" class=""> <button data-v-a8d79470="" type="button" disabled="disabled" title="Copy value" class="button-vue text-input-copy-value button-vue--icon-and-text button-vue--vue-secondary"><span data-v-a8d79470="" class="button-vue__wrapper"><span data-v-a8d79470="" class="button-vue__icon"><span aria-hidden="true" aria-label="" role="img" class="material-design-icon clippy-icon" data-v-a8d79470=""><svg fill="currentColor" width="16" height="16" enable-background="new 0 0 16 16" version="1.1" viewBox="0 0 16 16" xml:space="preserve" xmlns="http://www.w3.org/2000/svg"><path d="m13 15h-11l0.0005-10h11v3.0002l1-0.0004 0.0005-5.0001c0.000058-0.5834-0.4165-1.0002-1.0005-1.0001l-3.467 0.0005c0.0008-1.183-0.9492-2.0001-2.1325-2.0001s-2.1333 0.8171-2.1333 2.0004h-3.2c-0.5834 0-1.0662 0.4166-1.0662 0.9999l-0.0005 12c-0.0000243 0.584 0.4833 1 1.0667 1l10.933-0.0005c0.584-0.001 1-0.416 1-1v-3h-1zm-8.8005-12h1.0672c0.5833 0 1.0666-0.4162 1.0666-0.9996 0-0.5833 0.4834-0.9337 1.0667-0.9337s1.0667 0.3504 1.0667 0.9337c0 0.5834 0.5333 0.9996 1.0666 0.9996h1.2667c0.517 0 1.2 0.4166 1.2 1h-9c-0.0004-0.65 0.5988-1 1.1988-1zm-1.1995 8h2v-1h-2zm7.9998-2v-2l-4 3 3.9998 3v-2l5.0002-0.00005v-2l-4.9998-0.00005zm-8 4h4v-1h-4zm6-7h-6v1h6zm-3 2h-3v1h3z"></path></svg></span></span> <span data-v-a8d79470="" class="button-vue__text">
111+
<div class="text-input-input-wrapper"><input type="text" placeholder="" class=""> <button data-v-a8d79470="" type="button" disabled="disabled" title="Copy value" class="button-vue text-input-copy-value button-vue--icon-and-text button-vue--vue-secondary"><span data-v-a8d79470="" class="button-vue__wrapper"><span data-v-a8d79470="" class="button-vue__icon"><span aria-hidden="true" aria-label="" role="img" class="material-design-icon clippy-icon" data-v-a8d79470=""><svg fill="currentColor" width="16" height="16" enable-background="new 0 0 16 16" version="1.1" viewBox="0 0 16 16" xml:space="preserve" xmlns="http://www.w3.org/2000/svg"><path d="m13 15h-11l0.0005-10h11v3.0002l1-0.0004 0.0005-5.0001c0.000058-0.5834-0.4165-1.0002-1.0005-1.0001l-3.467 0.0005c0.0008-1.183-0.9492-2.0001-2.1325-2.0001s-2.1333 0.8171-2.1333 2.0004h-3.2c-0.5834 0-1.0662 0.4166-1.0662 0.9999l-0.0005 12c-0.0000243 0.584 0.4833 1 1.0667 1l10.933-0.0005c0.584-0.001 1-0.416 1-1v-3h-1zm-8.8005-12h1.0672c0.5833 0 1.0666-0.4162 1.0666-0.9996 0-0.5833 0.4834-0.9337 1.0667-0.9337s1.0667 0.3504 1.0667 0.9337c0 0.5834 0.5333 0.9996 1.0666 0.9996h1.2667c0.517 0 1.2 0.4166 1.2 1h-9c-0.0004-0.65 0.5988-1 1.1988-1zm-1.1995 8h2v-1h-2zm7.9998-2v-2l-4 3 3.9998 3v-2l5.0002-0.00005v-2l-4.9998-0.00005zm-8 4h4v-1h-4zm6-7h-6v1h6zm-3 2h-3v1h3z"></path></svg></span></span> <span data-v-a8d79470="" class="button-vue__text">
112112
Copy value
113113
</span></span></button></div>
114114
<!---->

0 commit comments

Comments
 (0)