ATH-01-008: fix web forms not submitting correctly when pressing enter
When submitting some forms with the Enter key instead of clicking "Confirm"/etc, the form would not get submitted correctly This would in the worst case is when setting a user's password, where the new password can end up in the URL, but the password was not actually saved to the user. Signed-off-by: Jens Langhammer <jens@goauthentik.io> # Conflicts: # web/src/admin/applications/ApplicationCheckAccessForm.ts # web/src/admin/crypto/CertificateGenerateForm.ts # web/src/admin/flows/FlowImportForm.ts # web/src/admin/groups/RelatedGroupList.ts # web/src/admin/policies/PolicyTestForm.ts # web/src/admin/property-mappings/PropertyMappingTestForm.ts # web/src/admin/providers/saml/SAMLProviderImportForm.ts # web/src/admin/users/RelatedUserList.ts # web/src/admin/users/ServiceAccountForm.ts # web/src/admin/users/UserPasswordForm.ts # web/src/admin/users/UserResetEmailForm.ts # Conflicts: # web/src/admin/property-mappings/PropertyMappingTestForm.ts
This commit is contained in:
parent
143663d293
commit
9bb44055a3
|
@ -66,8 +66,8 @@ def ldap_sync_password(sender, user: User, password: str, **_):
|
||||||
if not sources.exists():
|
if not sources.exists():
|
||||||
return
|
return
|
||||||
source = sources.first()
|
source = sources.first()
|
||||||
changer = LDAPPasswordChanger(source)
|
|
||||||
try:
|
try:
|
||||||
|
changer = LDAPPasswordChanger(source)
|
||||||
changer.change_password(user, password)
|
changer.change_password(user, password)
|
||||||
except LDAPOperationResult as exc:
|
except LDAPOperationResult as exc:
|
||||||
LOGGER.warning("failed to set LDAP password", exc=exc)
|
LOGGER.warning("failed to set LDAP password", exc=exc)
|
||||||
|
|
|
@ -115,9 +115,8 @@ export class ApplicationCheckAccessForm extends Form<{ forUser: number }> {
|
||||||
`;
|
`;
|
||||||
}
|
}
|
||||||
|
|
||||||
renderForm(): TemplateResult {
|
renderInlineForm(): TemplateResult {
|
||||||
return html`<form class="pf-c-form pf-m-horizontal">
|
return html`<ak-form-element-horizontal label=${t`User`} ?required=${true} name="forUser">
|
||||||
<ak-form-element-horizontal label=${t`User`} ?required=${true} name="forUser">
|
|
||||||
<ak-search-select
|
<ak-search-select
|
||||||
.fetchObjects=${async (query?: string): Promise<User[]> => {
|
.fetchObjects=${async (query?: string): Promise<User[]> => {
|
||||||
const args: CoreUsersListRequest = {
|
const args: CoreUsersListRequest = {
|
||||||
|
@ -144,7 +143,6 @@ export class ApplicationCheckAccessForm extends Form<{ forUser: number }> {
|
||||||
>
|
>
|
||||||
</ak-search-select>
|
</ak-search-select>
|
||||||
</ak-form-element-horizontal>
|
</ak-form-element-horizontal>
|
||||||
${this.result ? this.renderResult() : html``}
|
${this.result ? this.renderResult() : html``}`;
|
||||||
</form>`;
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -21,9 +21,12 @@ export class CertificateKeyPairForm extends Form<CertificateGenerationRequest> {
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
renderForm(): TemplateResult {
|
renderInlineForm(): TemplateResult {
|
||||||
return html`<form class="pf-c-form pf-m-horizontal">
|
return html`<ak-form-element-horizontal
|
||||||
<ak-form-element-horizontal label=${t`Common Name`} name="commonName" ?required=${true}>
|
label=${t`Common Name`}
|
||||||
|
name="commonName"
|
||||||
|
?required=${true}
|
||||||
|
>
|
||||||
<input type="text" class="pf-c-form-control" required />
|
<input type="text" class="pf-c-form-control" required />
|
||||||
</ak-form-element-horizontal>
|
</ak-form-element-horizontal>
|
||||||
<ak-form-element-horizontal label=${t`Subject-alt name`} name="subjectAltName">
|
<ak-form-element-horizontal label=${t`Subject-alt name`} name="subjectAltName">
|
||||||
|
@ -38,7 +41,6 @@ export class CertificateKeyPairForm extends Form<CertificateGenerationRequest> {
|
||||||
?required=${true}
|
?required=${true}
|
||||||
>
|
>
|
||||||
<input class="pf-c-form-control" type="number" value="365" />
|
<input class="pf-c-form-control" type="number" value="365" />
|
||||||
</ak-form-element-horizontal>
|
</ak-form-element-horizontal>`;
|
||||||
</form>`;
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -87,15 +87,13 @@ export class FlowImportForm extends Form<Flow> {
|
||||||
`;
|
`;
|
||||||
}
|
}
|
||||||
|
|
||||||
renderForm(): TemplateResult {
|
renderInlineForm(): TemplateResult {
|
||||||
return html`<form class="pf-c-form pf-m-horizontal">
|
return html`<ak-form-element-horizontal label=${t`Flow`} name="flow">
|
||||||
<ak-form-element-horizontal label=${t`Flow`} name="flow">
|
|
||||||
<input type="file" value="" class="pf-c-form-control" />
|
<input type="file" value="" class="pf-c-form-control" />
|
||||||
<p class="pf-c-form__helper-text">
|
<p class="pf-c-form__helper-text">
|
||||||
${t`.yaml files, which can be found on goauthentik.io and can be exported by authentik.`}
|
${t`.yaml files, which can be found on goauthentik.io and can be exported by authentik.`}
|
||||||
</p>
|
</p>
|
||||||
</ak-form-element-horizontal>
|
</ak-form-element-horizontal>
|
||||||
${this.result ? this.renderResult() : html``}
|
${this.result ? this.renderResult() : html``}`;
|
||||||
</form>`;
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -46,9 +46,8 @@ export class RelatedGroupAdd extends Form<{ groups: string[] }> {
|
||||||
return data;
|
return data;
|
||||||
}
|
}
|
||||||
|
|
||||||
renderForm(): TemplateResult {
|
renderInlineForm(): TemplateResult {
|
||||||
return html`<form class="pf-c-form pf-m-horizontal">
|
return html`<ak-form-element-horizontal label=${t`Groups to add`} name="groups">
|
||||||
<ak-form-element-horizontal label=${t`Groups to add`} name="groups">
|
|
||||||
<div class="pf-c-input-group">
|
<div class="pf-c-input-group">
|
||||||
<ak-user-group-select-table
|
<ak-user-group-select-table
|
||||||
.confirm=${(items: Group[]) => {
|
.confirm=${(items: Group[]) => {
|
||||||
|
@ -79,8 +78,7 @@ export class RelatedGroupAdd extends Form<{ groups: string[] }> {
|
||||||
</ak-chip-group>
|
</ak-chip-group>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</ak-form-element-horizontal>
|
</ak-form-element-horizontal>`;
|
||||||
</form> `;
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -116,9 +116,8 @@ export class PolicyTestForm extends Form<PolicyTestRequest> {
|
||||||
`;
|
`;
|
||||||
}
|
}
|
||||||
|
|
||||||
renderForm(): TemplateResult {
|
renderInlineForm(): TemplateResult {
|
||||||
return html`<form class="pf-c-form pf-m-horizontal">
|
return html`<ak-form-element-horizontal label=${t`User`} ?required=${true} name="user">
|
||||||
<ak-form-element-horizontal label=${t`User`} ?required=${true} name="user">
|
|
||||||
<ak-search-select
|
<ak-search-select
|
||||||
.fetchObjects=${async (query?: string): Promise<User[]> => {
|
.fetchObjects=${async (query?: string): Promise<User[]> => {
|
||||||
const args: CoreUsersListRequest = {
|
const args: CoreUsersListRequest = {
|
||||||
|
@ -155,7 +154,6 @@ export class PolicyTestForm extends Form<PolicyTestRequest> {
|
||||||
${t`Set custom attributes using YAML or JSON.`}
|
${t`Set custom attributes using YAML or JSON.`}
|
||||||
</p>
|
</p>
|
||||||
</ak-form-element-horizontal>
|
</ak-form-element-horizontal>
|
||||||
${this.result ? this.renderResult() : html``}
|
${this.result ? this.renderResult() : html``}`;
|
||||||
</form>`;
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -119,9 +119,8 @@ export class PolicyTestForm extends Form<PolicyTestRequest> {
|
||||||
`;
|
`;
|
||||||
}
|
}
|
||||||
|
|
||||||
renderForm(): TemplateResult {
|
renderInlineForm(): TemplateResult {
|
||||||
return html`<form class="pf-c-form pf-m-horizontal">
|
return html`<ak-form-element-horizontal label=${t`User`} ?required=${true} name="user">
|
||||||
<ak-form-element-horizontal label=${t`User`} ?required=${true} name="user">
|
|
||||||
<ak-search-select
|
<ak-search-select
|
||||||
.fetchObjects=${async (query?: string): Promise<User[]> => {
|
.fetchObjects=${async (query?: string): Promise<User[]> => {
|
||||||
const args: CoreUsersListRequest = {
|
const args: CoreUsersListRequest = {
|
||||||
|
@ -156,7 +155,6 @@ export class PolicyTestForm extends Form<PolicyTestRequest> {
|
||||||
</ak-codemirror>
|
</ak-codemirror>
|
||||||
<p class="pf-c-form__helper-text">${this.renderExampleButtons()}</p>
|
<p class="pf-c-form__helper-text">${this.renderExampleButtons()}</p>
|
||||||
</ak-form-element-horizontal>
|
</ak-form-element-horizontal>
|
||||||
${this.result ? this.renderResult() : html``}
|
${this.result ? this.renderResult() : html``}`;
|
||||||
</form>`;
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -37,9 +37,8 @@ export class SAMLProviderImportForm extends Form<SAMLProvider> {
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
renderForm(): TemplateResult {
|
renderInlineForm(): TemplateResult {
|
||||||
return html`<form class="pf-c-form pf-m-horizontal">
|
return html`<ak-form-element-horizontal label=${t`Name`} ?required=${true} name="name">
|
||||||
<ak-form-element-horizontal label=${t`Name`} ?required=${true} name="name">
|
|
||||||
<input type="text" class="pf-c-form-control" required />
|
<input type="text" class="pf-c-form-control" required />
|
||||||
</ak-form-element-horizontal>
|
</ak-form-element-horizontal>
|
||||||
<ak-form-element-horizontal
|
<ak-form-element-horizontal
|
||||||
|
@ -77,7 +76,6 @@ export class SAMLProviderImportForm extends Form<SAMLProvider> {
|
||||||
|
|
||||||
<ak-form-element-horizontal label=${t`Metadata`} name="metadata">
|
<ak-form-element-horizontal label=${t`Metadata`} name="metadata">
|
||||||
<input type="file" value="" class="pf-c-form-control" />
|
<input type="file" value="" class="pf-c-form-control" />
|
||||||
</ak-form-element-horizontal>
|
</ak-form-element-horizontal>`;
|
||||||
</form>`;
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -59,9 +59,8 @@ export class RelatedUserAdd extends Form<{ users: number[] }> {
|
||||||
return data;
|
return data;
|
||||||
}
|
}
|
||||||
|
|
||||||
renderForm(): TemplateResult {
|
renderInlineForm(): TemplateResult {
|
||||||
return html`<form class="pf-c-form pf-m-horizontal">
|
return html`${this.group?.isSuperuser ? html`` : html``}
|
||||||
${this.group?.isSuperuser ? html`` : html``}
|
|
||||||
<ak-form-element-horizontal label=${t`Users to add`} name="users">
|
<ak-form-element-horizontal label=${t`Users to add`} name="users">
|
||||||
<div class="pf-c-input-group">
|
<div class="pf-c-input-group">
|
||||||
<ak-group-member-select-table
|
<ak-group-member-select-table
|
||||||
|
@ -93,8 +92,7 @@ export class RelatedUserAdd extends Form<{ users: number[] }> {
|
||||||
</ak-chip-group>
|
</ak-chip-group>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</ak-form-element-horizontal>
|
</ak-form-element-horizontal>`;
|
||||||
</form> `;
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -35,9 +35,8 @@ export class ServiceAccountForm extends Form<UserServiceAccountRequest> {
|
||||||
this.result = undefined;
|
this.result = undefined;
|
||||||
}
|
}
|
||||||
|
|
||||||
renderRequestForm(): TemplateResult {
|
renderInlineForm(): TemplateResult {
|
||||||
return html`<form class="pf-c-form pf-m-horizontal">
|
return html`<ak-form-element-horizontal label=${t`Username`} ?required=${true} name="name">
|
||||||
<ak-form-element-horizontal label=${t`Username`} ?required=${true} name="name">
|
|
||||||
<input type="text" value="" class="pf-c-form-control" required />
|
<input type="text" value="" class="pf-c-form-control" required />
|
||||||
<p class="pf-c-form__helper-text">
|
<p class="pf-c-form__helper-text">
|
||||||
${t`User's primary identifier. 150 characters or fewer.`}
|
${t`User's primary identifier. 150 characters or fewer.`}
|
||||||
|
@ -78,8 +77,7 @@ export class ServiceAccountForm extends Form<UserServiceAccountRequest> {
|
||||||
value="${dateTimeLocal(new Date(Date.now() + 1000 * 60 ** 2 * 24 * 360))}"
|
value="${dateTimeLocal(new Date(Date.now() + 1000 * 60 ** 2 * 24 * 360))}"
|
||||||
class="pf-c-form-control"
|
class="pf-c-form-control"
|
||||||
/>
|
/>
|
||||||
</ak-form-element-horizontal>
|
</ak-form-element-horizontal>`;
|
||||||
</form>`;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
renderResponseForm(): TemplateResult {
|
renderResponseForm(): TemplateResult {
|
||||||
|
@ -113,6 +111,6 @@ export class ServiceAccountForm extends Form<UserServiceAccountRequest> {
|
||||||
if (this.result) {
|
if (this.result) {
|
||||||
return this.renderResponseForm();
|
return this.renderResponseForm();
|
||||||
}
|
}
|
||||||
return this.renderRequestForm();
|
return super.renderForm();
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -26,11 +26,13 @@ export class UserPasswordForm extends Form<UserPasswordSetRequest> {
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
renderForm(): TemplateResult {
|
renderInlineForm(): TemplateResult {
|
||||||
return html`<form class="pf-c-form pf-m-horizontal">
|
return html`<ak-form-element-horizontal
|
||||||
<ak-form-element-horizontal label=${t`Password`} ?required=${true} name="password">
|
label=${t`Password`}
|
||||||
|
?required=${true}
|
||||||
|
name="password"
|
||||||
|
>
|
||||||
<input type="password" value="" class="pf-c-form-control" required />
|
<input type="password" value="" class="pf-c-form-control" required />
|
||||||
</ak-form-element-horizontal>
|
</ak-form-element-horizontal>`;
|
||||||
</form>`;
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -32,9 +32,12 @@ export class UserResetEmailForm extends Form<CoreUsersRecoveryEmailRetrieveReque
|
||||||
return new CoreApi(DEFAULT_CONFIG).coreUsersRecoveryEmailRetrieve(data);
|
return new CoreApi(DEFAULT_CONFIG).coreUsersRecoveryEmailRetrieve(data);
|
||||||
}
|
}
|
||||||
|
|
||||||
renderForm(): TemplateResult {
|
renderInlineForm(): TemplateResult {
|
||||||
return html`<form class="pf-c-form pf-m-horizontal">
|
return html`<ak-form-element-horizontal
|
||||||
<ak-form-element-horizontal label=${t`Email stage`} ?required=${true} name="emailStage">
|
label=${t`Email stage`}
|
||||||
|
?required=${true}
|
||||||
|
name="emailStage"
|
||||||
|
>
|
||||||
<ak-search-select
|
<ak-search-select
|
||||||
.fetchObjects=${async (query?: string): Promise<Stage[]> => {
|
.fetchObjects=${async (query?: string): Promise<Stage[]> => {
|
||||||
const args: StagesAllListRequest = {
|
const args: StagesAllListRequest = {
|
||||||
|
@ -57,7 +60,6 @@ export class UserResetEmailForm extends Form<CoreUsersRecoveryEmailRetrieveReque
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
</ak-search-select>
|
</ak-search-select>
|
||||||
</ak-form-element-horizontal>
|
</ak-form-element-horizontal>`;
|
||||||
</form>`;
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -283,9 +283,23 @@ export abstract class Form<T> extends AKElement {
|
||||||
}
|
}
|
||||||
|
|
||||||
renderForm(): TemplateResult {
|
renderForm(): TemplateResult {
|
||||||
|
const inline = this.renderInlineForm();
|
||||||
|
if (inline) {
|
||||||
|
return html`<form class="pf-c-form pf-m-horizontal" @submit=${this.submit}>
|
||||||
|
${inline}
|
||||||
|
</form>`;
|
||||||
|
}
|
||||||
return html`<slot></slot>`;
|
return html`<slot></slot>`;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Inline form render callback when inheriting this class, should be overwritten
|
||||||
|
* instead of `this.renderForm`
|
||||||
|
*/
|
||||||
|
renderInlineForm(): TemplateResult | undefined {
|
||||||
|
return undefined;
|
||||||
|
}
|
||||||
|
|
||||||
renderNonFieldErrors(): TemplateResult {
|
renderNonFieldErrors(): TemplateResult {
|
||||||
if (!this.nonFieldErrors) {
|
if (!this.nonFieldErrors) {
|
||||||
return html``;
|
return html``;
|
||||||
|
|
Reference in New Issue