Skip to content

Commit 5822e05

Browse files
fix(LoginForm): Adjust wrapper for submit button (#12605)
1 parent 61a75d8 commit 5822e05

2 files changed

Lines changed: 81 additions & 46 deletions

File tree

packages/react-core/src/components/LoginPage/LoginForm.tsx

Lines changed: 5 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -147,9 +147,11 @@ export const LoginForm: React.FunctionComponent<LoginFormProps> = ({
147147
/>
148148
</FormGroup>
149149
)}
150-
<Button variant="primary" type="submit" onClick={onLoginButtonClick} isBlock isDisabled={isLoginButtonDisabled}>
151-
{loginButtonLabel}
152-
</Button>
150+
<FormGroup isActionGroup>
151+
<Button variant="primary" type="submit" onClick={onLoginButtonClick} isBlock isDisabled={isLoginButtonDisabled}>
152+
{loginButtonLabel}
153+
</Button>
154+
</FormGroup>
153155
</Form>
154156
);
155157
};

packages/react-core/src/components/LoginPage/__tests__/__snapshots__/LoginForm.test.tsx.snap

Lines changed: 76 additions & 43 deletions
Original file line numberDiff line numberDiff line change
@@ -4,14 +4,14 @@ exports[`LoginForm LoginForm with rememberMeLabel 1`] = `
44
<DocumentFragment>
55
<form
66
class="pf-v6-c-form"
7-
data-ouia-component-id="OUIA-Generated-Form-:r1k:"
7+
data-ouia-component-id="OUIA-Generated-Form-:r1s:"
88
data-ouia-component-type="PF6/Form"
99
data-ouia-safe="true"
1010
novalidate=""
1111
>
1212
<div
1313
class="pf-v6-c-form__group"
14-
data-ouia-component-id="OUIA-Generated-FormGroup-:r1l:"
14+
data-ouia-component-id="OUIA-Generated-FormGroup-:r1t:"
1515
data-ouia-component-type="PF6/FormGroup"
1616
data-ouia-safe="true"
1717
>
@@ -44,7 +44,7 @@ exports[`LoginForm LoginForm with rememberMeLabel 1`] = `
4444
>
4545
<input
4646
aria-invalid="false"
47-
data-ouia-component-id="OUIA-Generated-TextInputBase-:r1o:"
47+
data-ouia-component-id="OUIA-Generated-TextInputBase-:r20:"
4848
data-ouia-component-type="PF6/TextInput"
4949
data-ouia-safe="true"
5050
id="pf-login-username-id"
@@ -58,7 +58,7 @@ exports[`LoginForm LoginForm with rememberMeLabel 1`] = `
5858
</div>
5959
<div
6060
class="pf-v6-c-form__group"
61-
data-ouia-component-id="OUIA-Generated-FormGroup-:r1p:"
61+
data-ouia-component-id="OUIA-Generated-FormGroup-:r21:"
6262
data-ouia-component-type="PF6/FormGroup"
6363
data-ouia-safe="true"
6464
>
@@ -91,7 +91,7 @@ exports[`LoginForm LoginForm with rememberMeLabel 1`] = `
9191
>
9292
<input
9393
aria-invalid="false"
94-
data-ouia-component-id="OUIA-Generated-TextInputBase-:r1s:"
94+
data-ouia-component-id="OUIA-Generated-TextInputBase-:r24:"
9595
data-ouia-component-type="PF6/TextInput"
9696
data-ouia-safe="true"
9797
id="pf-login-password-id"
@@ -105,7 +105,7 @@ exports[`LoginForm LoginForm with rememberMeLabel 1`] = `
105105
</div>
106106
<div
107107
class="pf-v6-c-form__group"
108-
data-ouia-component-id="OUIA-Generated-FormGroup-:r1t:"
108+
data-ouia-component-id="OUIA-Generated-FormGroup-:r25:"
109109
data-ouia-component-type="PF6/FormGroup"
110110
data-ouia-safe="true"
111111
>
@@ -118,7 +118,7 @@ exports[`LoginForm LoginForm with rememberMeLabel 1`] = `
118118
<input
119119
aria-invalid="false"
120120
class="pf-v6-c-check__input"
121-
data-ouia-component-id="OUIA-Generated-Checkbox-:r20:"
121+
data-ouia-component-id="OUIA-Generated-Checkbox-:r28:"
122122
data-ouia-component-type="PF6/Checkbox"
123123
data-ouia-safe="true"
124124
id="pf-login-remember-me-id"
@@ -133,19 +133,30 @@ exports[`LoginForm LoginForm with rememberMeLabel 1`] = `
133133
</div>
134134
</div>
135135
</div>
136-
<button
137-
class="pf-v6-c-button pf-m-primary pf-m-block"
138-
data-ouia-component-id="OUIA-Generated-Button-primary-:r21:"
139-
data-ouia-component-type="PF6/Button"
136+
<div
137+
class="pf-v6-c-form__group pf-m-action"
138+
data-ouia-component-id="OUIA-Generated-FormGroup-:r29:"
139+
data-ouia-component-type="PF6/FormGroup"
140140
data-ouia-safe="true"
141-
type="submit"
142141
>
143-
<span
144-
class="pf-v6-c-button__text"
142+
<div
143+
class="pf-v6-c-form__group-control"
145144
>
146-
Log In
147-
</span>
148-
</button>
145+
<button
146+
class="pf-v6-c-button pf-m-primary pf-m-block"
147+
data-ouia-component-id="OUIA-Generated-Button-primary-:r2b:"
148+
data-ouia-component-type="PF6/Button"
149+
data-ouia-safe="true"
150+
type="submit"
151+
>
152+
<span
153+
class="pf-v6-c-button__text"
154+
>
155+
Log In
156+
</span>
157+
</button>
158+
</div>
159+
</div>
149160
</form>
150161
</DocumentFragment>
151162
`;
@@ -154,14 +165,14 @@ exports[`LoginForm LoginForm with show password 1`] = `
154165
<DocumentFragment>
155166
<form
156167
class="pf-v6-c-form"
157-
data-ouia-component-id="OUIA-Generated-Form-:r22:"
168+
data-ouia-component-id="OUIA-Generated-Form-:r2c:"
158169
data-ouia-component-type="PF6/Form"
159170
data-ouia-safe="true"
160171
novalidate=""
161172
>
162173
<div
163174
class="pf-v6-c-form__group"
164-
data-ouia-component-id="OUIA-Generated-FormGroup-:r23:"
175+
data-ouia-component-id="OUIA-Generated-FormGroup-:r2d:"
165176
data-ouia-component-type="PF6/FormGroup"
166177
data-ouia-safe="true"
167178
>
@@ -194,7 +205,7 @@ exports[`LoginForm LoginForm with show password 1`] = `
194205
>
195206
<input
196207
aria-invalid="false"
197-
data-ouia-component-id="OUIA-Generated-TextInputBase-:r26:"
208+
data-ouia-component-id="OUIA-Generated-TextInputBase-:r2g:"
198209
data-ouia-component-type="PF6/TextInput"
199210
data-ouia-safe="true"
200211
id="pf-login-username-id"
@@ -208,7 +219,7 @@ exports[`LoginForm LoginForm with show password 1`] = `
208219
</div>
209220
<div
210221
class="pf-v6-c-form__group"
211-
data-ouia-component-id="OUIA-Generated-FormGroup-:r27:"
222+
data-ouia-component-id="OUIA-Generated-FormGroup-:r2h:"
212223
data-ouia-component-type="PF6/FormGroup"
213224
data-ouia-safe="true"
214225
>
@@ -247,7 +258,7 @@ exports[`LoginForm LoginForm with show password 1`] = `
247258
>
248259
<input
249260
aria-invalid="false"
250-
data-ouia-component-id="OUIA-Generated-TextInputBase-:r2a:"
261+
data-ouia-component-id="OUIA-Generated-TextInputBase-:r2k:"
251262
data-ouia-component-type="PF6/TextInput"
252263
data-ouia-safe="true"
253264
id="pf-login-password-id"
@@ -264,7 +275,7 @@ exports[`LoginForm LoginForm with show password 1`] = `
264275
<button
265276
aria-label="Show password"
266277
class="pf-v6-c-button pf-m-control"
267-
data-ouia-component-id="OUIA-Generated-Button-control-:r2b:"
278+
data-ouia-component-id="OUIA-Generated-Button-control-:r2l:"
268279
data-ouia-component-type="PF6/Button"
269280
data-ouia-safe="true"
270281
type="button"
@@ -291,19 +302,30 @@ exports[`LoginForm LoginForm with show password 1`] = `
291302
</div>
292303
</div>
293304
</div>
294-
<button
295-
class="pf-v6-c-button pf-m-primary pf-m-block"
296-
data-ouia-component-id="OUIA-Generated-Button-primary-:r2c:"
297-
data-ouia-component-type="PF6/Button"
305+
<div
306+
class="pf-v6-c-form__group pf-m-action"
307+
data-ouia-component-id="OUIA-Generated-FormGroup-:r2m:"
308+
data-ouia-component-type="PF6/FormGroup"
298309
data-ouia-safe="true"
299-
type="submit"
300310
>
301-
<span
302-
class="pf-v6-c-button__text"
311+
<div
312+
class="pf-v6-c-form__group-control"
303313
>
304-
Log In
305-
</span>
306-
</button>
314+
<button
315+
class="pf-v6-c-button pf-m-primary pf-m-block"
316+
data-ouia-component-id="OUIA-Generated-Button-primary-:r2o:"
317+
data-ouia-component-type="PF6/Button"
318+
data-ouia-safe="true"
319+
type="submit"
320+
>
321+
<span
322+
class="pf-v6-c-button__text"
323+
>
324+
Log In
325+
</span>
326+
</button>
327+
</div>
328+
</div>
307329
</form>
308330
</DocumentFragment>
309331
`;
@@ -411,19 +433,30 @@ exports[`LoginForm should render Login form 1`] = `
411433
</span>
412434
</div>
413435
</div>
414-
<button
415-
class="pf-v6-c-button pf-m-primary pf-m-block"
416-
data-ouia-component-id="OUIA-Generated-Button-primary-:r9:"
417-
data-ouia-component-type="PF6/Button"
436+
<div
437+
class="pf-v6-c-form__group pf-m-action"
438+
data-ouia-component-id="OUIA-Generated-FormGroup-:r9:"
439+
data-ouia-component-type="PF6/FormGroup"
418440
data-ouia-safe="true"
419-
type="submit"
420441
>
421-
<span
422-
class="pf-v6-c-button__text"
442+
<div
443+
class="pf-v6-c-form__group-control"
423444
>
424-
Log In
425-
</span>
426-
</button>
445+
<button
446+
class="pf-v6-c-button pf-m-primary pf-m-block"
447+
data-ouia-component-id="OUIA-Generated-Button-primary-:rb:"
448+
data-ouia-component-type="PF6/Button"
449+
data-ouia-safe="true"
450+
type="submit"
451+
>
452+
<span
453+
class="pf-v6-c-button__text"
454+
>
455+
Log In
456+
</span>
457+
</button>
458+
</div>
459+
</div>
427460
</form>
428461
</DocumentFragment>
429462
`;

0 commit comments

Comments
 (0)