Merge pull request #2453 from AtCoder-NoviSteps/#2446

🐛 Try to fix for "SchemaError: No shape could be created for schema" (#2446)

Author: KATO-Hiro

src/lib/types/auth_forms.ts

@@ -0,0 +1,84 @@
+/**
+ * Defines validation constraints that can be applied to form fields.
+ *
+ * @interface FieldConstraints
+ * @property {number} [minlength] - Minimum number of characters required for the field value
+ * @property {number} [maxlength] - Maximum number of characters allowed for the field value
+ * @property {boolean} [required] - Whether the field is mandatory and must have a value
+ * @property {string} [pattern] - Regular expression pattern that the field value must match
+ */
+export type FieldConstraints = {
+  minlength?: number;
+  maxlength?: number;
+  required?: boolean;
+  pattern?: string;
+};
+
+export type AuthFormConstraints = {
+  username?: FieldConstraints;
+  password?: FieldConstraints;
+};
+
+/**
+ * Represents the state and data structure for authentication forms.
+ *
+ * @interface AuthForm
+ * @property {string} id - Unique identifier for the form instance
+ * @property {boolean} valid - Indicates whether the form data passes validation
+ * @property {boolean} posted - Indicates whether the form has been submitted
+ * @property {Object} data - The form input data
+ * @property {string} data.username - The username field value
+ * @property {string} data.password - The password field value
+ * @property {Record<string, string[]>} errors - Collection of validation errors keyed by field name
+ * @property {AuthFormConstraints} [constraints] - Optional validation constraints for the form
+ * @property {Record<string, unknown>} [shape] - Optional form schema or structure definition
+ * @property {string} message - General message associated with the form (success, error, etc.)
+ */
+export type AuthForm = {
+  id: string;
+  valid: boolean;
+  posted: boolean;
+  data: { username: string; password: string };
+  errors: Record<string, string[]>;
+  constraints?: AuthFormConstraints;
+  shape?: Record<string, unknown>;
+  message: string;
+};
+
+/**
+ * Represents a strategy for creating authentication forms.
+ *
+ * @interface AuthFormCreationStrategy
+ * @property {string} name - The unique identifier or display name for this creation strategy
+ * @property {() => Promise<{ form: AuthForm }>} run - Asynchronous function that executes the strategy and returns the created authentication form
+ */
+export type AuthFormCreationStrategy = {
+  name: string;
+  run: () => Promise<{ form: AuthForm }>;
+};
+
+export type AuthFormCreationStrategies = AuthFormCreationStrategy[];
+
+/**
+ * Defines a validation strategy for authentication forms.
+ *
+ * A validation strategy encapsulates the logic for validating authentication
+ * form data from HTTP requests and returning the processed form object.
+ *
+ * @example
+ * ```typescript
+ * const loginStrategy: AuthFormValidationStrategy = {
+ *   name: 'login',
+ *   run: async (request) => {
+ *     // Validation logic here
+ *     return { form: validatedForm };
+ *   }
+ * };
+ * ```
+ */
+export type AuthFormValidationStrategy = {
+  name: string;
+  run: (request: Request) => Promise<{ form: AuthForm }>;
+};
+
+export type AuthFormValidationStrategies = AuthFormValidationStrategy[];

src/lib/utils/auth_forms.ts

@@ -0,0 +1,193 @@
+import { redirect } from '@sveltejs/kit';
+
+import { superValidate } from 'sveltekit-superforms/server';
+import { zod } from 'sveltekit-superforms/adapters';
+
+import type {
+  AuthForm,
+  AuthFormCreationStrategies,
+  AuthFormValidationStrategies,
+} from '$lib/types/auth_forms';
+
+import { authSchema } from '$lib/zod/schema';
+import { SEE_OTHER } from '$lib/constants/http-response-status-codes';
+import { HOME_PAGE } from '$lib/constants/navbar-links';
+
+/**
+ * Initialize authentication form pages (login/signup)
+ * Redirects to home page if already logged in,
+ * otherwise initializes the authentication form for unauthenticated users
+ * @param locals - The application locals containing authentication state
+ * @returns { form: AuthForm } - The initialized authentication form
+ */
+export const initializeAuthForm = async (locals: App.Locals): Promise<{ form: AuthForm }> => {
+  const session = await locals.auth.validate();
+
+  if (session) {
+    redirect(SEE_OTHER, HOME_PAGE);
+  }
+
+  return await createAuthFormWithFallback();
+};
+
+/**
+ * Create authentication form with comprehensive fallback handling
+ * Tries multiple strategies until one succeeds
+ */
+export const createAuthFormWithFallback = async (): Promise<{ form: AuthForm }> => {
+  for (const strategy of formCreationStrategies) {
+    try {
+      const result = await strategy.run();
+
+      return result;
+    } catch (error) {
+      if (isDevelopmentMode()) {
+        console.warn(`Create authForm strategy: Failed to ${strategy.name}`);
+        console.warn(error instanceof Error ? (error.stack ?? error.message) : error);
+      }
+    }
+  }
+
+  // This should never be reached due to manual creation strategy
+  throw new Error('Failed to create form for authentication.');
+};
+
+/**
+ * Form creation strategies in order of preference
+ * Each strategy attempts a different approach to create a valid form
+ *
+ * See:
+ * https://superforms.rocks/migration-v2#supervalidate
+ * https://superforms.rocks/concepts/client-validation
+ * https://superforms.rocks/api#supervalidate-options
+ */
+const formCreationStrategies: AuthFormCreationStrategies = [
+  {
+    name: '(Basic case) Use standard superValidate',
+    async run() {
+      const form = await superValidate(zod(authSchema));
+      return { form: { ...form, message: '' } };
+    },
+  },
+  {
+    name: 'Create form by manually defining structure',
+    async run() {
+      const defaultForm = {
+        valid: false,
+        posted: false,
+        errors: {},
+        message: '',
+        ...createBaseAuthForm(),
+      };
+
+      return { form: { ...defaultForm, message: '' } };
+    },
+  },
+];
+
+/**
+ * Validate authentication form data with comprehensive fallback handling
+ * Tries multiple strategies until one succeeds
+ *
+ * @param request - The incoming request containing form data
+ * @returns The validated form object (bare form, suitable for actions: fail(..., { form }))
+ */
+export const validateAuthFormWithFallback = async (request: Request): Promise<AuthForm> => {
+  for (const strategy of formValidationStrategies) {
+    try {
+      const result = await strategy.run(request);
+
+      return result.form;
+    } catch (error) {
+      if (isDevelopmentMode()) {
+        console.warn(`Validate authForm strategy: Failed to ${strategy.name}`);
+        console.warn(error instanceof Error ? (error.stack ?? error.message) : error);
+      }
+    }
+  }
+
+  // This should never be reached due to fallback strategy
+  throw new Error('Failed to validate form for authentication.');
+};
+
+/**
+ * Form validation strategies for action handlers
+ * Each strategy attempts a different approach to validate form data from requests
+ */
+const formValidationStrategies: AuthFormValidationStrategies = [
+  {
+    name: '(Basic Case) Use standard superValidate with request',
+    async run(request: Request) {
+      const form = await superValidate(request, zod(authSchema));
+      return { form: { ...form, message: '' } };
+    },
+  },
+  {
+    name: 'Create fallback form manually',
+    async run(_request: Request) {
+      // Create a fallback form with error state
+      // This maintains consistency with other strategies by returning { form }
+      const fallbackForm = {
+        valid: false,
+        posted: true,
+        errors: { _form: ['ログインできませんでした。'] },
+        message: 'サーバでエラーが発生しました。本サービスの開発・運営チームまでご連絡ください。',
+        ...createBaseAuthForm(),
+      };
+
+      return { form: fallbackForm };
+    },
+  },
+];
+
+/**
+ * Helper function to validate if we're in development mode
+ * This can be mocked in tests to control logging behavior
+ */
+export const isDevelopmentMode = (): boolean => {
+  return import.meta.env.DEV;
+};
+
+/**
+ * Common form structure for authentication forms
+ * Contains constraints and shape definitions used across different form strategies
+ */
+const createBaseAuthForm = () => ({
+  id: getBaseAuthFormId(),
+  data: { username: '', password: '' },
+  constraints: {
+    username: { minlength: 3, maxlength: 24, required: true, pattern: '[\\w]*' },
+    password: {
+      minlength: 8,
+      maxlength: 128,
+      required: true,
+      pattern: '(?=.*?[a-z])(?=.*?[A-Z])(?=.*?\\d)[a-zA-Z\\d]{8,128}',
+    },
+  },
+  shape: {
+    username: { type: 'string' },
+    password: { type: 'string' },
+  },
+});
+
+/**
+ * Generates a unique identifier for authentication form elements.
+ *
+ * Uses Web Crypto API's randomUUID() when available, falling back to a
+ * timestamp-based random string for environments where crypto is unavailable.
+ *
+ * @returns A unique string identifier prefixed with 'error-fallback-form-'
+ *
+ * @example
+ * ```typescript
+ * const formId = getBaseAuthFormId();
+ * // Returns: "error-fallback-form-550e8400-e29b-41d4-a716-446655440000"
+ * // or: "error-fallback-form-1703875200000-abc123def"
+ * ```
+ */
+const getBaseAuthFormId = () => {
+  return (
+    'error-fallback-form-' +
+    (globalThis.crypto?.randomUUID?.() ?? `${Date.now()}-${Math.random().toString(36).slice(2)}`)
+  ); // Fallback when Web Crypto is unavailable
+};

src/lib/utils/authorship.ts

@@ -3,39 +3,75 @@ import { redirect } from '@sveltejs/kit';
 import { TEMPORARY_REDIRECT } from '$lib/constants/http-response-status-codes';
 import { Roles } from '$lib/types/user';
 
+/**
+ * Ensure user has a valid session or redirect to login
+ * @param locals - The application locals containing auth and user information
+ * @returns {Promise<void>}
+ */
 export const ensureSessionOrRedirect = async (locals: App.Locals): Promise<void> => {
   const session = await locals.auth.validate();
 
   if (!session) {
-    throw redirect(TEMPORARY_REDIRECT, '/login');
+    redirect(TEMPORARY_REDIRECT, '/login');
   }
 };
 
+/**
+ * Get the current logged-in user or redirect to login
+ * @param locals - The application locals containing auth and user information
+ * @returns {Promise<App.Locals['user'] | null>} - The logged-in user or null
+ */
 export const getLoggedInUser = async (locals: App.Locals): Promise<App.Locals['user'] | null> => {
   await ensureSessionOrRedirect(locals);
   const loggedInUser = locals.user;
 
   if (!loggedInUser) {
-    throw redirect(TEMPORARY_REDIRECT, '/login');
+    redirect(TEMPORARY_REDIRECT, '/login');
   }
 
   return loggedInUser;
 };
 
+/**
+ * Validate if the user has admin role
+ * @param role - User role
+ * @returns {boolean} - True if user is admin, false otherwise
+ */
 export const isAdmin = (role: Roles): boolean => {
   return role === Roles.ADMIN;
 };
 
+/**
+ * Validate if the user has authority (is the author)
+ * @param userId - The user id
+ * @param authorId - The author id
+ * @returns {boolean} - True if user has authority, false otherwise
+ */
 export const hasAuthority = (userId: string, authorId: string): boolean => {
-  return userId.toLocaleLowerCase() === authorId.toLocaleLowerCase();
+  return userId.toLowerCase() === authorId.toLowerCase();
 };
 
-// Note: 公開 + 非公開(本人のみ)の問題集が閲覧できる
+/**
+ * Validate if user can read the workbook
+ * Public workbooks can be read by anyone, private workbooks only by the author
+ * @param isPublished - Whether the workbook is published
+ * @param userId - The user id
+ * @param authorId - The author id
+ * @returns {boolean} - True if user can read, false otherwise
+ */
 export const canRead = (isPublished: boolean, userId: string, authorId: string): boolean => {
   return isPublished || hasAuthority(userId, authorId);
 };
 
-// Note: 特例として、管理者はユーザが公開している問題集を編集できる
+/**
+ * Validate if user can edit the workbook
+ * Authors can always edit their workbooks
+ * Admins can edit public workbooks as a special case
+ * @param userId - The user id
+ * @param authorId - The author id
+ * @param role - User role
+ * @returns {boolean} - True if user can edit, false otherwise
+ */
 export const canEdit = (
   userId: string,
   authorId: string,
@@ -45,7 +81,13 @@ export const canEdit = (
   return hasAuthority(userId, authorId) || (isAdmin(role) && isPublished);
 };
 
-// Note: 本人のみ削除可能
+/**
+ * Validate if user can delete the workbook
+ * Only the author can delete their workbooks
+ * @param userId - The user id
+ * @param authorId - The author id
+ * @returns {boolean} - True if user can delete, false otherwise
+ */
 export const canDelete = (userId: string, authorId: string): boolean => {
   return hasAuthority(userId, authorId);
 };