From f1b679314514f4eefb2097ab256e23b1e87e7a38 Mon Sep 17 00:00:00 2001 From: Ken Sternberg <133134217+kensternberg-authentik@users.noreply.github.com> Date: Wed, 13 Dec 2023 06:33:47 -0800 Subject: [PATCH] web: fix turnstile types after update (#7854) * web: fix turnstile types after update After running 'npm update' on the dev tree, the build started to fail with these options and types no longer being set correctly in the source tree. I have explicitly included the Turnstile object as a sub-component of Window, and modified the CaptchaStage to understand the TurnstileObject and TurnstileOptions, and the build now completes. * eslint says to prefer this format * Google recaptcha (aka Turnstile) doesn't understand the "invisible" setting; that's purely an HCaptcha thing. * web: removing the typecast means I no longer need the type. * Locking pyright to 1.1.338 and maintaining it. * web: locking down hard After reading [this guide](https://medium.com/@anjusha.khandavalli/decoding-commonly-used-symbols-in-package-json-file-e08f3939c9e4), I've locked down the version of pyright to a specific and immovable version until we can get a better read on how the Pyright upgrade breaks things. * Update is specific to package-lock.json. Signed-off-by: Jens Langhammer --------- Signed-off-by: Jens Langhammer --- web/package-lock.json | 10 +++++----- web/package.json | 6 +++--- web/src/flow/stages/captcha/CaptchaStage.ts | 9 ++++++--- web/src/global.d.ts | 1 + 4 files changed, 15 insertions(+), 11 deletions(-) diff --git a/web/package-lock.json b/web/package-lock.json index 868cafb86..17f30aee1 100644 --- a/web/package-lock.json +++ b/web/package-lock.json @@ -87,7 +87,7 @@ "npm-run-all": "^4.1.5", "prettier": "^3.1.1", "pseudolocale": "^2.0.0", - "pyright": "^1.1.338", + "pyright": "=1.1.338", "react": "^18.2.0", "react-dom": "^18.2.0", "rollup": "^4.8.0", @@ -98,7 +98,7 @@ "storybook-addon-mock": "^4.3.0", "ts-lit-plugin": "^2.0.1", "tslib": "^2.6.2", - "turnstile-types": "^1.1.3", + "turnstile-types": "^1.2.0", "typescript": "^5.3.3", "vite-tsconfig-paths": "^4.2.2" }, @@ -18195,9 +18195,9 @@ } }, "node_modules/turnstile-types": { - "version": "1.1.3", - "resolved": "https://registry.npmjs.org/turnstile-types/-/turnstile-types-1.1.3.tgz", - "integrity": "sha512-hurCjOLYMYU9OmUY2JX/ewHBcadUfOhHX1XgLx9A9Ig5TFl2NGqoyM4EyfaaClsROr95cT868rkgzxCvSCcY6A==", + "version": "1.2.0", + "resolved": "https://registry.npmjs.org/turnstile-types/-/turnstile-types-1.2.0.tgz", + "integrity": "sha512-cTtNEtCYpcXeXR5AOD0YR0xZpXk1iZeTOuXT5vAGNowGGdgapC+k6m/lOVSkmDOUopZmPtmu311XeULIro4gUA==", "dev": true }, "node_modules/type-check": { diff --git a/web/package.json b/web/package.json index c10417206..f6f04c27b 100644 --- a/web/package.json +++ b/web/package.json @@ -88,8 +88,8 @@ "@storybook/api": "^7.6.4", "@storybook/blocks": "^7.6.4", "@storybook/manager-api": "^7.6.4", - "@storybook/web-components-vite": "^7.6.4", "@storybook/web-components": "^7.6.4", + "@storybook/web-components-vite": "^7.6.4", "@trivago/prettier-plugin-sort-imports": "^4.3.0", "@types/chart.js": "^2.9.41", "@types/codemirror": "5.60.15", @@ -109,7 +109,7 @@ "npm-run-all": "^4.1.5", "prettier": "^3.1.1", "pseudolocale": "^2.0.0", - "pyright": "^1.1.338", + "pyright": "=1.1.338", "react": "^18.2.0", "react-dom": "^18.2.0", "rollup": "^4.8.0", @@ -120,7 +120,7 @@ "storybook-addon-mock": "^4.3.0", "ts-lit-plugin": "^2.0.1", "tslib": "^2.6.2", - "turnstile-types": "^1.1.3", + "turnstile-types": "^1.2.0", "typescript": "^5.3.3", "vite-tsconfig-paths": "^4.2.2" }, diff --git a/web/src/flow/stages/captcha/CaptchaStage.ts b/web/src/flow/stages/captcha/CaptchaStage.ts index 7690fc626..753bda99c 100644 --- a/web/src/flow/stages/captcha/CaptchaStage.ts +++ b/web/src/flow/stages/captcha/CaptchaStage.ts @@ -1,11 +1,11 @@ /// -/// import "@goauthentik/elements/EmptyState"; import { PFSize } from "@goauthentik/elements/Spinner"; import "@goauthentik/elements/forms/FormElement"; import "@goauthentik/flow/FormStatic"; import "@goauthentik/flow/stages/access_denied/AccessDeniedStage"; import { BaseStage } from "@goauthentik/flow/stages/base"; +import type { TurnstileObject } from "turnstile-types"; import { msg } from "@lit/localize"; import { CSSResult, TemplateResult, html } from "lit"; @@ -21,6 +21,10 @@ import PFBase from "@patternfly/patternfly/patternfly-base.css"; import { CaptchaChallenge, CaptchaChallengeResponseRequest } from "@goauthentik/api"; +interface TurnstileWindow extends Window { + turnstile: TurnstileObject; +} + @customElement("ak-stage-captcha") export class CaptchaStage extends BaseStage { static get styles(): CSSResult[] { @@ -110,9 +114,8 @@ export class CaptchaStage extends BaseStage { this.host?.submit({ token: token, diff --git a/web/src/global.d.ts b/web/src/global.d.ts index b7b3dfdf8..059e86815 100644 --- a/web/src/global.d.ts +++ b/web/src/global.d.ts @@ -1,4 +1,5 @@ declare module "*.css"; + declare module "*.md" { const html: string; const metadata: { [key: string]: string };