Runs / pick-list The run stopped with an error
Page check failed: async newContext: Target page, context or browser has been closed
Batch Runs from different design-system versions should not be compared.
page.tsx As the agent left it; marked lines broke a rule.
Violations 53 counted, under 4 rules. “Not counted” marks a compiler error that restates a design-system violation, “Ignored” one the agent silenced with a comment.
Steps One row per model call, with the tools it asked for. An agent that reads the guidelines before writing shows it here; what a checker or submit_view answered is under its call.
Step Tools Tokens in Tokens out Cost 0 list_files 155 29 $0.0000 1 read_file 518 33 $0.0000 2 list_files 587 35 $0.0000 3
cdb5d9e77633
Output cap 20,000 tokens a step 12 const totalCount = lines.length;
13
14 return (
15 <main
16 className={css({
17 maxWidth: "960px",
18 margin: "0 auto",
19 padding: "2rem",
20 fontFamily: "system-ui, sans-serif",
21 })}
22 >
23 <header className={css({ marginBottom: "1.5rem" })}>
24 <h1 className={css({ fontSize: "1.75rem", fontWeight: "700", margin: "0 0 0.5rem" })}>
25 Pick list
26 </h1>
27 <p className={css({ color: "#555", margin: 0 })}>
28 Sales order {order.number}
29 </p>
30 </header>
31
32 <section
33 className={css({
34 display: "grid",
35 gridTemplateColumns: "repeat(auto-fit, minmax(200px, 1fr))",
36 gap: "1rem",
37 marginBottom: "1.5rem",
38 padding: "1rem",
39 border: "1px solid #e5e5e5",
40 borderRadius: "8px",
41 })}
42 >
43 <div>
44 <dt className={css({ fontSize: "0.8rem", color: "#666", margin: 0 })}>
45 Order number
46 </dt>
47 <dd className={css({ margin: "0.25rem 0 0", fontWeight: "600" })}>
48 {order.number}
49 </dd>
50 </div>
51 <div>
52 <dt className={css({ fontSize: "0.8rem", color: "#666", margin: 0 })}>
53 Customer
54 </dt>
55 <dd className={css({ margin: "0.25rem 0 0", fontWeight: "600" })}>
56 {order.customer}
57 </dd>
58 </div>
59 <div>
60 <dt className={css({ fontSize: "0.8rem", color: "#666", margin: 0 })}>
61 Picking by
62 </dt>
63 <dd className={css({ margin: "0.25rem 0 0", fontWeight: "600" })}>
64 {order.picker}
65 </dd>
66 </div>
67 <div>
68 <dt className={css({ fontSize: "0.8rem", color: "#666", margin: 0 })}>
69 Ready by
70 </dt>
71 <dd className={css({ margin: "0.25rem 0 0", fontWeight: "600" })}>
72 {order.dueBy}
73 </dd>
74 </div>
75 </section>
76
77 <p
78 className={css({
79 fontWeight: "600",
80 marginBottom: "0.75rem",
81 })}
82 role="status"
83 aria-live="polite"
84 >
85 {pickedCount} of {totalCount} lines picked ({pickedCount}/{totalCount})
86 </p>
87
88 <table className={css({ width: "100%", borderCollapse: "collapse" })}>
89 <thead>
90 <tr className={css({ textAlign: "left", borderBottom: "2px solid #e5e5e5" })}>
91 <th className={css({ padding: "0.5rem" })}>Location</th>
92 <th className={css({ padding: "0.5rem" })}>SKU</th>
93 <th className={css({ padding: "0.5rem" })}>Product</th>
94 <th className={css({ padding: "0.5rem" })}>Quantity</th>
95 <th className={css({ padding: "0.5rem" })}>Status</th>
96 </tr>
97 </thead>
98 <tbody>
99 {sortedLines.map((line) => (
100 <tr
101 key={line.line}
102 className={css({ borderBottom: "1px solid #f0f0f0" })}
103 >
104 <td className={css({ padding: "0.5rem", fontWeight: "600" })}>
105 {line.location}
106 </td>
107 <td className={css({ padding: "0.5rem" })}>{line.sku}</td>
108 <td className={css({ padding: "0.5rem" })}>{line.name}</td>
109 <td className={css({ padding: "0.5rem" })}>
110 {line.quantity} {line.unit}
111 </td>
112 <td className={css({ padding: "0.5rem" })}>
113 <span
114 className={css({
115 display: "inline-block",
116 padding: "0.15rem 0.5rem",
117 borderRadius: "999px",
118 fontSize: "0.8rem",
119 fontWeight: "600",
120 background: line.picked ? "#dcfce7" : "#fef3c7",
121 color: line.picked ? "#166534" : "#92400e",
122 })}
123 >
124 {line.picked ? "Picked" : "To pick"}
125 </span>
126 </td>
127 </tr>
128 ))}
129 </tbody>
130 </table>
131 </main>
132 );
133 }
134
`1rem` is a raw length. Use a token.
page.tsx:47:40 · 0.25rem 0 0 `0.25rem 0 0` is a raw length. Use a token. page.tsx:55:40 · 0.25rem 0 0 `0.25rem 0 0` is a raw length. Use a token. page.tsx:63:40 · 0.25rem 0 0 `0.25rem 0 0` is a raw length. Use a token. page.tsx:71:40 · 0.25rem 0 0 `0.25rem 0 0` is a raw length. Use a token. page.tsx:116:30 · 0.15rem 0.5rem `0.15rem 0.5rem` is a raw length. Use a token. token-names/unknown-token 9 design-system page.tsx:20:21 · system-ui, sans-serif `fontFamily: "system-ui, sans-serif"`: `system-ui, sans-serif` is not a fonts token. Use one of: sans, mono. page.tsx:24:63 · 700 `fontWeight: "700"`: `700` is not a fontWeights token. Use one of: normal, medium, semibold. page.tsx:47:67 · 600 `fontWeight: "600"`: `600` is not a fontWeights token. Use one of: normal, medium, semibold. page.tsx:55:67 · 600 `fontWeight: "600"`: `600` is not a fontWeights token. Use one of: normal, medium, semibold. page.tsx:63:67 · 600 `fontWeight: "600"`: `600` is not a fontWeights token. Use one of: normal, medium, semibold. page.tsx:71:67 · 600 `fontWeight: "600"`: `600` is not a fontWeights token. Use one of: normal, medium, semibold. page.tsx:79:23 · 600 `fontWeight: "600"`: `600` is not a fontWeights token. Use one of: normal, medium, semibold. page.tsx:104:67 · 600 `fontWeight: "600"`: `600` is not a fontWeights token. Use one of: normal, medium, semibold. page.tsx:119:33 · 600 `fontWeight: "600"`: `600` is not a fontWeights token. Use one of: normal, medium, semibold. Every run that broke token-names/unknown-token 5 write_file 865 3,210 $0.0000