walover-line-harness-gui 0.6.0 → 0.7.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "walover-line-harness-gui",
-  "version": "0.6.0",
+  "version": "0.7.0",
   "description": "LINE Harness のセットアップを、ターミナルを開かずにブラウザから行うためのローカルツール",
   "license": "MIT",
   "type": "module",

package/src/server/index.js

@@ -213,7 +213,10 @@ async function route(req, res, pathname, method) {
     }
     const body = await readJson(req);
     try {
-      if (body?.manual === true) {
+      if (body?.manual === true && typeof body.key === "string") {
+        // 決まったキーだけ。**画面から任意の列を送らせない**（#59）
+        run.sendKey(body.key);
+      } else if (body?.manual === true) {
         // 止まっているときに、画面を見た人が自分で打つ逃げ道
         run.answerManually(String(body.text ?? ""));
       } else {

package/src/server/runner.js

@@ -25,6 +25,9 @@ const KEY_ENTER = "\r";
 const KEY_DOWN = "\x1b[B";
 const KEY_UP = "\x1b[A";
 
+/** 止まったときに画面から送れるキー。**ここに無いものは送れない** */
+const MANUAL_KEYS = { up: KEY_UP, down: KEY_DOWN, enter: KEY_ENTER };
+
 /** 画面が落ち着くまでの待ち時間。clack は1文字ごとに描き直すため、まとめてから判定する */
 const QUIET_MS = 80;
 
@@ -104,6 +107,8 @@ export class SetupRun extends EventEmitter {
     this.halt = null;
     /** 無反応を見張る時計。出力が来なくても判定を動かす @type {NodeJS.Timeout|null} */
     this.watchdog = null;
+    /** 人が矢印で選び直している最中か。出力が来ても停止表示を消さない */
+    this.manualHold = false;
 
     /** 直近に検出した枠 @type {import("./prompt-detector.js").DetectedPrompt|null} */
     this.detected = null;
@@ -216,6 +221,15 @@ export class SetupRun extends EventEmitter {
     this.exit = info;
     this.status = "finished";
     if (this.watchdog) clearTimeout(this.watchdog);
+
+    // 「画面が止まっています」は、終わってしまえば意味を持たない。
+    //
+    // Windows は pty の終了通知が遅れるので、最後の出力のあと・終了の前に
+    // 見張りタイマーが発火しうる。それを終了後まで持ち越すと、
+    // 完走したのに「止まっています」が残る（CI で実際に出た）。
+    //
+    // 他の理由（未知のプロンプトなど）は残す。なぜ止めたかは終わったあとも意味がある
+    if (this.halt?.reason === "no-prompt-stalled") this.halt = null;
     // 仕上げの手作業に使う値を取り出す。読めなければ端末表示のままにする
     this.completion = parseCompletion(this.term.snapshot(), {
       // 画面から読めなくても、フォームに入っていた値で補える
@@ -228,6 +242,19 @@ export class SetupRun extends EventEmitter {
   }
 
   #onData(chunk) {
+    // 「画面が止まっている」という判断は、**出力が来た時点で覆る**。
+    //
+    // 沈黙だけを根拠にしているので、動き出したら取り消すのが筋。
+    // 取り消さないと、本家が黙って作業していただけの場面で
+    // 「止まっています」が居座る（Windows の遅い pty で実際に出た）。
+    //
+    // ただし人が矢印で選び直している最中は消さない。
+    // 選択肢が動くたびに出力が来るので、押すボタンが消えてしまう
+    if (this.halt?.reason === "no-prompt-stalled" && !this.manualHold) {
+      this.halt = null;
+      this.status = "running";
+    }
+
     // **出力が来ている = 本家は動いている。**
     //
     // 進捗を「こちらが答えたとき」だけで測っていたため、本家が長く作業すると
@@ -291,7 +318,26 @@ export class SetupRun extends EventEmitter {
     this.detectedFrameId = detected ? this.#frameId(detected) : null;
 
     if (!detected || !detected.complete) {
-      // プロンプトが出ていない = 本家が作業中
+      // プロンプトが出ていない = 本家が作業中……とは限らない。
+      //
+      // **本家が呼ぶ外部コマンドは、こちらが知らない形で対話を求めてくる。**
+      // 実測では wrangler がこれを出し、画面は生きているのに操作できなくなった。
+      //
+      //   ? The project you specified does not exist ... Would you like to create it? ›
+      //   ❯   Create a new project
+      //
+      // clack の枠しか読めない以上、**形は分からなくても「止まっている」ことは分かる**
+      // 出力が途切れたまま動かないなら、黙って待たずに人へ渡す（#59）。
+      if (this.status === "running" && Date.now() - this.progressedAt > this.stuckMs) {
+        this.#haltWith(
+          "no-prompt-stalled",
+          "画面が止まっています",
+          "本家のツールが何か入力を待っているようですが、このツールでは形が分かりません。" +
+            "下の画面を見て、必要なものを送ってください。",
+          null,
+        );
+        return;
+      }
       this.spec = null;
       this.pending = null;
       if (this.status !== "running") this.status = "running";
@@ -422,6 +468,7 @@ export class SetupRun extends EventEmitter {
     this.status = "halted";
     this.pending = null;
     this.pendingSelect = null;
+    this.manualHold = false;
     this.halt = {
       reason,
       message,
@@ -571,6 +618,34 @@ export class SetupRun extends EventEmitter {
    *
    * @param {string} text
    */
+  /**
+   * 止まっているときに、決まったキーだけ送る。
+   *
+   * 選択肢を動かすには矢印キーが要るが、**画面から任意の文字列を送らせない**。
+   * ここに無いものは送れない（`\x1b[A` のような列を本文で受け取らない）。
+   */
+  sendKey(name) {
+    if (this.status !== "halted") throw new Error("止まっているときだけ送れます");
+    const key = MANUAL_KEYS[name];
+    if (!key) throw new Error("送れないキーです");
+
+    this.progressedAt = Date.now();
+    this.pty?.write(key);
+
+    // 矢印は「選び直している」だけなので、止まったままにする。
+    // 決定（Enter）で初めて先へ進む
+    if (name !== "enter") {
+      // 選択肢が動くと出力が来る。それで停止表示を消さない
+      this.manualHold = true;
+      return;
+    }
+
+    this.manualHold = false;
+    this.halt = null;
+    this.status = "running";
+    if (this.detected) this.answeredFrames.add(this.#frameId(this.detected));
+  }
+
   answerManually(text) {
     if (this.status !== "halted") throw new Error("止まっているときだけ手入力できます");
     // 人が答えたのも進捗。ここを忘れると、復帰した直後に同じ判定へ落ちる

package/src/web/index.html

@@ -772,11 +772,35 @@
         el("p", { textContent: "下の画面を見て、必要であれば自分で入力してください。" }),
       );
 
+      // **キーを押せるようにする。**
+      //
+      // 本家が呼ぶ外部コマンドは、矢印で選んで Enter で決める形の対話を出すことがある。
+      // 実測では wrangler がそれを出し、画面は生きているのに操作できなかった（#59）。
+      // 文字を打つ欄だけでは、そこから抜けられない。
+      box.append(
+        el("p", {
+          className: "cli-echo",
+          textContent:
+            "下の黒い枠が選択肢を出している場合は、↑ ↓ で選んでから「Enter を送る」を押してください。",
+        }),
+      );
+      const keys = el("div", { className: "choices" });
+      for (const [label, key] of [["↑", "up"], ["↓", "down"]]) {
+        const button = el("button", { type: "button", textContent: label });
+        button.addEventListener("click", () => answer({ manual: true, key }));
+        keys.append(button);
+      }
+      const enter = el("button", { className: "go", type: "button", textContent: "Enter を送る" });
+      enter.addEventListener("click", () => answer({ manual: true, key: "enter" }));
+      keys.append(enter);
+      box.append(keys);
+
       const input = el("input", { type: "text", autocomplete: "off" });
       const go = el("button", { className: "go", type: "button", textContent: "送信" });
       go.addEventListener("click", () =>
         answer({ manual: true, text: input.value }).then(() => (input.value = "")),
       );
+      box.append(el("p", { className: "cli-echo", textContent: "文字を打つ必要がある場合はこちら:" }));
       box.append(el("div", { className: "row" }, [el("div", { className: "row" }, [input])]));
       // 打つ内容が分からないこともある。そのときのために、やり直す道も並べる
       box.append(el("div", { className: "choices" }, [go, rerunButton("中止して最初からやり直す")]));