Skip to content

Commit fe27d9c

Browse files
kresimir-cokokresimir-coko
committed
4858 - playwright - fix integer locator after changing input type
1 parent b18f92a commit fe27d9c

6 files changed

Lines changed: 109 additions & 36 deletions

File tree

‎client/test/playwright/pages/workflowPage.ts‎

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -106,6 +106,10 @@ export class WorkflowPage {
106106
return this.arrayPropertyItemAt(index).getByRole('textbox');
107107
}
108108

109+
arrayPropertyItemSpinbuttonAt(index: number): Locator {
110+
return this.arrayPropertyItemAt(index).getByRole('spinbutton');
111+
}
112+
109113
async addArrayItemsToReachRowCount({
110114
itemType = 'STRING',
111115
targetRowCount,

‎client/test/playwright/tests/properties/arrayProperty.spec.ts‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -402,15 +402,15 @@ test.describe('ArrayProperty - Array property type (ArrayProperty.tsx)', () => {
402402
});
403403

404404
await test.step('Set first INTEGER row to a value and leave the second INTEGER row empty', async () => {
405-
const firstIntegerInput = workflowPage.arrayPropertyItemTextboxAt(1);
405+
const firstIntegerInput = workflowPage.arrayPropertyItemSpinbuttonAt(1);
406406

407407
await replaceMentionsInputValue({
408408
input: firstIntegerInput,
409409
page: authenticatedPage,
410410
value: valueOnDeletedIntegerRow,
411411
});
412412

413-
const secondIntegerInput = workflowPage.arrayPropertyItemTextboxAt(2);
413+
const secondIntegerInput = workflowPage.arrayPropertyItemSpinbuttonAt(2);
414414

415415
await replaceMentionsInputValue({
416416
input: secondIntegerInput,
@@ -434,7 +434,7 @@ test.describe('ArrayProperty - Array property type (ArrayProperty.tsx)', () => {
434434

435435
await expect(arrayItems).toHaveCount(2);
436436

437-
const remainingIntegerRowAfterDeleted = workflowPage.arrayPropertyItemTextboxAt(1);
437+
const remainingIntegerRowAfterDeleted = workflowPage.arrayPropertyItemSpinbuttonAt(1);
438438

439439
await expect(remainingIntegerRowAfterDeleted).toHaveValue('');
440440
});

‎client/test/playwright/tests/properties/objectProperty.spec.ts‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -78,7 +78,7 @@ test.describe('ObjectProperty - Object property type (ObjectProperty.tsx)', () =
7878
const integerProperty =
7979
workflowPage.firstTaskComponentConfigurationPanel.getByLabel('Integer property');
8080

81-
const integerInput = integerProperty.getByRole('textbox');
81+
const integerInput = integerProperty.getByRole('spinbutton');
8282

8383
await expect(integerInput).toHaveValue(expectedValues.Integer);
8484
});

‎client/test/playwright/tests/properties/propertyPersistence.spec.ts‎

Lines changed: 8 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,7 @@ import {WorkflowPage} from '../../pages/workflowPage';
55
import sampleWorkflow from '../../sampleWorkflow.json';
66
import {clickAndExpectToBeVisible} from '../../utils/clickAndExpectToBeVisible';
77
import {type TestProjectI, type TestWorkflowI} from '../../utils/projectUtils';
8+
import {fillPropertyInput} from '../../utils/propertyValidationUtils';
89
import {getWorkflowDefinition, openPropertiesTab, reopenConfigurationPanel} from '../../utils/workflowUtils';
910

1011
export const test = mergeTests(loginTest(), projectTest, importWorkflowTest);
@@ -69,7 +70,7 @@ test.describe('Reading from Workflow Definition', () => {
6970
await test.step('integer property', async () => {
7071
const integerProperty = configurationPanel.getByLabel('Integer property');
7172

72-
const integerInput = integerProperty.getByRole('textbox');
73+
const integerInput = integerProperty.getByRole('spinbutton');
7374

7475
await expect(integerInput).toHaveValue(expectedValues.Integer);
7576
});
@@ -216,6 +217,10 @@ test.describe('Saving to Workflow Definition', () => {
216217

217218
expect(expectedPropertyType).toBe('object');
218219
expect(propertyInputValue).toBe(expectedPropertyValue[0].toString());
220+
} else if (expectedPropertyName === 'Integer') {
221+
const integerInput = property.getByRole('spinbutton');
222+
223+
await expect(integerInput).toHaveValue(expectedPropertyValue!.toString());
219224
} else {
220225
const propertyInputValue = await propertyInput.inputValue();
221226

@@ -244,7 +249,7 @@ test.describe('Saving to Workflow Definition', () => {
244249
test('should save basic INTEGER property', async () => {
245250
const integerProperty = configurationPanel.getByLabel('Integer property');
246251

247-
const integerInput = integerProperty.getByRole('textbox');
252+
const integerInput = integerProperty.getByRole('spinbutton');
248253

249254
const testValue = 123;
250255

@@ -259,7 +264,7 @@ test.describe('Saving to Workflow Definition', () => {
259264
test('should save negative value to the INTEGER property', async () => {
260265
const integerProperty = configurationPanel.getByLabel('Integer property');
261266

262-
const integerInput = integerProperty.getByRole('textbox');
267+
const integerInput = integerProperty.getByRole('spinbutton');
263268

264269
const testValue = -123;
265270

‎client/test/playwright/tests/properties/propertyValidation.spec.ts‎

Lines changed: 74 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -27,7 +27,7 @@ test.describe('Property validation - string', () => {
2727
test.describe('String Regular Expression', () => {
2828
test('should show validation error when value does not match regex (only letters allowed)', async () => {
2929
await test.step('Enter invalid value', async () => {
30-
await fillPropertyInput(configurationPanel, 'stringRegEx property', '123');
30+
await fillPropertyInput({configurationPanel, propertyLabel: 'stringRegEx property', value: '123'});
3131
});
3232

3333
await test.step('Assert validation error', async () => {
@@ -41,7 +41,7 @@ test.describe('Property validation - string', () => {
4141

4242
test('should clear regex validation error when value matches (letters only)', async () => {
4343
await test.step('Enter invalid value', async () => {
44-
await fillPropertyInput(configurationPanel, 'stringRegEx property', '12');
44+
await fillPropertyInput({configurationPanel, propertyLabel: 'stringRegEx property', value: '12'});
4545
});
4646

4747
await test.step('Assert validation error', async () => {
@@ -53,7 +53,7 @@ test.describe('Property validation - string', () => {
5353
});
5454

5555
await test.step('Enter valid value', async () => {
56-
await fillPropertyInput(configurationPanel, 'stringRegEx property', 'ab');
56+
await fillPropertyInput({configurationPanel, propertyLabel: 'stringRegEx property', value: 'ab'});
5757
});
5858

5959
await test.step('Assert no validation error', async () => {
@@ -63,7 +63,7 @@ test.describe('Property validation - string', () => {
6363

6464
test('should not show validation error when value matches regex', async () => {
6565
await test.step('Enter valid value', async () => {
66-
await fillPropertyInput(configurationPanel, 'stringRegEx property', 'abc');
66+
await fillPropertyInput({configurationPanel, propertyLabel: 'stringRegEx property', value: 'abc'});
6767
});
6868

6969
await test.step('Assert no validation error', async () => {
@@ -75,7 +75,7 @@ test.describe('Property validation - string', () => {
7575
test.describe('String Min Length', () => {
7676
test('should show validation error when string length is below minLength', async () => {
7777
await test.step('Enter value below minLength', async () => {
78-
await fillPropertyInput(configurationPanel, 'stringMinLength property', 'a');
78+
await fillPropertyInput({configurationPanel, propertyLabel: 'stringMinLength property', value: 'a'});
7979
});
8080

8181
await test.step('Assert validation error', async () => {
@@ -89,7 +89,11 @@ test.describe('Property validation - string', () => {
8989

9090
test('should not show validation error when string length meets minLength', async () => {
9191
await test.step('Enter value meeting minLength', async () => {
92-
await fillPropertyInput(configurationPanel, 'stringMinLength property', 'abcde');
92+
await fillPropertyInput({
93+
configurationPanel,
94+
propertyLabel: 'stringMinLength property',
95+
value: 'abcde',
96+
});
9397
});
9498

9599
await test.step('Assert no validation error', async () => {
@@ -101,7 +105,11 @@ test.describe('Property validation - string', () => {
101105
test.describe('String Max Length', () => {
102106
test('should show validation error when string length exceeds maxLength', async () => {
103107
await test.step('Enter value exceeding maxLength', async () => {
104-
await fillPropertyInput(configurationPanel, 'stringMaxLength property', 'abcdef');
108+
await fillPropertyInput({
109+
configurationPanel,
110+
propertyLabel: 'stringMaxLength property',
111+
value: 'abcdef',
112+
});
105113
});
106114

107115
await test.step('Assert validation error', async () => {
@@ -115,7 +123,7 @@ test.describe('Property validation - string', () => {
115123

116124
test('should not show validation error when string length is within maxLength', async () => {
117125
await test.step('Enter value within maxLength', async () => {
118-
await fillPropertyInput(configurationPanel, 'stringMaxLength property', 'abc');
126+
await fillPropertyInput({configurationPanel, propertyLabel: 'stringMaxLength property', value: 'abc'});
119127
});
120128

121129
await test.step('Assert no validation error', async () => {
@@ -140,7 +148,12 @@ test.describe('Property validation - numeric', () => {
140148
test.describe('Integer Max Value', () => {
141149
test('should show validation error when value exceeds maxValue', async () => {
142150
await test.step('Enter value exceeding maxValue', async () => {
143-
await fillPropertyInput(configurationPanel, 'integerMaxValue property', '11');
151+
await fillPropertyInput({
152+
configurationPanel,
153+
inputRole: 'spinbutton',
154+
propertyLabel: 'integerMaxValue property',
155+
value: '11',
156+
});
144157
});
145158

146159
await test.step('Assert validation error', async () => {
@@ -154,7 +167,12 @@ test.describe('Property validation - numeric', () => {
154167

155168
test('should not show validation error when value is within maxValue', async () => {
156169
await test.step('Enter value within maxValue', async () => {
157-
await fillPropertyInput(configurationPanel, 'integerMaxValue property', '10');
170+
await fillPropertyInput({
171+
configurationPanel,
172+
inputRole: 'spinbutton',
173+
propertyLabel: 'integerMaxValue property',
174+
value: '10',
175+
});
158176
});
159177

160178
await test.step('Assert no validation error', async () => {
@@ -166,7 +184,12 @@ test.describe('Property validation - numeric', () => {
166184
test.describe('Integer Min Value', () => {
167185
test('should show validation error when value is below minValue', async () => {
168186
await test.step('Enter value below minValue', async () => {
169-
await fillPropertyInput(configurationPanel, 'integerMinValue property', '9');
187+
await fillPropertyInput({
188+
configurationPanel,
189+
inputRole: 'spinbutton',
190+
propertyLabel: 'integerMinValue property',
191+
value: '9',
192+
});
170193
});
171194

172195
await test.step('Assert validation error', async () => {
@@ -180,7 +203,12 @@ test.describe('Property validation - numeric', () => {
180203

181204
test('should not show validation error when value meets minValue', async () => {
182205
await test.step('Enter value meeting minValue', async () => {
183-
await fillPropertyInput(configurationPanel, 'integerMinValue property', '10');
206+
await fillPropertyInput({
207+
configurationPanel,
208+
inputRole: 'spinbutton',
209+
propertyLabel: 'integerMinValue property',
210+
value: '10',
211+
});
184212
});
185213

186214
await test.step('Assert no validation error', async () => {
@@ -192,7 +220,7 @@ test.describe('Property validation - numeric', () => {
192220
test.describe('Number Max Value', () => {
193221
test('should show validation error when value exceeds maxValue', async () => {
194222
await test.step('Enter value exceeding maxValue', async () => {
195-
await fillPropertyInput(configurationPanel, 'numberMaxValue property', '6');
223+
await fillPropertyInput({configurationPanel, propertyLabel: 'numberMaxValue property', value: '6'});
196224
});
197225

198226
await test.step('Assert validation error', async () => {
@@ -206,7 +234,7 @@ test.describe('Property validation - numeric', () => {
206234

207235
test('should not show validation error when value is within maxValue', async () => {
208236
await test.step('Enter value within maxValue', async () => {
209-
await fillPropertyInput(configurationPanel, 'numberMaxValue property', '5');
237+
await fillPropertyInput({configurationPanel, propertyLabel: 'numberMaxValue property', value: '5'});
210238
});
211239

212240
await test.step('Assert no validation error', async () => {
@@ -218,7 +246,7 @@ test.describe('Property validation - numeric', () => {
218246
test.describe('Number Min Value', () => {
219247
test('should show validation error when value is below minValue', async () => {
220248
await test.step('Enter value below minValue', async () => {
221-
await fillPropertyInput(configurationPanel, 'numberMinValue property', '4');
249+
await fillPropertyInput({configurationPanel, propertyLabel: 'numberMinValue property', value: '4'});
222250
});
223251

224252
await test.step('Assert validation error', async () => {
@@ -232,7 +260,7 @@ test.describe('Property validation - numeric', () => {
232260

233261
test('should not show validation error when value meets minValue', async () => {
234262
await test.step('Enter value meeting minValue', async () => {
235-
await fillPropertyInput(configurationPanel, 'numberMinValue property', '5');
263+
await fillPropertyInput({configurationPanel, propertyLabel: 'numberMinValue property', value: '5'});
236264
});
237265

238266
await test.step('Assert no validation error', async () => {
@@ -244,7 +272,11 @@ test.describe('Property validation - numeric', () => {
244272
test.describe('Number max decimal places', () => {
245273
test('should show validation error when decimal places exceed maxNumberPrecision', async () => {
246274
await test.step('Enter value with too many decimal places', async () => {
247-
await fillPropertyInput(configurationPanel, 'numberMaxNumPrecision property', '1.123');
275+
await fillPropertyInput({
276+
configurationPanel,
277+
propertyLabel: 'numberMaxNumPrecision property',
278+
value: '1.123',
279+
});
248280
});
249281

250282
await test.step('Assert validation error', async () => {
@@ -258,7 +290,11 @@ test.describe('Property validation - numeric', () => {
258290

259291
test('should not show validation error when decimal places are within maxNumberPrecision', async () => {
260292
await test.step('Enter value within max decimal places', async () => {
261-
await fillPropertyInput(configurationPanel, 'numberMaxNumPrecision property', '1.12');
293+
await fillPropertyInput({
294+
configurationPanel,
295+
propertyLabel: 'numberMaxNumPrecision property',
296+
value: '1.12',
297+
});
262298
});
263299

264300
await test.step('Assert no validation error', async () => {
@@ -270,7 +306,11 @@ test.describe('Property validation - numeric', () => {
270306
test.describe('Number min decimal places', () => {
271307
test('should show validation error when decimal places are below minNumberPrecision', async () => {
272308
await test.step('Enter value with too few decimal places', async () => {
273-
await fillPropertyInput(configurationPanel, 'numberMinNumPrecision property', '1.1');
309+
await fillPropertyInput({
310+
configurationPanel,
311+
propertyLabel: 'numberMinNumPrecision property',
312+
value: '1.1',
313+
});
274314
});
275315

276316
await test.step('Assert validation error', async () => {
@@ -284,7 +324,11 @@ test.describe('Property validation - numeric', () => {
284324

285325
test('should not show validation error when decimal places meet minNumberPrecision', async () => {
286326
await test.step('Enter value meeting min decimal places', async () => {
287-
await fillPropertyInput(configurationPanel, 'numberMinNumPrecision property', '1.12');
327+
await fillPropertyInput({
328+
configurationPanel,
329+
propertyLabel: 'numberMinNumPrecision property',
330+
value: '1.12',
331+
});
288332
});
289333

290334
await test.step('Assert no validation error', async () => {
@@ -296,7 +340,11 @@ test.describe('Property validation - numeric', () => {
296340
test.describe('Number precision', () => {
297341
test('should show validation error when decimal places exceed numberPrecision', async () => {
298342
await test.step('Enter value with too many decimal places', async () => {
299-
await fillPropertyInput(configurationPanel, 'numberPrecision property', '1.1234');
343+
await fillPropertyInput({
344+
configurationPanel,
345+
propertyLabel: 'numberPrecision property',
346+
value: '1.1234',
347+
});
300348
});
301349

302350
await test.step('Assert validation error', async () => {
@@ -310,7 +358,11 @@ test.describe('Property validation - numeric', () => {
310358

311359
test('should not show validation error when decimal places are within numberPrecision', async () => {
312360
await test.step('Enter value within number precision', async () => {
313-
await fillPropertyInput(configurationPanel, 'numberPrecision property', '1.123');
361+
await fillPropertyInput({
362+
configurationPanel,
363+
propertyLabel: 'numberPrecision property',
364+
value: '1.123',
365+
});
314366
});
315367

316368
await test.step('Assert no validation error', async () => {

‎client/test/playwright/utils/propertyValidationUtils.ts‎

Lines changed: 19 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,25 @@
1-
import {expect, type Locator, type Page} from '@playwright/test';
1+
import {type Locator, type Page, expect} from '@playwright/test';
22

33
import {WorkflowPage} from '../pages/workflowPage';
44
import {clickAndExpectToBeVisible} from './clickAndExpectToBeVisible';
55

6-
export async function fillPropertyInput(
7-
configurationPanel: Locator,
8-
propertyLabel: string,
9-
value: string
10-
): Promise<void> {
6+
interface FillPropertyInputProps {
7+
configurationPanel: Locator;
8+
inputRole?: 'textbox' | 'spinbutton';
9+
propertyLabel: string;
10+
value: string;
11+
}
12+
13+
export async function fillPropertyInput({
14+
configurationPanel,
15+
inputRole = 'textbox',
16+
propertyLabel,
17+
value,
18+
}: FillPropertyInputProps): Promise<void> {
1119
const property = configurationPanel.getByLabel(propertyLabel);
12-
const input = property.getByRole('textbox');
20+
21+
const input = property.getByRole(inputRole);
22+
1323
await input.clear();
1424
await input.fill(value);
1525
}
@@ -20,7 +30,9 @@ export async function assertPropertyValidation(
2030
expectedError?: string
2131
): Promise<void> {
2232
const property = configurationPanel.getByLabel(propertyLabel);
33+
2334
const alert = property.locator('[role="alert"]');
35+
2436
if (expectedError !== undefined) {
2537
await expect(alert).toBeVisible();
2638
await expect(alert).toHaveText(expectedError);

0 commit comments

Comments
 (0)