Bug: Onboarding 페이지 RegExp 오류: Invalid character class

[DrumRobot]

버그 설명

Onboarding 페이지(/onboarding)에서 사용자명 입력 필드의 pattern 속성에 사용된 정규표현식이 브라우저 콘솔에서 오류를 발생시킵니다.

재현 방법

1. https://vivvers.com 접속
2. Google 또는 GitHub로 로그인
3. /onboarding 페이지로 이동
4. 브라우저 개발자 도구 콘솔 확인

콘솔 오류 메시지

Pattern attribute value ^[a-zA-Z0-9-]{3,20}$ is not a valid regular expression: 
Uncaught SyntaxError: Invalid regular expression: /^[a-zA-Z0-9-]{3,20}$/v: Invalid character class

추가 증상

• "프로필 생성하기" 버튼 클릭 시 사용자 생성 중 오류가 발생했습니다 메시지 표시

원인 분석

정규표현식 ^[a-zA-Z0-9-]{3,20}$에서 문자 클래스 [...] 내의 하이픈(-) 위치가 ES2024 RegExp v 플래그(unicodeSets 모드)와 호환되지 않습니다.

제안하는 해결 방법

하이픈을 이스케이프하거나 문자 클래스 맨 앞으로 이동:

// 방법 1: 하이픈 이스케이프
pattern="^[a-zA-Z0-9\\-]{3,20}$"

// 방법 2: 하이픈을 맨 앞으로
pattern="^[-a-zA-Z0-9]{3,20}$"

환경

• 브라우저: Chrome (최신 버전)
• OS: macOS
• 테스트 날짜: 2025-12-18