trustchain-oc1-orchestral
/
authentik
Archived
10
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

web: fix datetime-local fields throwing errors on firefox 

Signed-off-by: Jens Langhammer <jens.langhammer@beryju.org>
This commit is contained in:
Jens Langhammer 2021-09-18 15:31:48 +02:00
parent 12a523c7aa
commit 930dd51663
3 changed files with 19 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
web/src/pages/stages/invitation/InvitationForm.ts
View File

@ -6,7 +6,7 @@ import { DEFAULT_CONFIG } from "../../../api/Config";
import "../../../elements/forms/HorizontalFormElement";
import "../../../elements/CodeMirror";
import YAML from "yaml";
import { first } from "../../../utils";
import { dateTimeLocal, first } from "../../../utils";
import { ModelForm } from "../../../elements/forms/ModelForm";
@customElement("ak-invitation-form")
@ -41,7 +41,12 @@ export class InvitationForm extends ModelForm<Invitation, string> {
renderForm(): TemplateResult {
return html`<form class="pf-c-form pf-m-horizontal">
<ak-form-element-horizontal label=${t`Expires`} ?required=${true} name="expires">
<input type="date" class="pf-c-form-control" required />
<input
type="datetime-local"
class="pf-c-form-control"
required
value="${dateTimeLocal(first(this.instance?.expires, new Date()))}"
/>
</ak-form-element-horizontal>
<ak-form-element-horizontal label=${t`Attributes`} name="fixedData">
<ak-codemirror

4
web/src/pages/tokens/TokenForm.ts
View File

@ -5,7 +5,7 @@ import { html, TemplateResult } from "lit-html";
import { DEFAULT_CONFIG } from "../../api/Config";
import "../../elements/forms/HorizontalFormElement";
import "../../elements/forms/FormGroup";
import { first } from "../../utils";
import { dateTimeLocal, first } from "../../utils";
import { ModelForm } from "../../elements/forms/ModelForm";
import { until } from "lit-html/directives/until";
@ -111,7 +111,7 @@ export class TokenForm extends ModelForm<Token, string> {
<ak-form-element-horizontal label=${t`Expires on`} name="expires">
<input
type="datetime-local"
.valueAsNumber="${first(this.instance?.expires, new Date()).getTime()}"
value="${dateTimeLocal(first(this.instance?.expires, new Date()))}"
class="pf-c-form-control"
/>
</ak-form-element-horizontal>

10
web/src/utils.ts
View File

@ -87,3 +87,13 @@ export function randomString(len: number): string {
window.crypto.getRandomValues(arr);
return hexEncode(arr);
}
export function dateTimeLocal(date: Date): string {
// So for some reason, the datetime-local input field requires ISO Datetime as value
// But the standard javascript date.toISOString() returns everything with seconds and
// milliseconds, which the input field doesn't like (on chrome, on firefox its fine)
// On chrome, setting .valueAsNumber works, but that causes an error on firefox, so go
// figure.
const parts = date.toISOString().split(":");
return `${parts[0]}:${parts[1]}`;
}