//go:build browser

package movementtest

import (
	"fmt"
	"testing"

	"github.com/chromedp/chromedp"
)

// Every field on the form is styled the same way, checked in a real browser
// against computed style rather than by reading the stylesheet.
//
// This exists because the name field shipped unstyled: the rule was bound to
// input[type="email"], so the first text input added to the form fell
// straight through to the browser's rounded default and nothing noticed. A
// selector that names one input type is a trap for the next field somebody
// adds, and only the browser can say what actually applied.
func TestEveryFieldIsRuledNotBoxed(t *testing.T) {
	rig := powRig(t)
	rig.Run(chromedp.Navigate(rig.Origin + "/uneasy"))

	for _, sel := range []string{"#name", "#email", "#background"} {
		var radius, bottomWidth string
		rig.Run(
			chromedp.Evaluate(fmt.Sprintf(
				`getComputedStyle(document.querySelector(%q)).borderTopLeftRadius`, sel),
				&radius),
			chromedp.Evaluate(fmt.Sprintf(
				`getComputedStyle(document.querySelector(%q)).borderBottomWidth`, sel),
				&bottomWidth),
		)
		if radius != "0px" {
			t.Errorf("%s has a corner radius of %s; this world has no rounded corners",
				sel, radius)
		}
		if bottomWidth != "2px" {
			t.Errorf("%s has a %s bottom rule; the fields are ruled underlines",
				sel, bottomWidth)
		}
	}
}