Skip to content

Commit b61431c

Browse files
bocembocembocembocem
authored
test: add qa attrs (#36)
1 parent 2e3823b commit b61431c

File tree

33 files changed

+132
-40
lines changed

33 files changed

+132
-40
lines changed

‎src/lib/kit/components/AccordeonCard/AccordeonCard.tsx‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -12,6 +12,7 @@ const b = block('accordeon-card');
1212

1313
export interface AccordeonCardProps {
1414
children: React.ReactNode;
15+
name: string;
1516
header: React.ReactNode;
1617
description?: string;
1718
className?: string;
@@ -24,6 +25,7 @@ export interface AccordeonCardProps {
2425
}
2526
export const AccordeonCard: React.FC<AccordeonCardProps> = ({
2627
className,
28+
name,
2729
header,
2830
description,
2931
open: propsOpen,
@@ -98,7 +100,7 @@ export const AccordeonCard: React.FC<AccordeonCardProps> = ({
98100
{headerActionsTemplate ? (
99101
<div className={b('interal-actions')}>{headerActionsTemplate}</div>
100102
) : null}
101-
<Button view="flat" onClick={handleToggle}>
103+
<Button view="flat" onClick={handleToggle} qa={`${name}-accordeon-toggler`}>
102104
<Icon
103105
className={b('toggle-icon', {open})}
104106
data={ChevronDown}

‎src/lib/kit/components/Card/Card.tsx‎

Lines changed: 7 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -12,6 +12,7 @@ const b = block('card');
1212

1313
export interface CardProps {
1414
children: React.ReactNode;
15+
name: string;
1516
title?: string | React.ReactNode;
1617
description?: string;
1718
actions?: React.ReactNode;
@@ -23,6 +24,7 @@ export interface CardProps {
2324
}
2425

2526
export const Card: React.FC<CardProps> = ({
27+
name,
2628
title: propsTitle,
2729
description,
2830
actions,
@@ -114,7 +116,11 @@ export const Card: React.FC<CardProps> = ({
114116
{actions ? <div className={b('actions')}>{actions}</div> : null}
115117
{alwaysOpen ? null : (
116118
<div className={b('toggler')}>
117-
<Button view="flat" onClick={handleToggle}>
119+
<Button
120+
view="flat"
121+
onClick={handleToggle}
122+
qa={`${name}-accordeon-toggler`}
123+
>
118124
<Icon
119125
className={b('toggler-icon', {open})}
120126
data={ChevronDown}

‎src/lib/kit/components/Inputs/ArrayBase/ArrayBase.tsx‎

Lines changed: 6 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -129,12 +129,17 @@ export const ArrayBase: ArrayInput = ({spec, name, arrayInput, input}) => {
129129
)
130130
}
131131
disabled={spec.viewSpec.disabled}
132+
qa={`${name}-init-arr`}
132133
>
133134
<Icon data={Plus} size={14} />
134135
{spec.viewSpec.layoutTitle || null}
135136
</Button>
136137
) : (
137-
<Button onClick={onItemAdd} disabled={spec.viewSpec.disabled}>
138+
<Button
139+
onClick={onItemAdd}
140+
disabled={spec.viewSpec.disabled}
141+
qa={`${name}-add-item`}
142+
>
138143
<Icon data={Plus} size={14} />
139144
{spec.viewSpec.itemLabel || null}
140145
</Button>

‎src/lib/kit/components/Inputs/CardOneOf/CardOneOf.tsx‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -38,7 +38,7 @@ export const CardOneOf: ObjectIndependentInput = (props) => {
3838

3939
const actions = React.useMemo(() => {
4040
if (isArrayItem(name)) {
41-
return <RemoveButton onDrop={input.onDrop} />;
41+
return <RemoveButton onDrop={input.onDrop} name={name} />;
4242
}
4343

4444
return;
@@ -66,6 +66,7 @@ export const CardOneOf: ObjectIndependentInput = (props) => {
6666

6767
return (
6868
<Card
69+
name={name}
6970
title={toggler}
7071
description={spec.viewSpec.layoutDescription}
7172
actions={actions}

‎src/lib/kit/components/Inputs/Checkbox/Checkbox.tsx‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,7 @@ import './Checkbox.scss';
99

1010
const b = block('checkbox');
1111

12-
export const Checkbox: BooleanInput = ({input, spec}) => {
12+
export const Checkbox: BooleanInput = ({name, input, spec}) => {
1313
const {value, onBlur, onChange, onFocus} = input;
1414

1515
const handleChange = React.useCallback(
@@ -25,6 +25,7 @@ export const Checkbox: BooleanInput = ({input, spec}) => {
2525
onBlur={onBlur}
2626
onFocus={onFocus}
2727
disabled={spec.viewSpec.disabled}
28+
qa={name}
2829
/>
2930
</div>
3031
);

‎src/lib/kit/components/Inputs/FileInput/FileInput.tsx‎

Lines changed: 12 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,7 @@ import './FileInput.scss';
1313

1414
const b = block('file-input');
1515

16-
export const FileInput: React.FC<StringInputProps> = ({input, spec}) => {
16+
export const FileInput: React.FC<StringInputProps> = ({name, input, spec}) => {
1717
const {value, onChange} = input;
1818

1919
const inputRef = React.useRef<HTMLInputElement>(null);
@@ -65,7 +65,11 @@ export const FileInput: React.FC<StringInputProps> = ({input, spec}) => {
6565

6666
return (
6767
<div className={b()}>
68-
<Button disabled={spec.viewSpec.disabled} onClick={handleClick}>
68+
<Button
69+
disabled={spec.viewSpec.disabled}
70+
onClick={handleClick}
71+
qa={`${name}-file-upload`}
72+
>
6973
{i18n('button-upload_file')}
7074
</Button>
7175
<input
@@ -80,7 +84,12 @@ export const FileInput: React.FC<StringInputProps> = ({input, spec}) => {
8084
/>
8185
<span className={b('file-name')}>{fileNameContent}</span>
8286
{value ? (
83-
<Button view="flat" onClick={handleReset} disabled={spec.viewSpec.disabled}>
87+
<Button
88+
view="flat"
89+
onClick={handleReset}
90+
disabled={spec.viewSpec.disabled}
91+
qa={`${name}-file-remove`}
92+
>
8493
<Icon data={Xmark} size={16} />
8594
</Button>
8695
) : null}

‎src/lib/kit/components/Inputs/MonacoInput/MonacoInputBase.tsx‎

Lines changed: 5 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -23,6 +23,7 @@ export interface MonacoInputBaseProps extends StringInputProps {
2323
}
2424

2525
export const MonacoInputBase: React.FC<MonacoInputBaseProps> = ({
26+
name,
2627
input,
2728
spec,
2829
card,
@@ -46,14 +47,14 @@ export const MonacoInputBase: React.FC<MonacoInputBaseProps> = ({
4647
const dialogButton = React.useMemo(() => {
4748
if (!withoutDialog) {
4849
return (
49-
<Button onClick={() => setMonacoEditorDialog(true)}>
50+
<Button onClick={() => setMonacoEditorDialog(true)} qa={`${name}-open-dialog`}>
5051
<Icon data={ChevronsExpandUpRight} size={16} />
5152
</Button>
5253
);
5354
}
5455

5556
return;
56-
}, [withoutDialog, setMonacoEditorDialog]);
57+
}, [withoutDialog, setMonacoEditorDialog, name]);
5758

5859
React.useEffect(() => onChange(monacoValue), [monacoValue]);
5960

@@ -65,7 +66,7 @@ export const MonacoInputBase: React.FC<MonacoInputBaseProps> = ({
6566

6667
return (
6768
<div className={b({card})}>
68-
<div className={b('container')}>
69+
<div className={b('container')} data-qa={name}>
6970
<MonacoHeader language={language} card={card} editButton={dialogButton} />
7071
<MonacoEditor
7172
language={language}
@@ -76,6 +77,7 @@ export const MonacoInputBase: React.FC<MonacoInputBaseProps> = ({
7677
/>
7778
</div>
7879
<MonacoInputDialog
80+
name={name}
7981
title={layoutTitle}
8082
fontSize={fontSize}
8183
value={monacoValue}

‎src/lib/kit/components/Inputs/MonacoInput/MonacoInputDialog.tsx‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -15,6 +15,7 @@ import './MonacoInputDialog.scss';
1515
const b = block('monaco-input-dialog');
1616

1717
interface MonacoInputDialogProps {
18+
name: string;
1819
visible: boolean;
1920
value: string;
2021
language?: string;
@@ -28,6 +29,7 @@ interface MonacoInputDialogProps {
2829
}
2930

3031
export const MonacoInputDialog: React.FC<MonacoInputDialogProps> = ({
32+
name,
3133
value,
3234
title,
3335
visible,
@@ -56,7 +58,7 @@ export const MonacoInputDialog: React.FC<MonacoInputDialogProps> = ({
5658
<Dialog open={visible} onClose={handleClose} className={b()}>
5759
<Dialog.Header caption={title} className={b('dialog-header')} />
5860
<Dialog.Body>
59-
<div className={b('container')}>
61+
<div className={b('container')} data-qa={`${name}-dialog`}>
6062
<MonacoHeader language={language} card={card} />
6163
<MonacoEditor
6264
language={language}

‎src/lib/kit/components/Inputs/MultiSelect/MultiSelect.tsx‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,7 @@ import './MultiSelect.scss';
99

1010
const b = block('multi-select');
1111

12-
export const MultiSelect: ArrayInput = ({input, spec}) => {
12+
export const MultiSelect: ArrayInput = ({name, input, spec}) => {
1313
const {value, onBlur, onChange, onFocus} = input;
1414

1515
const filterable = React.useMemo(() => (spec.enum?.length || 0) > 9, [spec.enum?.length]);
@@ -55,6 +55,7 @@ export const MultiSelect: ArrayInput = ({input, spec}) => {
5555
placeholder={spec.viewSpec.placeholder}
5656
filterable={filterable}
5757
multiple
58+
qa={name}
5859
/>
5960
);
6061
};

‎src/lib/kit/components/Inputs/NumberWithScale/NumberWithScale.tsx‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,7 @@ import './NumberWithScale.scss';
1111

1212
const b = block('number-with-scale');
1313

14-
const NumberWithScaleBase: React.FC<StringInputProps> = ({input, spec}) => {
14+
const NumberWithScaleBase: React.FC<StringInputProps> = ({name, input, spec}) => {
1515
const {value = '', onBlur, onFocus, onChange} = input;
1616
const {sizeParams, disabled, placeholder} = spec.viewSpec;
1717
const {defaultType, scale} = sizeParams!;
@@ -97,6 +97,7 @@ const NumberWithScaleBase: React.FC<StringInputProps> = ({input, spec}) => {
9797
onUpdate={handleChange}
9898
placeholder={placeholder}
9999
disabled={disabled}
100+
qa={name}
100101
/>
101102
<Select
102103
width="max"
@@ -105,6 +106,7 @@ const NumberWithScaleBase: React.FC<StringInputProps> = ({input, spec}) => {
105106
options={scaleOptions}
106107
onUpdate={handleScaleChange}
107108
disabled={disabled || incorrectStringNumber}
109+
qa={`${name}-scale`}
108110
/>
109111
</div>
110112
);

0 commit comments

Comments
 (0)