@mug-lab/cookie-auth-proxy 0.1.0

package/src/admin/editors.js

@@ -0,0 +1,600 @@
+/**
+ * Stubの有効/無効を切り替える。
+ */
+async function toggleStub(event, id, enabled) {
+  event.stopPropagation();
+  await api("/admin/stubs/" + id, {
+    method: "PATCH",
+    body: JSON.stringify({ enabled }),
+  });
+  await load();
+}
+
+/**
+ * 指定したStubを削除する。
+ */
+async function deleteStub(event, id) {
+  event.preventDefault();
+  event.stopPropagation();
+  await api("/admin/stubs/" + id, { method: "DELETE" });
+  await load();
+}
+
+/**
+ * Overrideの有効/無効を切り替える。
+ */
+async function toggleOverride(event, id, enabled) {
+  event.stopPropagation();
+  await api("/admin/json-overrides/" + id, {
+    method: "PATCH",
+    body: JSON.stringify({ enabled }),
+  });
+  await load();
+}
+
+/**
+ * 指定したOverrideを削除する。
+ */
+async function deleteOverride(event, id) {
+  event.preventDefault();
+  event.stopPropagation();
+  await api("/admin/json-overrides/" + id, { method: "DELETE" });
+  await load();
+}
+
+/**
+ * Stub編集フォームの内容を管理APIへ保存する。
+ */
+async function saveStub(event, id) {
+  event.preventDefault();
+  event.stopPropagation();
+  const button = event.currentTarget;
+  const root = button.closest("details");
+  try {
+    setEditorError(root, "");
+    const saved = await api("/admin/stubs/" + id, {
+      method: "PATCH",
+      body: JSON.stringify(currentStubValue(root)),
+    });
+    dirtyNewStubIds.delete(String(id));
+    flash(button);
+    lastStubs = lastStubs.map((stub) =>
+      String(stub.id) === String(id) ? saved : stub,
+    );
+    renderStubs(lastStubs);
+  } catch (error) {
+    setEditorError(root, error.message);
+  }
+}
+
+/**
+ * Stub編集フォームの現在値を保存用オブジェクトへ変換する。
+ */
+function currentStubValue(root) {
+  const method = root.querySelector('[data-field="method"]').value;
+  const headers = parseJsonObjectField(root, "headers", "Headers JSON");
+  const bodyEncoding = root.querySelector('[data-field="bodyEncoding"]').value;
+  const body = normalizeStubBodyField(root, bodyEncoding);
+  return {
+    id: root.dataset.id,
+    enabled: root.querySelector('[type="checkbox"]').checked,
+    name: root.querySelector('[data-field="name"]').value,
+    method,
+    status: Number(root.querySelector('[data-field="status"]').value),
+    pathPattern: root.querySelector('[data-field="pathPattern"]').value,
+    queryParams: parseJsonObjectField(root, "queryParams", "Query Params JSON"),
+    requestBody:
+      method === "GET"
+        ? {}
+        : parseJsonObjectField(root, "requestBody", "Request Body JSON"),
+    headers,
+    bodyEncoding,
+    body,
+    bodyBase64: root.querySelector('[data-field="bodyBase64"]')?.value || "",
+  };
+}
+
+/**
+ * Stub編集内容が変更されているか見てApplyボタン状態を更新する。
+ */
+function updateStubApplyState(root) {
+  const button = root.querySelector('[data-action="apply-stub"]');
+  if (!button) return;
+  try {
+    const original = JSON.parse(root.dataset.original);
+    const current = currentStubValue(root);
+    setEditorError(root, "");
+    button.disabled =
+      String(original.name || "Untitled stub") === current.name &&
+      original.method === current.method &&
+      Number(original.status) === current.status &&
+      original.pathPattern === current.pathPattern &&
+      JSON.stringify(original.queryParams || {}) ===
+        JSON.stringify(current.queryParams || {}) &&
+      JSON.stringify(original.requestBody || {}) ===
+        JSON.stringify(current.requestBody || {}) &&
+      JSON.stringify(original.headers || {}) ===
+        JSON.stringify(current.headers || {}) &&
+      String(original.bodyEncoding || "json") === current.bodyEncoding &&
+      String(original.body || "") === String(current.body || "") &&
+      String(original.bodyBase64 || "") === String(current.bodyBase64 || "");
+  } catch {
+    button.disabled = false;
+  }
+}
+
+/**
+ * Override編集フォームの内容を管理APIへ保存する。
+ */
+async function saveOverride(event, id) {
+  event.preventDefault();
+  event.stopPropagation();
+  const button = event.currentTarget;
+  const root = button.closest("details");
+  try {
+    setEditorError(root, "");
+    const saved = await api("/admin/json-overrides/" + id, {
+      method: "PATCH",
+      body: JSON.stringify(currentOverrideValue(root)),
+    });
+    dirtyNewOverrideIds.delete(String(id));
+    flash(button);
+    lastOverrides = lastOverrides.map((override) =>
+      String(override.id) === String(id) ? saved : override,
+    );
+    renderOverrides(lastOverrides);
+  } catch (error) {
+    setEditorError(root, error.message);
+  }
+}
+
+/**
+ * Override編集フォームの現在値を保存用オブジェクトへ変換する。
+ */
+function currentOverrideValue(root) {
+  const method = root.querySelector('[data-field="method"]').value;
+  return {
+    id: root.dataset.id,
+    enabled: root.querySelector('[type="checkbox"]').checked,
+    name: root.querySelector('[data-field="name"]').value,
+    method,
+    pathPattern: root.querySelector('[data-field="pathPattern"]').value,
+    queryParams: parseJsonObjectField(root, "queryParams", "Query Params JSON"),
+    requestBody:
+      method === "GET"
+        ? {}
+        : parseJsonObjectField(root, "requestBody", "Request Body JSON"),
+    value: parseJsonObjectField(root, "value", "Override JSON"),
+  };
+}
+
+/**
+ * Override編集内容が変更されているか見てApplyボタン状態を更新する。
+ */
+function updateOverrideApplyState(root) {
+  const button = root.querySelector('[data-action="apply-override"]');
+  if (!button) return;
+  try {
+    const original = JSON.parse(root.dataset.original);
+    const current = currentOverrideValue(root);
+    setEditorError(root, "");
+    button.disabled =
+      String(original.name || "Untitled override") === current.name &&
+      original.method === current.method &&
+      original.pathPattern === current.pathPattern &&
+      JSON.stringify(original.queryParams || {}) ===
+        JSON.stringify(current.queryParams || {}) &&
+      JSON.stringify(original.requestBody || {}) ===
+        JSON.stringify(current.requestBody || {}) &&
+      JSON.stringify(original.value || {}) ===
+        JSON.stringify(current.value || {});
+  } catch {
+    button.disabled = false;
+  }
+}
+
+/**
+ * JSONまたはJSON風入力をオブジェクトとして読み取る。
+ */
+function parseJsonObjectField(root, field, label) {
+  const raw = root.querySelector(`[data-field="${field}"]`).value.trim();
+  if (!raw) return {};
+
+  let parsed;
+  try {
+    parsed = JSON.parse(raw);
+  } catch (error) {
+    try {
+      parsed = JSON.parse(normalizeJsonLikeInput(raw));
+    } catch (jsonLikeError) {
+      throw new Error(
+        `${label}: invalid JSON (${jsonLikeError.message || error.message})`,
+      );
+    }
+  }
+
+  if (!parsed || typeof parsed !== "object" || Array.isArray(parsed)) {
+    throw new Error(`${label}: object JSON is required.`);
+  }
+
+  return toJsonCompatibleObject(parsed, label);
+}
+
+/**
+ * Stub Body欄をレスポンス本文として保存できる形へ正規化する。
+ * JSONレスポンスらしい本文はApply時に検証し、保存値も整形済みにする。
+ */
+function normalizeStubBodyField(root, bodyEncoding) {
+  const body = root.querySelector('[data-field="body"]')?.value || "";
+  if (bodyEncoding !== "json") return body;
+
+  return JSON.stringify(parseJsonValue(body, "Body JSON"), null, 2);
+}
+
+/**
+ * JSONまたはJSON風入力を任意のJSON値として読み取る。
+ */
+function parseJsonValue(raw, label) {
+  const text = raw.trim();
+  if (!text) return null;
+
+  try {
+    return JSON.parse(text);
+  } catch (error) {
+    try {
+      return JSON.parse(normalizeJsonLikeInput(text));
+    } catch (jsonLikeError) {
+      throw new Error(
+        `${label}: invalid JSON (${jsonLikeError.message || error.message})`,
+      );
+    }
+  }
+}
+
+/**
+ * JSON入力のコメントと末尾カンマだけを取り除く。
+ * eval相当の処理は使わず、値の解釈は必ずJSON.parseへ任せる。
+ */
+function normalizeJsonLikeInput(raw) {
+  let result = "";
+  let stringQuote = "";
+  let escaped = false;
+
+  for (let i = 0; i < raw.length; i += 1) {
+    const char = raw[i];
+    const next = raw[i + 1];
+
+    if (stringQuote) {
+      result += char;
+      if (escaped) {
+        escaped = false;
+      } else if (char === "\\") {
+        escaped = true;
+      } else if (char === stringQuote) {
+        stringQuote = "";
+      }
+      continue;
+    }
+
+    if (char === '"') {
+      stringQuote = char;
+      result += char;
+      continue;
+    }
+
+    if (char === "/" && next === "/") {
+      i += 2;
+      while (i < raw.length && raw[i] !== "\n" && raw[i] !== "\r") i += 1;
+      i -= 1;
+      continue;
+    }
+
+    if (char === "/" && next === "*") {
+      i += 2;
+      while (i < raw.length && !(raw[i] === "*" && raw[i + 1] === "/")) {
+        i += 1;
+      }
+      i += 1;
+      continue;
+    }
+
+    if (char === "," && isTrailingComma(raw, i)) continue;
+
+    result += char;
+  }
+
+  return result;
+}
+
+/**
+ * 指定位置のカンマがオブジェクト/配列末尾のカンマか判定する。
+ */
+function isTrailingComma(raw, commaIndex) {
+  for (let i = commaIndex + 1; i < raw.length; i += 1) {
+    const char = raw[i];
+    if (/\s/.test(char)) continue;
+    return char === "}" || char === "]";
+  }
+
+  return false;
+}
+
+/**
+ * JS値をJSON互換のプレーンオブジェクトへ正規化する。
+ */
+function toJsonCompatibleObject(value, label) {
+  try {
+    const normalized = JSON.parse(JSON.stringify(value));
+    if (
+      !normalized ||
+      typeof normalized !== "object" ||
+      Array.isArray(normalized)
+    ) {
+      throw new Error("object JSON is required.");
+    }
+    return normalized;
+  } catch (error) {
+    throw new Error(
+      `${label}: JSON-compatible object is required (${error.message})`,
+    );
+  }
+}
+
+/**
+ * 編集フォーム直下のエラー表示を更新する。
+ */
+function setEditorError(root, message) {
+  const target = root.querySelector("[data-editor-error]");
+  if (target) target.textContent = message || "";
+}
+
+/**
+ * 履歴のレスポンス本文を整形してクリップボードへコピーする。
+ */
+async function copyBody(event, id) {
+  event.preventDefault();
+  event.stopPropagation();
+  const button = event.currentTarget;
+  const item = await getHistoryDetail(id);
+  if (!item) return;
+  await navigator.clipboard.writeText(formatBody(item.responseBody || ""));
+  flash(button);
+}
+
+/**
+ * 履歴のバイナリレスポンス本文をファイルとして保存する。
+ */
+async function downloadHistoryBody(event, id) {
+  event.preventDefault();
+  event.stopPropagation();
+  const button = event.currentTarget;
+  const item = await getHistoryDetail(id);
+  if (!item || !item.responseBodyBase64) return;
+  downloadBytes(
+    historyBodyFilename(item),
+    base64ToBytes(item.responseBodyBase64),
+    contentTypeOf(item.responseHeaders),
+  );
+  flash(button);
+}
+
+/**
+ * Stubのバイナリ本文をファイルとしてダウンロードする。
+ */
+function downloadStubBody(event, id) {
+  event.preventDefault();
+  event.stopPropagation();
+  const root = event.currentTarget.closest("details");
+  const base64 = root.querySelector('[data-field="bodyBase64"]').value;
+  if (!base64) return;
+  const headers = JSON.parse(
+    root.querySelector('[data-field="headers"]').value,
+  );
+  downloadBytes(
+    "stub-body-" + id + extensionFromContentType(contentTypeOf(headers)),
+    base64ToBytes(base64),
+    contentTypeOf(headers),
+  );
+  flash(event.currentTarget);
+}
+
+/**
+ * 選択されたファイルをStubのBase64本文として読み込む。
+ */
+async function loadStubBodyFile(event) {
+  const root = event.target.closest("details");
+  if (!event.target.files[0]) return;
+  const bytes = new Uint8Array(await event.target.files[0].arrayBuffer());
+  root.querySelector('[data-field="bodyBase64"]').value = bytesToBase64(bytes);
+  root.querySelector('[data-field="bodyBinaryNote"]').textContent =
+    "Binary body: " + bodySizeLabel(bytes.length);
+  updateStubApplyState(root);
+}
+
+/**
+ * Stub本文エディタをテキスト/バイナリで切り替える。
+ */
+function toggleStubBodyEditor(root) {
+  const binary =
+    root.querySelector('[data-field="bodyEncoding"]').value === "base64";
+  root
+    .querySelector('[data-body-panel="text"]')
+    .classList.toggle("hidden", binary);
+  root
+    .querySelector('[data-body-panel="base64"]')
+    .classList.toggle("hidden", !binary);
+  updateStubApplyState(root);
+}
+
+/**
+ * GETメソッドではRequest Body条件欄を非表示にする。
+ */
+function toggleRequestBodyCriteria(root) {
+  const method = root.querySelector('[data-field="method"]')?.value;
+  const bodyCriteria = root.querySelector("[data-request-body-criteria]");
+  if (bodyCriteria) bodyCriteria.classList.toggle("hidden", method === "GET");
+}
+
+/**
+ * addStubFromHistoryを実行する。
+ */
+async function addStubFromHistory(event, id) {
+  event.preventDefault();
+  event.stopPropagation();
+  const item = await getHistoryDetail(id);
+  if (!item) return;
+  const stub = await api("/admin/stubs", {
+    method: "POST",
+    body: JSON.stringify({
+      name: item.method + " " + item.path,
+      method: item.method,
+      pathPattern: "^" + escapeRegExp(pathnameOf(item.path)) + "$",
+      queryParams: regexObjectFromValues(item.requestQuery || {}),
+      requestBody: regexObjectFromValues(item.requestBody || {}),
+      status: item.status,
+      headers: item.stubResponseHeaders || omitSensitiveHeaders(item.responseHeaders) || {
+        "content-type": "application/json; charset=utf-8",
+      },
+      bodyEncoding: historyStubBodyEncoding(item),
+      body: isBinaryBody(item) ? "" : item.responseBody || "",
+      bodyBase64: item.responseBodyBase64 || "",
+    }),
+  });
+  document.querySelector('[data-tab="stubsPanel"]').click();
+  await load();
+  const detail = document.querySelector(`#stubs details[data-id="${stub.id}"]`);
+  if (detail) detail.open = true;
+}
+
+/**
+ * 履歴レスポンスから作るStubのBody Typeを推定する。
+ */
+function historyStubBodyEncoding(item) {
+  if (isBinaryBody(item)) return "base64";
+  return isJsonContentType(
+    contentTypeOf(item.stubResponseHeaders || item.responseHeaders),
+  )
+    ? "json"
+    : "text";
+}
+
+/**
+ * Content-TypeがJSONレスポンスか判定する。
+ */
+function isJsonContentType(contentType) {
+  return /\bapplication\/json\b|\+json\b/i.test(String(contentType || ""));
+}
+
+/**
+ * Stub化時に認証情報を含む可能性があるヘッダを除外する。
+ */
+function omitSensitiveHeaders(headers) {
+  if (!headers || typeof headers !== "object") return {};
+  const sensitive = new Set(
+    (sensitiveHeaderNames || []).map((name) => String(name).toLowerCase()),
+  );
+  return Object.fromEntries(
+    Object.entries(headers).filter(
+      ([name]) => !sensitive.has(String(name).toLowerCase()),
+    ),
+  );
+}
+
+/**
+ * addOverrideFromHistoryを実行する。
+ */
+async function addOverrideFromHistory(event, id) {
+  event.preventDefault();
+  event.stopPropagation();
+  const item = lastHistory.find((entry) => String(entry.id) === String(id));
+  if (!item) return;
+  const override = await api("/admin/json-overrides", {
+    method: "POST",
+    body: JSON.stringify({
+      name: item.method + " " + item.path,
+      method: item.method,
+      pathPattern: "^" + escapeRegExp(pathnameOf(item.path)) + "$",
+      queryParams: regexObjectFromValues(item.requestQuery || {}),
+      requestBody: regexObjectFromValues(item.requestBody || {}),
+      value: {},
+    }),
+  });
+  document.querySelector('[data-tab="overridesPanel"]').click();
+  await load();
+  const detail = document.querySelector(
+    `#overrides details[data-id="${override.id}"]`,
+  );
+  if (detail) detail.open = true;
+}
+
+/**
+ * moveStubを実行する。
+ */
+async function moveStub(event, id, direction) {
+  event.preventDefault();
+  event.stopPropagation();
+  await api("/admin/stubs/" + id + "/move", {
+    method: "POST",
+    body: JSON.stringify({ direction }),
+  });
+  await load();
+}
+
+/**
+ * moveOverrideを実行する。
+ */
+async function moveOverride(event, id, direction) {
+  event.preventDefault();
+  event.stopPropagation();
+  await api("/admin/json-overrides/" + id + "/move", {
+    method: "POST",
+    body: JSON.stringify({ direction }),
+  });
+  await load();
+}
+
+/**
+ * 既存Stubを複製して新しい行として追加する。
+ */
+async function copyStub(event, id) {
+  event.preventDefault();
+  event.stopPropagation();
+  const root = event.currentTarget.closest("details");
+  const original = JSON.parse(root.dataset.original);
+  const copy = {
+    ...original,
+    id: undefined,
+    name: (original.name || "Untitled stub") + " copy",
+  };
+  const stub = await api("/admin/stubs", {
+    method: "POST",
+    body: JSON.stringify(copy),
+  });
+  await load();
+  const detail = document.querySelector(`#stubs details[data-id="${stub.id}"]`);
+  if (detail) detail.open = true;
+}
+
+/**
+ * 既存Overrideを複製して新しい行として追加する。
+ */
+async function copyOverride(event, id) {
+  event.preventDefault();
+  event.stopPropagation();
+  const root = event.currentTarget.closest("details");
+  const original = JSON.parse(root.dataset.original);
+  const copy = {
+    ...original,
+    id: undefined,
+    name: (original.name || "Untitled override") + " copy",
+  };
+  const override = await api("/admin/json-overrides", {
+    method: "POST",
+    body: JSON.stringify(copy),
+  });
+  await load();
+  const detail = document.querySelector(
+    `#overrides details[data-id="${override.id}"]`,
+  );
+  if (detail) detail.open = true;
+}