@jant/core 0.6.16 → 0.7.0

package/src/client/components/__tests__/jant-settings-general.test.ts

@@ -4,12 +4,11 @@ import { describe, it, expect, beforeEach, vi } from "vitest";
 import type {
   SettingsLabels,
   SettingsTimezone,
-  SettingsCjkFont,
-  SettingsDashboardLanguage,
   SettingsSaveDetail,
   SettingsAboutPageStatus,
 } from "../settings-types.js";
 import { MAX_SITE_NAME_LENGTH } from "../../../types.js";
+import type { DiscoverPageUrls } from "../../../lib/discover.js";
 import "../jant-settings-general.js";
 import type { JantSettingsGeneral } from "../jant-settings-general.js";
 
@@ -43,13 +42,18 @@ function findRadioByValue(
   );
 }
 
+/**
+ * Matched exactly: "Site" is a prefix of "Site visibility", so a substring
+ * match would find whichever of the two comes first on the page.
+ */
 function findSectionByHeading(
   el: HTMLElement,
   headingText: string,
 ): HTMLElement | null {
   return (
-    Array.from(el.querySelectorAll<HTMLElement>("section")).find((section) =>
-      section.querySelector("h3")?.textContent?.includes(headingText),
+    Array.from(el.querySelectorAll<HTMLElement>("section")).find(
+      (section) =>
+        section.querySelector("h3")?.textContent?.trim() === headingText,
     ) ?? null
   );
 }
@@ -83,22 +87,12 @@ const labels: SettingsLabels = {
     "/about is already used. Rename that item before creating an About page.",
   createAboutPage: "Create About page",
   editAboutPage: "Edit About page",
-  languageAndTime: "Language & Time",
+  timeSection: "Time",
   home: "Home",
-  search: "Search",
+  siteVisibility: "Site visibility",
   siteName: "Site Name",
   aboutBlog: "About this blog",
   aboutBlogHelp: "Displayed above your blog posts.",
-  siteLanguage: "Content language",
-  siteLanguageHelp: "The language your posts are written in.",
-  siteLanguageSearchPlaceholder: "Search…",
-  siteLanguageNoMatches: "No matches.",
-  contentLanguagePreview: "Readers and search engines see",
-  dashboardLanguage: "Dashboard language",
-  dashboardLanguageHelp: "The language this admin dashboard shows in.",
-  cjkFont: "CJK fallback",
-  cjkFontHelp:
-    "Used when the content language has no built-in font profile. Your font theme still controls serif and sans styling.",
   timeZone: "Time Zone",
   feeds: "Feeds",
   mainRssFeed: "Main RSS feed",
@@ -124,11 +118,24 @@ const labels: SettingsLabels = {
   markdownSupported: "Markdown supported",
   allowIndexing: "Allow search engines to index my site",
   demoSeoLocked: "Demo sites always stay hidden from search engines.",
+  discoverName: "Jant Discover",
+  discoverRules: "Discover community rules",
+  discoverEnabled: "Allow Jant Discover to list my site",
+  discoverIntro:
+    "Jant Discover is a directory of Jant blogs, curated by hand by the Jant community to help people find new Jant blogs and posts. A post you mark Featured appears on the Discover home page 24 hours later, and link and quote posts appear on the Links and Quotes lists 24 hours after they are published. You can keep editing them in the meantime. See the Discover community rules.",
+  discoverDemoLocked: "Demo sites are never listed in Discover.",
+  discoverFeedsOffLocked:
+    "Discover reads your Atom feed, so it needs feeds turned on.",
+  discoverSearchOff:
+    "Search engine indexing is off, so this site is not listed by default. Ticking the box above lists it anyway.",
+  discoverAnnounce: "Announce my site",
+  discoverAnnounceManual: "Or submit your address by hand",
   save: "Save",
   cancel: "Cancel",
   copy: "Copy",
   copyFailed: "Could not copy. Try again.",
   feedUrlCopied: "Feed URL copied.",
+  feedsDocs: "All feed addresses",
 };
 
 const timezones: SettingsTimezone[] = [
@@ -136,28 +143,22 @@ const timezones: SettingsTimezone[] = [
   { value: "America/New_York", label: "(UTC-05:00) Eastern Time" },
 ];
 
-const cjkFonts: SettingsCjkFont[] = [
-  { value: "off", label: "Follow content language" },
-  { value: "zh-Hans", label: "简体中文 (Simplified Chinese)" },
-];
-
-const dashboardLanguages: SettingsDashboardLanguage[] = [
-  { value: "en", label: "English" },
-  { value: "zh-Hans", label: "简体中文" },
-  { value: "zh-Hant", label: "繁體中文" },
-];
-
 const initialData = {
   siteName: "My Blog",
   siteDescription: "A test blog",
-  siteLanguage: "en",
-  dashboardLanguage: "en",
-  cjkSerifFont: "off",
   timeZone: "UTC",
   mainRssFeed: "featured",
   siteFooter: "Footer text",
   showJantBrandingOnHome: false,
   noindex: false,
+  discover: "",
+};
+
+const discoverPages: DiscoverPageUrls = {
+  home: "https://jant.me/discover",
+  links: "https://jant.me/links",
+  quotes: "https://jant.me/quotes",
+  rules: "https://jant.me/discover/about",
 };
 
 function findCheckboxByLabel(
@@ -171,10 +172,27 @@ function findCheckboxByLabel(
   );
 }
 
+/**
+ * The Discover help line, found by its text: it is one of several muted
+ * paragraphs in the section, and only this one carries the directory's links.
+ */
+function findIntroParagraph(el: HTMLElement): HTMLElement | null {
+  return (
+    Array.from(el.querySelectorAll<HTMLElement>("p")).find(
+      (paragraph) => paragraph.textContent?.trim() === labels.discoverIntro,
+    ) ?? null
+  );
+}
+
 async function createElement(
   opts: {
     demoMode?: boolean;
+    feedsEnabled?: boolean;
     aboutPage?: SettingsAboutPageStatus;
+    /** The deployment's own answer: "" when it has none. */
+    discoverDefault?: string;
+    /** Serialized status view, as the server hands it to the component. */
+    discoverStatus?: string;
   } = {},
 ): Promise<JantSettingsGeneral> {
   const el = document.createElement(
@@ -182,8 +200,6 @@ async function createElement(
   ) as JantSettingsGeneral;
   el.labels = labels;
   el.timezones = timezones;
-  el.cjkFonts = cjkFonts;
-  el.dashboardLanguages = dashboardLanguages;
   el.siteNameFallback = "Fallback Name";
   el.siteDescriptionFallback = "Fallback Description";
   el.mainFeedUrl = "/feed";
@@ -199,6 +215,10 @@ async function createElement(
   el.aboutEditUrl = "/about?edit=1";
   el.aboutCreateUrl = "/settings/general/about-page";
   el.demoMode = opts.demoMode ?? false;
+  el.discoverPages = discoverPages;
+  el.discoverDefault = opts.discoverDefault ?? "";
+  el.discoverStatus = opts.discoverStatus ?? "";
+  el.feedsEnabled = opts.feedsEnabled ?? true;
   document.body.appendChild(el);
   await el.updateComplete;
   el.initData(initialData);
@@ -220,10 +240,10 @@ describe("JantSettingsGeneral", () => {
     expect(el.querySelector("h2")?.textContent).toBe("General");
     expect(groupTitles).toEqual([
       labels.site,
-      labels.languageAndTime,
+      labels.siteVisibility,
       labels.feeds,
+      labels.timeSection,
       labels.home,
-      labels.search,
     ]);
 
     const siteSection = requireElement(
@@ -309,121 +329,6 @@ describe("JantSettingsGeneral", () => {
     expect(options?.[0]?.value).toBe("UTC");
   });
 
-  it("opens the locale combobox and filters options as the user searches", async () => {
-    const el = await createElement();
-
-    const trigger = requireElement(
-      el.querySelector<HTMLButtonElement>(
-        'button[aria-haspopup="listbox"][aria-labelledby="site-language-label"]',
-      ),
-      "expected locale picker trigger",
-    );
-    expect(trigger.getAttribute("aria-expanded")).toBe("false");
-
-    trigger.click();
-    await el.updateComplete;
-
-    expect(trigger.getAttribute("aria-expanded")).toBe("true");
-
-    const options = el.querySelectorAll<HTMLButtonElement>('[role="option"]');
-    // The content-language picker lists the full BCP 47 catalog so any public
-    // content language is reachable. Coverage / raw tags are not shown here.
-    expect(options.length).toBeGreaterThanOrEqual(20);
-    for (const option of options) {
-      expect(option.textContent).not.toMatch(/% translated/);
-    }
-
-    const search = requireElement(
-      el.querySelector<HTMLInputElement>("[data-locale-search]"),
-      "expected search input",
-    );
-    search.value = "fin";
-    search.dispatchEvent(new Event("input", { bubbles: true }));
-    await el.updateComplete;
-
-    const filtered = el.querySelectorAll<HTMLButtonElement>('[role="option"]');
-    expect(filtered.length).toBe(1);
-    expect(filtered[0]?.textContent).toMatch(/Suomi|Finnish/);
-  });
-
-  it("selects a non-catalog content language and shows its native name", async () => {
-    const el = await createElement();
-    const trigger = requireElement(
-      el.querySelector<HTMLButtonElement>(
-        'button[aria-labelledby="site-language-label"]',
-      ),
-      "expected trigger",
-    );
-    trigger.click();
-    await el.updateComplete;
-
-    const search = requireElement(
-      el.querySelector<HTMLInputElement>("[data-locale-search]"),
-      "expected search input",
-    );
-    search.value = "fi";
-    search.dispatchEvent(new Event("input", { bubbles: true }));
-    await el.updateComplete;
-
-    const finnishOption = Array.from(
-      el.querySelectorAll<HTMLButtonElement>('[role="option"]'),
-    ).find((opt) => /Suomi|Finnish/.test(opt.textContent ?? ""));
-    finnishOption?.click();
-    await el.updateComplete;
-
-    // Picker closes after selection.
-    expect(trigger.getAttribute("aria-expanded")).toBe("false");
-    // Trigger shows the selected language's native name only — no raw BCP 47
-    // tag, no coverage metric.
-    expect(trigger.textContent).toMatch(/suomi|finnish/i);
-    expect(trigger.textContent).not.toMatch(/% translated/);
-    expect(trigger.textContent).not.toMatch(/\bfi\b/);
-  });
-
-  it("renders dashboard language options and saves the selection", async () => {
-    const el = await createElement();
-    const select = requireElement(
-      el.querySelector(
-        'select[aria-labelledby="dashboard-language-label"]',
-      ) as globalThis.HTMLSelectElement | null,
-      "expected dashboard language select",
-    );
-    const values = Array.from(select.options).map((o) => o.value);
-    expect(values).toEqual(["en", "zh-Hans", "zh-Hant"]);
-    expect(select.value).toBe("en");
-
-    const saves: SettingsSaveDetail[] = [];
-    el.addEventListener("jant:settings-save", (e) => {
-      saves.push((e as CustomEvent<SettingsSaveDetail>).detail);
-    });
-
-    select.value = "zh-Hant";
-    select.dispatchEvent(new Event("change", { bubbles: true }));
-    await el.updateComplete;
-
-    const saveButton = requireElement(
-      findSaveButtonByHeading(el, labels.languageAndTime),
-      "expected language & time save button",
-    );
-    saveButton.click();
-
-    expect(saves).toHaveLength(1);
-    expect(saves[0]?.endpoint).toBe("/settings/general/language-time");
-    expect(saves[0]?.data.dashboardLanguage).toBe("zh-Hant");
-  });
-
-  it("renders CJK font options", async () => {
-    const el = await createElement();
-    const cjkSelect = requireElement(
-      findSelectByLabel(el, labels.cjkFont),
-      "expected CJK font select",
-    );
-    const options = cjkSelect?.querySelectorAll("option");
-    expect(options?.length).toBe(2);
-    expect(options?.[0]?.value).toBe("off");
-    expect(options?.[1]?.value).toBe("zh-Hans");
-  });
-
   it("renders main RSS feed controls and fixed feed URLs", async () => {
     const el = await createElement();
     const featuredRadio = requireElement(
@@ -451,26 +356,37 @@ describe("JantSettingsGeneral", () => {
     ]);
   });
 
-  it("copies a feed URL from the info block", async () => {
-    const writeText = vi.fn().mockResolvedValue(undefined);
-    Object.defineProperty(globalThis.navigator, "clipboard", {
-      value: { writeText },
-      configurable: true,
-    });
-
+  it("marks up each feed URL for the copy-field enhancer", async () => {
     const el = await createElement();
     const feedSection = requireElement(
       findSectionByHeading(el, labels.feeds),
       "expected feeds section",
     );
-    const copyButtons = feedSection.querySelectorAll<HTMLButtonElement>(
-      "button[data-copy-feed-url]",
-    );
+    const fields = feedSection.querySelectorAll("[data-copy-field-root]");
 
-    copyButtons[0]?.click();
-    await Promise.resolve();
+    expect(fields).toHaveLength(4);
+
+    const firstField = requireElement(
+      fields[0],
+      "expected the main feed field",
+    );
+    const input = requireElement(
+      firstField.querySelector<HTMLInputElement>(
+        "input[data-copy-field-value]",
+      ),
+      "expected the address input",
+    );
+    const button = requireElement(
+      firstField.querySelector<HTMLButtonElement>("button[data-copy-field]"),
+      "expected the copy button",
+    );
 
-    expect(writeText).toHaveBeenCalledWith("/feed");
+    expect(input.value).toBe("/feed");
+    expect(button.getAttribute("data-copy-field")).toBe(labels.feedUrlCopied);
+    expect(button.getAttribute("data-copy-field-failed")).toBe(
+      labels.copyFailed,
+    );
+    expect(button.textContent).toContain(labels.copy);
   });
 
   it("tracks site group dirty state on input", async () => {
@@ -534,48 +450,69 @@ describe("JantSettingsGeneral", () => {
       detail = (event as CustomEvent<SettingsSaveDetail>).detail;
     });
 
-    const saveBtn = findSaveButtonByHeading(el, labels.languageAndTime);
+    const saveBtn = findSaveButtonByHeading(el, labels.timeSection);
     saveBtn?.click();
     await el.updateComplete;
 
     expect(detail).not.toBeNull();
     expect((detail as unknown as SettingsSaveDetail).endpoint).toBe(
-      "/settings/general/language-time",
-    );
-    expect((detail as unknown as SettingsSaveDetail).section).toBe(
-      "language-time",
+      "/settings/general/time",
     );
+    expect((detail as unknown as SettingsSaveDetail).section).toBe("time");
     expect((detail as unknown as SettingsSaveDetail).data.timeZone).toBe(
       "America/New_York",
     );
   });
 
-  it("includes mainRssFeed in feed section save", async () => {
+  it("auto-saves the main RSS feed choice without a save button", async () => {
     const el = await createElement();
     const latestRadio = requireElement(
       findRadioByValue(el, "main-rss-feed", "latest"),
       "expected latest radio option",
     );
 
-    latestRadio.click();
-    await el.updateComplete;
+    expect(findSaveButtonByHeading(el, labels.feeds)).toBeNull();
 
     let detail: SettingsSaveDetail | null = null;
     el.addEventListener("jant:settings-save", (event) => {
       detail = (event as CustomEvent<SettingsSaveDetail>).detail;
     });
 
-    const saveBtn = findSaveButtonByHeading(el, labels.feeds);
-    saveBtn?.click();
+    latestRadio.click();
     await el.updateComplete;
 
     expect(detail).not.toBeNull();
     expect((detail as unknown as SettingsSaveDetail).endpoint).toBe(
       "/settings/general/feeds",
     );
+    expect((detail as unknown as SettingsSaveDetail).section).toBe("feeds");
     expect((detail as unknown as SettingsSaveDetail).data.mainRssFeed).toBe(
       "latest",
     );
+    expect(latestRadio.checked).toBe(true);
+  });
+
+  it("sectionError for the feed choice restores the saved value", async () => {
+    const el = await createElement();
+    const latestRadio = requireElement(
+      findRadioByValue(el, "main-rss-feed", "latest"),
+      "expected latest radio option",
+    );
+
+    latestRadio.click();
+    await el.updateComplete;
+    expect(latestRadio.checked).toBe(true);
+
+    el.sectionError("feeds");
+    await el.updateComplete;
+
+    expect(latestRadio.checked).toBe(false);
+    expect(
+      requireElement(
+        findRadioByValue(el, "main-rss-feed", "featured"),
+        "expected featured radio option",
+      ).checked,
+    ).toBe(true);
   });
 
   it("sectionSaved resets site dirty state and updates originals", async () => {
@@ -735,4 +672,436 @@ describe("JantSettingsGeneral", () => {
     const spinner = saveBtn?.querySelector("svg.animate-spin");
     expect(spinner).not.toBeNull();
   });
+
+  /**
+   * Every control here saves on change, like the indexing checkbox beside it:
+   * ticking the box stores the default mode, and a mode is stored the moment
+   * it is picked. Ticking the box is also how a self-hosted site opts in, and
+   * that first save is what announces it to the directory.
+   */
+  describe("Discover", () => {
+    it("renders the section under Site visibility", async () => {
+      const el = await createElement();
+
+      expect(findSectionByHeading(el, labels.siteVisibility)).not.toBeNull();
+      expect(el.textContent).toContain(labels.discoverEnabled);
+      expect(el.textContent).toContain(labels.discoverIntro);
+    });
+
+    // Opt-in: a self-hosted site nobody configured shows the box unticked.
+    it("starts off for a site with no deployment default", async () => {
+      const el = await createElement();
+      const toggle = requireElement(
+        findCheckboxByLabel(el, labels.discoverEnabled) ?? null,
+        "expected the Discover checkbox",
+      );
+
+      expect(toggle.checked).toBe(false);
+
+      toggle.click();
+      await el.updateComplete;
+
+      expect(toggle.checked).toBe(true);
+    });
+
+    // Hosted Jant sets `DISCOVER=latest`, and an owner who has never opened
+    // this page must not be shown "off" while their feeds say otherwise.
+    it("starts on when the deployment lists its blogs", async () => {
+      const el = await createElement({ discoverDefault: "latest" });
+
+      expect(
+        requireElement(
+          findCheckboxByLabel(el, labels.discoverEnabled) ?? null,
+          "expected the Discover checkbox",
+        ).checked,
+      ).toBe(true);
+    });
+
+    // The section carries no Save button of its own: the only button it can
+    // render is the announcement retry, which needs a failed announcement.
+    it("offers no Save button", async () => {
+      const el = await createElement();
+      const section = requireElement(
+        findSectionByHeading(el, labels.siteVisibility),
+        "expected the Site visibility section",
+      );
+
+      expect(section.querySelectorAll("button").length).toBe(0);
+    });
+
+    it("sends latest when the box is ticked", async () => {
+      const el = await createElement();
+      let detail: SettingsSaveDetail | null = null;
+      el.addEventListener("jant:settings-save", (event) => {
+        detail = (event as CustomEvent<SettingsSaveDetail>).detail;
+      });
+
+      requireElement(
+        findCheckboxByLabel(el, labels.discoverEnabled) ?? null,
+        "expected the Discover checkbox",
+      ).click();
+      await el.updateComplete;
+
+      const d = detail as unknown as SettingsSaveDetail;
+      expect(d.endpoint).toBe("/settings/general/discover");
+      expect(d.section).toBe("discover");
+      expect(d.data.discover).toBe("latest");
+    });
+
+    it("sends off when the box is unticked", async () => {
+      const el = await createElement({ discoverDefault: "latest" });
+      let detail: SettingsSaveDetail | null = null;
+      el.addEventListener("jant:settings-save", (event) => {
+        detail = (event as CustomEvent<SettingsSaveDetail>).detail;
+      });
+
+      requireElement(
+        findCheckboxByLabel(el, labels.discoverEnabled) ?? null,
+        "expected the Discover checkbox",
+      ).click();
+      await el.updateComplete;
+
+      expect((detail as unknown as SettingsSaveDetail).data.discover).toBe(
+        "off",
+      );
+    });
+
+    // A site that chose the old featured-only mode reads as on, and the box
+    // widens it only when the owner ticks it again — never on its own.
+    it("keeps a stored featured choice ticked, and writes latest on re-tick", async () => {
+      const el = await createElement();
+      el.initData({ ...initialData, discover: "featured" });
+      await el.updateComplete;
+      const details: SettingsSaveDetail[] = [];
+      el.addEventListener("jant:settings-save", (event) => {
+        details.push((event as CustomEvent<SettingsSaveDetail>).detail);
+      });
+
+      const toggle = requireElement(
+        findCheckboxByLabel(el, labels.discoverEnabled) ?? null,
+        "expected the Discover checkbox",
+      );
+      expect(toggle.checked).toBe(true);
+      expect(details).toHaveLength(0);
+
+      toggle.click();
+      await el.updateComplete;
+      expect(details[0]?.data.discover).toBe("off");
+
+      el.sectionSaved("discover");
+      await el.updateComplete;
+      requireElement(
+        findCheckboxByLabel(el, labels.discoverEnabled) ?? null,
+        "expected the Discover checkbox",
+      ).click();
+      await el.updateComplete;
+      expect(details[1]?.data.discover).toBe("latest");
+    });
+
+    // The controls stay disabled until the save answers, so a second click
+    // cannot race the first.
+    it("disables the controls while a save is in flight", async () => {
+      const el = await createElement({ discoverDefault: "latest" });
+      const toggle = requireElement(
+        findCheckboxByLabel(el, labels.discoverEnabled) ?? null,
+        "expected the Discover checkbox",
+      );
+
+      toggle.click();
+      await el.updateComplete;
+
+      expect(toggle.disabled).toBe(true);
+
+      el.sectionSaved("discover");
+      await el.updateComplete;
+
+      expect(
+        requireElement(
+          findCheckboxByLabel(el, labels.discoverEnabled) ?? null,
+          "expected the Discover checkbox",
+        ).disabled,
+      ).toBe(false);
+    });
+
+    // A failed save leaves the page describing the site as it still is.
+    it("restores the stored choice when the save fails", async () => {
+      const el = await createElement({ discoverDefault: "latest" });
+      const toggle = requireElement(
+        findCheckboxByLabel(el, labels.discoverEnabled) ?? null,
+        "expected the Discover checkbox",
+      );
+
+      toggle.click();
+      await el.updateComplete;
+      el.sectionError("discover");
+      await el.updateComplete;
+
+      expect(
+        requireElement(
+          findCheckboxByLabel(el, labels.discoverEnabled) ?? null,
+          "expected the Discover checkbox",
+        ).checked,
+      ).toBe(true);
+    });
+
+    it("locks the control off for a demo site", async () => {
+      const el = await createElement({ demoMode: true });
+      const toggle = requireElement(
+        findCheckboxByLabel(el, labels.discoverEnabled) ?? null,
+        "expected the Discover checkbox",
+      );
+
+      expect(toggle.disabled).toBe(true);
+      expect(toggle.checked).toBe(false);
+      expect(el.textContent).toContain(labels.discoverDemoLocked);
+    });
+
+    // Discover reads the Atom feed, so with feeds off there is nothing to read.
+    it("locks the control off when the site publishes no feeds", async () => {
+      const el = await createElement({ feedsEnabled: false });
+      const toggle = requireElement(
+        findCheckboxByLabel(el, labels.discoverEnabled) ?? null,
+        "expected the Discover checkbox",
+      );
+
+      expect(toggle.disabled).toBe(true);
+      expect(el.textContent).toContain(labels.discoverFeedsOffLocked);
+    });
+
+    // What Discover is, is best answered by the list itself, so the sentence
+    // explaining the list is the way into it: the name goes to the home, the
+    // list names to the lists, and the rules to the page of rules.
+    it("links each page the help line names to that page", async () => {
+      const el = await createElement();
+      const intro = requireElement(
+        findIntroParagraph(el),
+        "expected the Discover help line",
+      );
+      const links = Array.from(intro.querySelectorAll<HTMLAnchorElement>("a"));
+
+      expect(
+        links.map((link) => [link.textContent, link.getAttribute("href")]),
+      ).toEqual([
+        [labels.discoverName, discoverPages.home],
+        ["Links", discoverPages.links],
+        ["Quotes", discoverPages.quotes],
+        [labels.discoverRules, discoverPages.rules],
+      ]);
+      for (const link of links) {
+        expect(link.getAttribute("target")).toBe("_blank");
+        expect(link.getAttribute("rel")).toBe("noopener noreferrer");
+        expect(link.className).toContain("underline");
+      }
+      // The whole line still reads as one sentence.
+      expect(intro.textContent?.trim()).toBe(labels.discoverIntro);
+    });
+
+    // A `<label>` forwards a click on any descendant to its control, so a link
+    // inside it would open the directory and flip the setting on the way out.
+    it("keeps the directory link out of the checkbox label", async () => {
+      const el = await createElement();
+      const label = requireElement(
+        findCheckboxByLabel(el, labels.discoverEnabled)?.closest("label"),
+        "expected the Discover checkbox label",
+      );
+
+      expect(label.querySelector("a")).toBeNull();
+      expect(label.textContent).toContain(labels.discoverEnabled);
+    });
+
+    // A directory this deployment does not announce to has no address to
+    // link, and a sentence with a dead link in it is worse than a plain one.
+    it("renders the help line as plain text with no directory configured", async () => {
+      const el = await createElement();
+      el.discoverPages = null;
+      await el.updateComplete;
+
+      const intro = requireElement(
+        findIntroParagraph(el),
+        "expected the Discover help line",
+      );
+
+      expect(intro.querySelector("a")).toBeNull();
+      expect(intro.textContent?.trim()).toBe(labels.discoverIntro);
+    });
+
+    // The two checkboxes are one rule read twice. Search indexing gates the
+    // deployment default, so a page that answers the second from a value the
+    // server resolved at load time goes on claiming a listing the feed has
+    // already stopped declaring — right until the owner reloads and finds out.
+    it("unticks Discover when search indexing is turned off", async () => {
+      const el = await createElement({ discoverDefault: "latest" });
+      const discover = requireElement(
+        findCheckboxByLabel(el, labels.discoverEnabled) ?? null,
+        "expected the Discover checkbox",
+      );
+      const indexing = requireElement(
+        findCheckboxByLabel(el, labels.allowIndexing) ?? null,
+        "expected the indexing checkbox",
+      );
+      expect(discover.checked).toBe(true);
+
+      indexing.click();
+      await el.updateComplete;
+
+      expect(discover.checked).toBe(false);
+    });
+
+    // A control that moves on its own has to say why it moved.
+    it("says why the box unticked itself", async () => {
+      const el = await createElement({ discoverDefault: "latest" });
+      expect(el.textContent).not.toContain(labels.discoverSearchOff);
+
+      requireElement(
+        findCheckboxByLabel(el, labels.allowIndexing) ?? null,
+        "expected the indexing checkbox",
+      ).click();
+      await el.updateComplete;
+
+      expect(el.textContent).toContain(labels.discoverSearchOff);
+    });
+
+    // Nothing was holding this site back: the deployment lists nothing by
+    // default, so an unticked box is the opt-in it has always been.
+    it("says nothing about search on a site no default would list", async () => {
+      const el = await createElement();
+
+      requireElement(
+        findCheckboxByLabel(el, labels.allowIndexing) ?? null,
+        "expected the indexing checkbox",
+      ).click();
+      await el.updateComplete;
+
+      expect(el.textContent).not.toContain(labels.discoverSearchOff);
+    });
+
+    // An owner who answered Discover is not being held back by anything: the
+    // stored choice is read first, whichever way it went.
+    it("says nothing about search once the owner has answered", async () => {
+      const el = await createElement({ discoverDefault: "latest" });
+      const discover = requireElement(
+        findCheckboxByLabel(el, labels.discoverEnabled) ?? null,
+        "expected the Discover checkbox",
+      );
+
+      discover.click();
+      await el.updateComplete;
+      el.sectionSaved("discover");
+      await el.updateComplete;
+
+      requireElement(
+        findCheckboxByLabel(el, labels.allowIndexing) ?? null,
+        "expected the indexing checkbox",
+      ).click();
+      await el.updateComplete;
+
+      expect(discover.checked).toBe(false);
+      expect(el.textContent).not.toContain(labels.discoverSearchOff);
+    });
+
+    it("ticks Discover again when search indexing comes back", async () => {
+      const el = await createElement({ discoverDefault: "latest" });
+      const indexing = requireElement(
+        findCheckboxByLabel(el, labels.allowIndexing) ?? null,
+        "expected the indexing checkbox",
+      );
+
+      indexing.click();
+      await el.updateComplete;
+      el.sectionSaved("search");
+      await el.updateComplete;
+      indexing.click();
+      await el.updateComplete;
+      el.sectionSaved("search");
+      await el.updateComplete;
+
+      expect(
+        requireElement(
+          findCheckboxByLabel(el, labels.discoverEnabled) ?? null,
+          "expected the Discover checkbox",
+        ).checked,
+      ).toBe(true);
+    });
+
+    // An owner who ticked the box meant it, and turning off search indexing
+    // does not quietly undo it — the server reads it the same way.
+    it("leaves a stored choice alone when search indexing is turned off", async () => {
+      const el = await createElement({ discoverDefault: "latest" });
+      const discover = requireElement(
+        findCheckboxByLabel(el, labels.discoverEnabled) ?? null,
+        "expected the Discover checkbox",
+      );
+
+      discover.click();
+      await el.updateComplete;
+      el.sectionSaved("discover");
+      await el.updateComplete;
+      discover.click();
+      await el.updateComplete;
+      el.sectionSaved("discover");
+      await el.updateComplete;
+      expect(discover.checked).toBe(true);
+
+      requireElement(
+        findCheckboxByLabel(el, labels.allowIndexing) ?? null,
+        "expected the indexing checkbox",
+      ).click();
+      await el.updateComplete;
+
+      expect(discover.checked).toBe(true);
+    });
+
+    // The status is what the server sent with the page, and it sends a line
+    // only when there is something to say. A site whose setting is doing what
+    // it says is handed nothing, and no heading is left behind to announce an
+    // empty block. Ticking the box does not conjure one either: the lines are
+    // recomputed on the next page load.
+    it("drops the status block when the server sends no lines", async () => {
+      const el = await createElement({
+        discoverStatus: JSON.stringify({
+          lines: [],
+          showAnnounce: false,
+          submitUrl: null,
+        }),
+      });
+
+      expect(el.querySelector(".border-t.pt-3")).toBeNull();
+
+      requireElement(
+        findCheckboxByLabel(el, labels.discoverEnabled) ?? null,
+        "expected the Discover checkbox",
+      ).click();
+      await el.updateComplete;
+
+      expect(el.querySelector(".border-t.pt-3")).toBeNull();
+    });
+
+    it("shows the status the server sent for a listed site", async () => {
+      const el = await createElement({
+        discoverDefault: "latest",
+        discoverStatus: JSON.stringify({
+          lines: ["Not announced yet."],
+          showAnnounce: false,
+          submitUrl: null,
+        }),
+      });
+
+      expect(el.textContent).toContain("Not announced yet.");
+    });
+
+    // The lines and the button are separate halves of the same block, so the
+    // block cannot key its existence on the lines alone.
+    it("keeps the block for an announce button with no lines", async () => {
+      const el = await createElement({
+        discoverDefault: "latest",
+        discoverStatus: JSON.stringify({
+          lines: [],
+          showAnnounce: true,
+          submitUrl: null,
+        }),
+      });
+
+      expect(el.textContent).toContain(labels.discoverAnnounce);
+    });
+  });
 });