//go:build browser

// The design-system floors on the examples: every state of every
// non-layout example, each loaded as its own document, held to the
// tap-target floor, the 16px text floor, the icon sizes and spacing,
// a clean load, and the same controls with no script at all. The
// seeded sizing fixture (sizing_browser_test.go) is the preservation
// drive for the same floors; this is the coverage drive, which the
// examples feed. The layouts are held with the shells, not here.
package check

import (
	"context"
	"encoding/json"
	"fmt"
	"net/http"
	"sort"
	"strings"
	"sync"
	"testing"
	"time"

	"github.com/chromedp/chromedp"

	"amadan.net/rastrillo/fiesta"
	"amadan.net/rastrillo/fiesta/example"
	"amadan.net/rastrillo/fiesta/internal/harness"
)

// floorState is one example state as the floors drive visits it: its
// address, and the path of its document and of its no-script twin.
type floorState struct {
	Name, State    string
	Path, NoScript string
}

// floorServer serves the states and counts what it served, by path,
// so the drive can show it visited every state of the manifest rather
// than every state of its own list.
type floorServer struct {
	http.Handler
	mu     sync.Mutex
	served map[string]int
}

// snapshot returns how many times each path has been served so far,
// as a copy, so a leg can subtract the count before it from the count
// after it.
func (s *floorServer) snapshot() map[string]int {
	s.mu.Lock()
	defer s.mu.Unlock()
	out := map[string]int{}
	for k, v := range s.served {
		out[k] = v
	}
	return out
}

// floorPages reads every state of every non-layout example through
// the manifest and example.Document, and serves each at the depth the
// tree keeps it, examples/<name>/<state>.html, so the document's own
// relative links (../../css/tokens.css, ../../js/<file>,
// ../assets/<picture>) resolve against the embedded tree beside it
// and nothing in the document is rewritten. Beside each is its
// no-script twin, the same document with every script tag stripped,
// at examples/<name>/<state>.noscript.html, the same depth. The rest
// of the tree (css/, js/, examples/assets/) is served as it is.
func floorPages(t *testing.T) ([]floorState, *floorServer) {
	t.Helper()
	m, err := example.Load(fiesta.FS())
	if err != nil {
		t.Fatal(err)
	}
	var states []floorState
	pages := map[string]string{}
	for _, e := range m.Examples {
		if e.Document || e.Kind == "layout" {
			continue
		}
		for _, s := range e.States {
			doc, err := example.Document(fiesta.FS(), e.Name, s.ID)
			if err != nil {
				t.Fatal(err)
			}
			if !strings.Contains(doc, "<body") {
				t.Fatalf("%s/%s is not a whole document", e.Name, s.ID)
			}
			st := floorState{Name: e.Name, State: s.ID,
				Path:     "/examples/" + e.Name + "/" + s.ID + ".html",
				NoScript: "/examples/" + e.Name + "/" + s.ID + ".noscript.html"}
			pages[st.Path] = doc
			pages[st.NoScript] = scriptTags.ReplaceAllString(doc, "")
			if strings.Contains(pages[st.NoScript], "<script") {
				t.Fatalf("%s/%s still links a script with its tags stripped", e.Name, s.ID)
			}
			states = append(states, st)
		}
	}
	if len(states) <= 100 {
		t.Fatalf("the manifest lists %d non-layout states, want more than 100; a set this small is a broken manifest, not a design system", len(states))
	}
	srv := &floorServer{served: map[string]int{}}
	mux := http.NewServeMux()
	tree := http.FileServerFS(fiesta.FS())
	for _, prefix := range []string{"/css/", "/js/", "/examples/assets/"} {
		mux.Handle("GET "+prefix, tree)
	}
	for path, doc := range pages {
		path, doc := path, doc
		mux.HandleFunc("GET "+path, func(w http.ResponseWriter, _ *http.Request) {
			srv.mu.Lock()
			srv.served[path]++
			srv.mu.Unlock()
			w.Header().Set("Content-Type", "text/html; charset=utf-8")
			fmt.Fprint(w, doc)
		})
	}
	srv.Handler = mux
	return states, srv
}

// manifestStates is the manifest's own list of non-layout states, as
// name/state, read apart from floorPages so the visited check compares
// what the server served against the manifest rather than against the
// loop that asked for it.
func manifestStates(t *testing.T) map[string]floorState {
	t.Helper()
	m, err := example.Load(fiesta.FS())
	if err != nil {
		t.Fatal(err)
	}
	out := map[string]floorState{}
	for _, e := range m.Examples {
		if e.Document || e.Kind == "layout" {
			continue
		}
		for _, s := range e.States {
			out[e.Name+"/"+s.ID] = floorState{Name: e.Name, State: s.ID,
				Path:     "/examples/" + e.Name + "/" + s.ID + ".html",
				NoScript: "/examples/" + e.Name + "/" + s.ID + ".noscript.html"}
		}
	}
	return out
}

// floorProbes is the tap inventory as selector lists: every probe the
// floor holds on a page (the narrow: and modal: prefixes stripped, the
// elsewhere: entries left out, since a drive of their own measures
// them in a state no example reaches), plus the stretched links the
// inventory exempts, which measureFn measures as the row or tile they
// stretch over (the whole-row target); and the exemptions proper, the
// inline link and the keyboard-only submit. An example state carries
// whatever controls its component has, and only the ones the
// inventory names are the floor's to hold: a link in running prose is
// not. The lists are what the measurement filters on.
func floorProbes(wide bool) (probes, exempt string, keyed map[string]string) {
	var sels, ex []string
	keyed = map[string]string{}
	for _, e := range tapInventory {
		sel := e.Probe
		switch {
		case strings.HasPrefix(sel, "elsewhere:"):
			continue
		case strings.HasPrefix(sel, "narrow:"):
			if wide {
				continue
			}
			sel = strings.TrimPrefix(sel, "narrow:")
		case strings.HasPrefix(sel, "modal:"):
			sel = strings.TrimPrefix(sel, "modal:")
		}
		sels = append(sels, sel)
		keyed[sel] = e.Idiom
	}
	for sel, why := range tapExempt {
		if strings.Contains(why, "stretched") {
			sels = append(sels, sel)
			keyed[sel] = "stretched link, measured as its row or tile"
			continue
		}
		ex = append(ex, sel)
	}
	sort.Strings(ex)
	return strings.Join(sels, ", "), strings.Join(ex, ", "), keyed
}

// scriptBuilt are the inventory idioms a script draws at run time, so
// a page with no script cannot carry them: the no-script leg allows
// their absence and nothing else's.
var scriptBuilt = map[string]string{
	"[rst-combo-option]": "select.js builds the combobox's list",
	"[rst-dtp-pick]":     "datetime.js builds the pick button",
	"[rst-dtp-row]":      "datetime.js builds the suggestion list",
}

// scriptShown are the controls one example's markup carries hidden and
// a script shows, keyed by example name and inventory selector: with no
// script a button that could only do nothing stays hidden, on purpose,
// so the no-script leg allows its absence on that example alone. Keyed
// that narrowly so a control another example needs a script to show
// still fails, and each entry must excuse an absence, so one left
// behind by a renamed example fails too.
var scriptShown = map[string]string{
	"snippet [rst-btn]": "copy.js shows the Copy button only where there is a clipboard; with no script it stays hidden on purpose",
}

// floorGaps are the inventory idioms no example state renders, each
// with why, which the seeded sizing page holds instead. A new gap
// fails the drive, and so does a pinned gap that an example has since
// filled.
var floorGaps = map[string]string{
	"[rst-shell-chrome] > summary": "the legacy sidebar drawer: no example carries legacy shell markup",
}

// floorsJS measures one state as measureEverything measures the sizing
// page, over the inventory's controls only: the closed page, then every
// <details> opened alone (the way overlayJS opens it, the shell's
// sibling tail included), then every combobox's list and every date
// field's list, each opened by the script that owns it; a list that
// does not open within ninety frames is reported as failed. It repeats
// overlayJS's walk and measureEverything's list opening rather than
// calling them because both are written against the sizing page (the
// walk returns one overlay per evaluate, the lists are found by
// #sizing-combo and the one [rst-dtp]) and they take no filter; the
// filter here is what keeps a prose link out of the floor. It is a
// function the caller applies to the two selector lists. It also
// returns which probes are rendered on the page, exemptions aside,
// with no element measured (an idiom an example renders that the
// floor never read), how many elements each probe had measured, and
// the gap between every icon in a control and the word beside it, in
// both directions of text, with every overlay open.
const floorsJS = `(async (probes, exempt) => { ` + measureFn + `;
  const floored = el => el.matches(probes) && !el.matches(exempt);
  const skip = el => !floored(el);
  const frame = () => new Promise(r => requestAnimationFrame(r));
  const frames = () => new Promise(r => requestAnimationFrame(() => requestAnimationFrame(r)));
  const until = async cond => { for (let i = 0; i < 90; i++) { if (cond()) return true; await frame(); } return false; };
  const name = el => el.tagName.toLowerCase() + (el.id ? "#" + el.id : "") +
    [...el.attributes].filter(a => a.name.startsWith("rst-")).map(a => "[" + a.name + (a.value ? "=" + a.value : "") + "]").join("") +
    " “" + (el.getAttribute("aria-label") || el.textContent || "").trim().replace(/\s+/g, " ").slice(0, 30) + "”";
  const out = {Closed: measure(document, skip), Overlays: [], Lists: {}, Failed: [], Unmeasured: [], Counts: {}, Gaps: []};
  for (const d of document.querySelectorAll("details")) {
    for (let p = d; p; p = p.parentElement && p.parentElement.closest("details")) p.open = true;
    const tail = d.closest("[rst-shell-tail], .rst-shell__tail");
    if (tail && tail.previousElementSibling && tail.previousElementSibling.matches("details")) tail.previousElementSibling.open = true;
    let outer = d;
    while (outer.parentElement && outer.parentElement.closest("details")) outer = outer.parentElement.closest("details");
    const os = outer.querySelector(":scope > summary");
    if (os) os.scrollIntoView({block: "center", inline: "center"});
    await frames();
    const summary = d.querySelector(":scope > summary");
    const got = measure(d, el => el === summary || skip(el));
    if (d.matches("[rst-shell-menu], [rst-shell-chrome]") && d.nextElementSibling) got.push(...measure(d.nextElementSibling, skip));
    document.querySelectorAll("details[open]").forEach(x => { x.open = false; });
    out.Overlays.push(got);
  }
  // Each field's own list, not the page's first: a date range holds
  // two fields, and the first one's list stays closed while the
  // second's is open.
  const shown = l => !!l && l.checkVisibility() && l.querySelectorAll("[role=option]").length > 0;
  for (const combo of document.querySelectorAll("[rst-combo] [role=combobox]")) {
    const label = "the combobox's list (" + name(combo) + ")", list = combo.closest("[rst-combo]").querySelector("[rst-combo-list]");
    combo.focus(); combo.click();
    if (await until(() => shown(list))) out.Lists[label] = measure(list, skip);
    else out.Failed.push(label);
    combo.dispatchEvent(new KeyboardEvent("keydown", {key: "Escape", bubbles: true}));
    await frames();
  }
  for (const dtp of document.querySelectorAll("[rst-dtp] [role=combobox]")) {
    const label = "the date field's list (" + name(dtp) + ")", list = dtp.closest("[rst-dtp]").querySelector("[rst-dtp-list]");
    dtp.focus(); dtp.value = "t"; dtp.dispatchEvent(new Event("input", {bubbles: true}));
    if (await until(() => shown(list))) out.Lists[label] = measure(list, skip);
    else out.Failed.push(label);
    dtp.dispatchEvent(new KeyboardEvent("keydown", {key: "Escape", bubbles: true}));
    await frames();
  }
  const rendered = el => { if (el.checkVisibility && !el.checkVisibility({visibilityProperty: true})) return false; const r = el.getBoundingClientRect(); return r.width >= 2 && r.height >= 2 && getComputedStyle(el).clipPath !== "inset(50%)"; };
  for (const sel of probes.split(", ")) {
    const all = [...document.querySelectorAll(sel)];
    out.Counts[sel] = all.filter(e => e.hasAttribute("data-measured")).length;
    const present = all.filter(e => rendered(e) && !e.matches(exempt) && !e.closest("[inert]"));
    if (present.length && !present.some(e => e.hasAttribute("data-measured"))) out.Unmeasured.push(sel);
  }
  // The space between an icon and the word beside it, read as
  // TestAnIconKeepsItsSpaceBesideItsText reads it: from the icon's edge
  // to the word's first letter, with every overlay open so menu items
  // are drawn, in the page's direction and the other one.
  const was = document.documentElement.dir;
  document.querySelectorAll("details").forEach(d => { d.open = true; });
  for (const dir of ["ltr", "rtl"]) {
    document.documentElement.dir = dir;
    await frames();
    for (const c of document.querySelectorAll(probes)) {
      if (c.matches(exempt) || !c.checkVisibility()) continue;
      for (const i of c.querySelectorAll("svg.icon")) {
        if (!i.checkVisibility()) continue;
        const ir = i.getBoundingClientRect();
        for (const [side, n] of [["after", i.nextSibling], ["before", i.previousSibling]]) {
          if (!n || n.nodeType !== 3 || !n.textContent.trim()) continue;
          const r = document.createRange();
          if (side === "after") { r.setStart(n, n.textContent.search(/\S/)); r.setEnd(n, n.textContent.length); }
          else { r.setStart(n, 0); r.setEnd(n, n.textContent.replace(/\s+$/, "").length); }
          const tx = r.getBoundingClientRect();
          if (tx.width === 0) continue;
          const gap = side === "after" ? (dir === "rtl" ? ir.left - tx.right : tx.left - ir.right) : (dir === "rtl" ? tx.left - ir.right : ir.left - tx.right);
          out.Gaps.push({Name: name(c), Dir: dir, Side: side, Gap: Math.round(gap * 10) / 10});
        }
      }
    }
  }
  document.documentElement.dir = was;
  document.querySelectorAll("details[open]").forEach(d => { d.open = false; });
  return JSON.stringify(out);
})`

// floorReading is what floorsJS returns for one state.
type floorReading struct {
	Closed     []targetReading
	Overlays   [][]targetReading
	Lists      map[string][]targetReading
	Failed     []string
	Unmeasured []string
	Counts     map[string]int
	Gaps       []struct {
		Name, Dir, Side string
		Gap             float64
	}
}

// TestEveryExampleStateMeetsTheFloors is the floors on the examples.
// For every state of every non-layout example, each loaded as its own
// document at 390px under a coarse pointer and at 1280px with a
// mouse, and at 1280px with every script tag stripped (the page as a
// browser with no script sees it):
//
//   - every interactive element the tap inventory names is at least
//     44 pixels on the phone and 32 on the desktop, whole in the
//     viewport and hittable, overlays and lists included, a stretched
//     link measured as the row or tile it stretches over;
//   - every text control is at least 16px on the phone;
//   - every icon inside a control is 16px, a caret's 12, and keeps at
//     least 3px between its edge and the word beside it, in both
//     directions of text;
//   - the page loads with no console error, no failed request and no
//     JS value leaked to the screen (the rig's screen gate);
//   - with no script, the same idioms are measured on each state as
//     with scripts, the three idioms a script builds and the one
//     control scriptShown names aside, so a component whose controls
//     need a script to appear fails here.
//
// Every inventory idiom a state renders must have been measured on it,
// so an idiom cannot drop out of the floor because its example moved;
// the idioms no example renders at all are pinned in floorGaps, so a
// new gap fails. The drive checks, against the manifest's own list,
// that the server served every state's page on every leg, and that
// the manifest lists more than a hundred, so an emptied manifest or a
// loop that skipped cannot pass by measuring nothing.
//
// It is two tests, so the suite's slices can run them on shards of
// their own: the phone's leg, and the two desktop legs together, since
// the no-script leg is held to what the scripted one measured. Every
// leg's checks are as they were. Of the checks over every leg, the
// pinned gaps are checked in both, each for what it measures, and an
// idiom no state renders is looked for where the inventory says it is
// rendered: a narrow: idiom on the phone, every other one at 1280.
// That last is stricter than the one test, which accepted an idiom
// seen on the phone alone; and both tests need a caret and an icon.
func TestEveryExampleStateMeetsTheFloorsOnAPhone(t *testing.T) {
	meetTheFloors(t, true, []floorLeg{
		{"390 touch", 390, 844, true, 44, false},
	})
}

func TestEveryExampleStateMeetsTheFloorsWithAMouse(t *testing.T) {
	meetTheFloors(t, false, []floorLeg{
		{"1280 mouse", 1280, 900, false, 32, false},
		{"1280 mouse, no scripts", 1280, 900, false, 32, true},
	})
}

// floorLeg is one way the floors drive loads every state.
type floorLeg struct {
	name     string
	w, h     int64
	coarse   bool
	floor    float64
	noscript bool
}

// meetTheFloors drives legs, the phone's or the desktop's, over every
// state.
func meetTheFloors(t *testing.T, phone bool, legs []floorLeg) {
	states, srv := floorPages(t)
	want := manifestStates(t)
	if len(want) <= 100 {
		t.Fatalf("the manifest lists %d non-layout states, want more than 100", len(want))
	}
	seen := map[string]int{}
	withScripts := map[string]map[string]bool{}
	shownUsed := map[string]bool{}
	noscript := false
	var carets, icons int
	for _, leg := range legs {
		t.Run(leg.name, func(t *testing.T) {
			var opts []harness.Option
			if leg.coarse {
				opts = append(opts, harness.WithCoarsePointer())
			}
			noscript = noscript || leg.noscript
			rig := harness.New(t, func(string) http.Handler { return srv }, opts...)
			ctx, cancel := context.WithTimeout(rig.Context(), 20*time.Minute)
			defer cancel()
			mustRun(t, ctx, chromedp.EmulateViewport(leg.w, leg.h))
			probes, exempt, keyed := floorProbes(leg.w >= 800)
			before := srv.snapshot()
			measured := 0
			for _, st := range states {
				key := st.Name + "/" + st.State
				where := fmt.Sprintf("%s, %s", leg.name, key)
				path := st.Path
				if leg.noscript {
					path = st.NoScript
				}
				mustRun(t, ctx, chromedp.Navigate(rig.Origin+path), chromedp.WaitReady("body", chromedp.ByQuery))
				settleUntil(t, ctx, `document.readyState === "complete"`)
				mustRun(t, ctx, chromedp.Evaluate(`new Promise(r => requestAnimationFrame(() => requestAnimationFrame(r)))`, nil, awaitPromise))
				requirePointer(t, ctx, leg.coarse)

				if leg.coarse {
					var raw string
					mustRun(t, ctx, chromedp.Evaluate(fontsJS, &raw))
					var fonts []fontReading
					if err := json.Unmarshal([]byte(raw), &fonts); err != nil {
						t.Fatalf("%s: reading fonts (%q): %v", where, raw, err)
					}
					for _, f := range fonts {
						if f.Px < 16 {
							t.Errorf("%s: %s is %vpx; a phone zooms the page when it is focused", where, f.Name, f.Px)
						}
					}
				}
				c, i := assertIconSizes(t, where, readIcons(t, ctx, where))
				carets, icons = carets+c, icons+i

				var raw string
				mustRun(t, ctx, chromedp.Evaluate(fmt.Sprintf("%s(%s, %s)", floorsJS, mustJSON(t, probes), mustJSON(t, exempt)), &raw, awaitPromise))
				var got floorReading
				if err := json.Unmarshal([]byte(raw), &got); err != nil {
					t.Fatalf("%s: reading the floors (%q): %v", where, raw, err)
				}
				assertTargetsAt(t, where+", overlays closed", got.Closed, leg.floor)
				measured += len(got.Closed)
				for n, o := range got.Overlays {
					assertTargetsAt(t, fmt.Sprintf("%s, overlay %d open", where, n), o, leg.floor)
					measured += len(o)
				}
				for name, l := range got.Lists {
					if len(l) == 0 {
						t.Errorf("%s: %s opened with no options to measure", where, name)
					}
					assertTargetsAt(t, where+", "+name, l, leg.floor)
					measured += len(l)
				}
				for _, name := range got.Failed {
					t.Errorf("%s: %s never opened; its options were not measured", where, name)
				}
				for _, sel := range got.Unmeasured {
					t.Errorf("%s: %s (%s) is rendered and was never measured; the idiom dropped out of the floor", where, sel, keyed[sel])
				}
				for _, g := range got.Gaps {
					if g.Gap < 3 {
						t.Errorf("%s, %s: in %s the icon is %.1fpx from the word %s it; it touches the word", where, g.Dir, g.Name, g.Gap, g.Side)
					}
				}
				here := map[string]bool{}
				for sel, n := range got.Counts {
					seen[sel] += n
					if n > 0 {
						here[sel] = true
					}
				}
				switch {
				case leg.noscript:
					with := withScripts[key]
					if with == nil {
						t.Fatalf("%s: no record of what the scripted leg measured on this state", where)
					}
					for sel := range with {
						_, built := scriptBuilt[sel]
						_, shown := scriptShown[st.Name+" "+sel]
						if !here[sel] && shown {
							shownUsed[st.Name+" "+sel] = true
						}
						if !here[sel] && !built && !shown {
							t.Errorf("%s: %s (%s) is measured with scripts and not without; the component does not work with no script", where, sel, keyed[sel])
						}
					}
					for sel := range here {
						if !with[sel] {
							t.Errorf("%s: %s (%s) is measured without scripts and not with them; the scripted page hides a control the plain one shows", where, sel, keyed[sel])
						}
					}
				case !leg.coarse:
					withScripts[key] = here
				}
				rig.Screen("body", where)
			}
			after := srv.snapshot()
			missing := 0
			for key, st := range want {
				path := st.Path
				if leg.noscript {
					path = st.NoScript
				}
				if after[path]-before[path] < 1 {
					missing++
					t.Errorf("%s: the manifest's %s was never served on this leg", leg.name, key)
				}
			}
			if measured < 100 {
				t.Errorf("%s: measured %d controls over %d states; the instrument read next to nothing", leg.name, measured, len(want)-missing)
			}
			t.Logf("%s: %d of the manifest's %d states served, %d controls measured", leg.name, len(want)-missing, len(want), measured)
		})
	}
	for key := range scriptShown {
		if noscript && !shownUsed[key] {
			t.Errorf("scriptShown excuses %s with no script, and no state needed it; drop the entry or fix its key", key)
		}
	}
	if carets == 0 || icons == 0 {
		t.Errorf("read %d caret icons and %d other icons in controls across every state; the examples must show at least one of each", carets, icons)
	}
	for _, e := range tapInventory {
		if strings.HasPrefix(e.Probe, "elsewhere:") {
			continue
		}
		narrow := strings.HasPrefix(e.Probe, "narrow:")
		if narrow && !phone {
			continue
		}
		sel := strings.TrimPrefix(strings.TrimPrefix(e.Probe, "narrow:"), "modal:")
		_, pinned := floorGaps[sel]
		switch {
		case seen[sel] == 0 && !pinned && narrow == phone:
			t.Errorf("no example state renders %s (%s), and it is not a pinned gap; the examples lost the idiom", sel, e.Idiom)
		case seen[sel] > 0 && pinned:
			t.Errorf("%s (%s) is pinned as a gap in floorGaps but an example renders it; drop the pin", sel, e.Idiom)
		}
	}
}