cursedbelt-server 4.30.1 → 4.32.0

package/src/server/master-lock/lockPage.spec.ts

@@ -19,6 +19,7 @@ import {
 	LOCK_SCRIPT,
 	LOCK_STYLE,
 	MASTER_LOCK_DERIVE_SOURCE,
+	MASTER_LOCK_MIN_PASSWORD_LENGTH,
 	MASTER_LOCK_REVEAL_SOURCE,
 	lockPageHtml,
 	withRevealToggles,
@@ -107,7 +108,7 @@ describe("🔴 every password field on the wall can be shown and hidden (task 07
 	};
 
 	for (const [name, html] of Object.entries(pages)) {
-		test(`${name}: one Show control per password input, each input keeping its autocomplete`, () => {
+		test(`${name}: one eye control per password input, each input keeping its autocomplete`, () => {
 			const inputs = [...html.matchAll(/<input\b[^>]*\btype="password"[^>]*>/g)].map((m) => m[0]);
 			expect(inputs.length).toBeGreaterThan(0);
 			expect((html.match(/data-reveal/g) ?? []).length).toBe(inputs.length);
@@ -117,6 +118,20 @@ describe("🔴 every password field on the wall can be shown and hidden (task 07
 		});
 	}
 
+	test("🔴 the control is an EYE, not a word, and every minimum is 6 (owner, 2026-09-24)", () => {
+		for (const html of Object.values(pages)) {
+			for (const button of html.match(/<button[^>]*data-reveal[^>]*>[\s\S]*?<\/button>/g) ?? []) {
+				expect(button).toContain('class="eye"');
+				expect(button).toContain('class="eye-off"');
+				// No visible word: strip the markup and nothing readable is left.
+				expect(button.replace(/<[^>]+>/g, "").trim()).toBe("");
+			}
+			for (const m of html.matchAll(/minlength="(\d+)"/g)) expect(m[1]).toBe("6");
+		}
+		expect(MASTER_LOCK_MIN_PASSWORD_LENGTH).toBe(6);
+		expect(LOCK_SCRIPT).toContain("const MIN_LENGTH = 6;");
+	});
+
 	test("both served scripts carry the ONE reveal source and call it", () => {
 		for (const script of [LOCK_SCRIPT, MASTER_LOCK_ACCOUNTS_SCRIPT]) {
 			expect(script).toContain(MASTER_LOCK_REVEAL_SOURCE);

package/src/server/master-lock/lockPage.ts

@@ -27,6 +27,13 @@
  */
 import { MASTER_LOCK_PATHS } from "cursedbelt-core/master-lock";
 
+/**
+ * The shortest master password the wall accepts — every `minlength` on both pages and both
+ * scripts' own checks read this one number, so a rotation cannot quietly differ from enrollment.
+ * 10 until 2026-09-24; the owner: *"make the minimum password length 6 characters"*.
+ */
+export const MASTER_LOCK_MIN_PASSWORD_LENGTH = 6;
+
 /** Everything the page needs to know about the app it is standing in front of. */
 export interface LockPageOptions {
 	/** What to call this app — "Collections", "binary-server inspector". */
@@ -88,7 +95,7 @@ export function lockPageHtml(options: LockPageOptions): string {
       <input id="ml-input" type="password" name="master-password"
              autocomplete="${enroll ? "new-password" : "current-password"}"
              autofocus required spellcheck="false" enterkeyhint="${enroll ? "next" : "go"}"${
-               enroll ? ' minlength="10"' : ""
+               enroll ? ` minlength="${MASTER_LOCK_MIN_PASSWORD_LENGTH}"` : ""
              }>
     </label>${
       enroll
@@ -97,7 +104,7 @@ export function lockPageHtml(options: LockPageOptions): string {
       <span>Confirm master password</span>
       <input id="ml-confirm" type="password" name="confirm-master-password"
              autocomplete="new-password" required spellcheck="false" enterkeyhint="go"
-             minlength="10">
+             minlength="${MASTER_LOCK_MIN_PASSWORD_LENGTH}">
     </label>
     <label class="field">
       <span>Hint <em>optional</em></span>
@@ -162,16 +169,18 @@ button.quiet[disabled]{opacity:.5}
 .hints dd{margin:2px 0 10px;color:var(--ml-muted);overflow-wrap:anywhere}
 .hints dd:last-child{margin-bottom:0}
 .secret{position:relative;display:block}
-.secret input{padding-right:68px}
-.secret .reveal{position:absolute;right:5px;top:50%;transform:translateY(-50%);width:auto;height:30px;
-  min-width:56px;padding:0 10px;border-radius:7px;background:none;color:var(--ml-muted);
-  font-size:12.5px;font-weight:600}
+.secret input{padding-right:48px}
+.secret .reveal{position:absolute;right:5px;top:50%;transform:translateY(-50%);width:36px;height:32px;
+  display:grid;place-items:center;padding:0;border-radius:7px;background:none;color:var(--ml-muted)}
+.secret .reveal svg{width:18px;height:18px}
+.secret .reveal .eye-off,.secret .reveal[aria-pressed="true"] .eye{display:none}
+.secret .reveal[aria-pressed="true"] .eye-off{display:block}
 .secret .reveal:hover{color:var(--ml-text);background:var(--ml-card)}
 .secret .reveal:focus-visible{outline:2px solid var(--ml-accent);outline-offset:1px}
 `;
 
 /**
- * 🔴 Every password field on the wall gets a Show/Hide control (task 077-438's library share) — a
+ * 🔴 Every password field on the wall gets an eye (show/hide) control (task 077-438's library share) — a
  * master password is long, typed once and never recoverable, and a typo in "choose" is a lock-out.
  *
  * Markup: {@link withRevealToggles} wraps each `type="password"` input in `.secret` with a
@@ -181,10 +190,21 @@ button.quiet[disabled]{opacity:.5}
  * CSP is `script-src 'self'` and allows no inline script (`MASTER_LOCK_CSP`, pinned by
  * `beaconNeverReachesTheWall.spec.ts`). Nothing about the CSP changes for this.
  */
+/*
+ * An eye, and an eye struck through — the owner, 2026-09-24: *"use an eye icon instead of words
+ * like 'Show'"*. Both are in the button; the stylesheet shows one by `aria-pressed`, so the
+ * script only flips state and the accessible name, never markup. Same glyphs as cursedbelt's
+ * React `SecretInput`, drawn inline because this page ships no icon font and no framework.
+ */
+const EYE =
+	'<svg class="eye" aria-hidden="true" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M2 12s3.5-7 10-7 10 7 10 7-3.5 7-10 7S2 12 2 12z"/><circle cx="12" cy="12" r="3"/></svg>';
+const EYE_OFF =
+	'<svg class="eye-off" aria-hidden="true" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M9.9 4.2A10.4 10.4 0 0 1 12 4c6.5 0 10 8 10 8a17.6 17.6 0 0 1-2.3 3.3"/><path d="M6.6 6.6C3.9 8.4 2 12 2 12s3.5 7 10 7c1.8 0 3.4-.5 4.8-1.3"/><path d="M9.9 9.9a3 3 0 0 0 4.2 4.2"/><path d="M2 2l20 20"/></svg>';
+
 export function withRevealToggles(html: string): string {
 	return html.replace(
 		/(<input\b[^>]*\btype="password"[^>]*>)/g,
-		'<span class="secret">$1<button type="button" class="reveal" data-reveal aria-label="Show password" aria-pressed="false">Show</button></span>',
+		`<span class="secret">$1<button type="button" class="reveal" data-reveal aria-label="Show password" aria-pressed="false">${EYE}${EYE_OFF}</button></span>`,
 	);
 }
 
@@ -203,7 +223,6 @@ export const MASTER_LOCK_REVEAL_SOURCE = `function wireMasterLockReveal(doc) {
       input.type = on ? "text" : "password";
       button.setAttribute("aria-pressed", on ? "true" : "false");
       button.setAttribute("aria-label", on ? "Hide password" : "Show password");
-      button.textContent = on ? "Hide" : "Show";
     };
     button.addEventListener("click", () => {
       show(input.type === "password");
@@ -292,7 +311,7 @@ const enrolling = document.body.dataset.mode === "enroll";
 
 /** The shortest password worth calling one. Matched by the input's own minlength, and
  *  checked here too because a pasted value can beat the constraint on some engines. */
-const MIN_LENGTH = 10;
+const MIN_LENGTH = ${MASTER_LOCK_MIN_PASSWORD_LENGTH};
 
 let kdf = null;
 let busy = false;