{"record":{"id":"e9c0c7f9cbe08838","repo":"dianping/cat","slug":"expected-border-radius-but-found","errorCode":null,"errorMessage":"Expected (<'border-radius'>) but found '{}'.","messagePattern":"Expected \\(<'border-radius'>\\) but found '(.+?)'\\.","errorType":"validation","errorClass":"ValidationError","httpStatus":null,"severity":"error","filePath":"cat-home/src/main/webapp/assets/js/editor/worker-css.js","lineNumber":3713,"sourceCode":"            if (!valid) {\n\n                if (expression.peek() == \"/\" && count > 0 && !slash) {\n                    slash = true;\n                    max = count + 5;\n                    expression.next();\n                } else {\n                    break;\n                }\n            }\n            count++;\n        }\n\n        if (expression.hasNext()) {\n            part = expression.next();\n            if (valid) {\n                throw new ValidationError(\"Expected end of value but found '\" + part + \"'.\", part.line, part.col);\n            } else {\n                throw new ValidationError(\"Expected (<'border-radius'>) but found '\" + part + \"'.\", part.line, part.col);\n            }\n        }\n    },\n    \"border-right\"                  : \"<border-width> || <border-style> || <color>\",\n    \"border-right-color\"            : \"<color> | inherit\",\n    \"border-right-style\"            : \"<border-style>\",\n    \"border-right-width\"            : \"<border-width>\",\n    \"border-spacing\"                : { multi: \"<length> | inherit\", max: 2 },\n    \"border-style\"                  : { multi: \"<border-style>\", max: 4 },\n    \"border-top\"                    : \"<border-width> || <border-style> || <color>\",\n    \"border-top-color\"              : \"<color> | inherit\",\n    \"border-top-left-radius\"        : \"<x-one-radius>\",\n    \"border-top-right-radius\"       : \"<x-one-radius>\",\n    \"border-top-style\"              : \"<border-style>\",\n    \"border-top-width\"              : \"<border-width>\",\n    \"border-width\"                  : { multi: \"<border-width>\", max: 4 },\n    \"bottom\"                        : \"<margin-width> | inherit\",\n    \"-moz-box-align\"                : \"start | end | center | baseline | stretch\",","sourceCodeStart":3695,"sourceCodeEnd":3731,"githubUrl":"https://github.com/dianping/cat/blob/e815e74d4c2dd74edac831241f1253fcc7d25381/cat-home/src/main/webapp/assets/js/editor/worker-css.js#L3695-L3731","documentation":"The invalid-from-the-start variant from the `border-radius` validator: no valid radius could be matched at all (`valid === false` with tokens remaining), so it throws `ValidationError(\"Expected (<'border-radius'>) but found '{part}'\")`. The first token is not a length, percentage, or `inherit` as the radius grammar requires.","triggerScenarios":"`border-radius: red`, `border-radius: 10` (unitless number is not allowed for radii), `border-radius: round`, `border-radius: none` (only `border-*-radius` accepts `<length>|<percentage>|inherit`).","commonSituations":"Unit dropped by a minifier or templating; keyword guesses (`none`, `auto`, `circle`); values copied from `outline-style`-like properties.","solutions":["Give each radius a unit or a percent: `border-radius: 10px;` / `50%;`.","Remove keywords that are not in the grammar; use `border-radius: 0;`... note `0` still needs checking — prefer `0px`/`0%` with this validator.","Check templated values (`border-radius: ${r};`) so they never render bare numbers or empty strings."],"exampleFix":"/* before */\n.avatar { border-radius: 50; } /* Expected (<'border-radius'>) but found '50' */\n\n/* after */\n.avatar { border-radius: 50%; }","handlingStrategy":"validation","validationCode":"function radiusValueStartsValid(v) {\n  var first = v.trim().split(/[\\s,/]+/)[0];\n  return first === 'inherit' || /^-?\\d+(\\.\\d+)?(px|em|rem|%|pt)$/.test(first);\n}","typeGuard":null,"tryCatchPattern":"try {\n  Validation.validate('border-radius', value);\n} catch (ex) {\n  if (/border-radius/.test(ex.message)) { addLint(ex.line, ex.col, ex.message); return; }\n  throw ex;\n}","preventionTips":["Always suffix radius numbers with a unit (px/em/%) — this validator rejects bare numbers.","Ensure templated radii never render empty (fallback to 0px)."],"tags":["css","validation","border-radius","property-value"],"backgroundTag":null,"analyzedSha":"e815e74d4c2dd74edac831241f1253fcc7d25381","analyzedAt":"2026-08-14T14:22:34.512Z","schemaVersion":2},"datasetVersion":"2026-08-15T22:17:37.221Z"}