dianping/cat · warning · ValidationError

Unknown property '{}'.

Error message

Unknown property '{}'.

What it means

Thrown by `Validation.validateProperty` when a declaration's property name is not present in the validator's Properties table and does not start with `-` (the parser deliberately lets vendor-prefixed properties through unvalidated). This is the worker's 'unknown property' lint: the CSS parses fine, but the validator does not recognize the property as standard CSS.

Source

Thrown at cat-home/src/main/webapp/assets/js/editor/worker-css.js:5129

var Validation = {

    validate: function(property, value){
        var name        = property.toString().toLowerCase(),
            parts       = value.parts,
            expression  = new PropertyValueIterator(value),
            spec        = Properties[name],
            part,
            valid,
            j, count,
            msg,
            types,
            last,
            literals,
            max, multi, group;

        if (!spec) {
            if (name.indexOf("-") !== 0){    //vendor prefixed are ok
                throw new ValidationError("Unknown property '" + property + "'.", property.line, property.col);
            }
        } else if (typeof spec != "number"){
            if (typeof spec == "string"){
                if (spec.indexOf("||") > -1) {
                    this.groupProperty(spec, expression);
                } else {
                    this.singleProperty(spec, expression, 1);
                }

            } else if (spec.multi) {
                this.multiProperty(spec.multi, expression, spec.comma, spec.max || Infinity);
            } else if (typeof spec == "function") {
                spec(expression);
            }

        }

    },

View on GitHub (pinned to e815e74d4c)

Solutions

1. If the name is a typo, correct it (the message gives you the exact spelling and position).
2. If the property is legitimately new, upgrade worker-css.js / the validation table, or switch the lint to a maintained validator (stylelint) that knows current CSS.
3. Prefix genuinely custom properties with `-` (they are exempt from this check) — this is also how spec custom properties (`--var`) pass.
4. Disable/relax the unknown-property rule in editor lint config if modern CSS must flow through an old worker.

Example fix

/* before */
.item { backgroud: red; gap: 8px; } /* 'Unknown property' for backgroud (and gap on old tables) */

/* after */
.item { background: red; gap: 8px; }

var Properties = /* your validator's table keys */ Object.keys(propertyTable);
function knownProperty(name) {
  return name.charAt(0) === '-' || propertyTable.hasOwnProperty(name); // vendor-prefixed and custom are exempt
}

function isRecognizedProperty(name, table) {
  return typeof name === 'string' && (name[0] === '-' || Object.prototype.hasOwnProperty.call(table, name));
}

try {
  Validation.validate(property, value);
} catch (ex) {
  if (/Unknown property/.test(ex.message)) { addLint(ex.line, ex.col, ex.message); return; } // lint, don't crash
  throw ex;
}

When it happens

Trigger: Newer CSS properties absent from the bundled table (`gap`/`grid-template-areas` in old builds, `aspect-ratio`, `container-type`, `text-wrap: balance`'s property), custom/internal properties like `fx-foo`, typos (`colr`, `backgroud`), and CSS-in-JS artifacts. Any name not in Properties and not prefixed with `-` triggers the throw at the property token's position.

Common situations: Long-lived app bundles embedding an aging worker-css.js validating modern stylesheets; teams using nonstandard framework properties; simple misspellings that browsers silently ignore but the validator flags.

Related errors

• Expected end of value but found '{part}'.
• Expected (<'azimuth'>) but found '{}'.
• Expected (none | [ <flex-grow> <flex-shrink>? || <flex-basis
• Expected {name} at line {line}, col {col}.
• Expected end of value but found '{}'.

AI-assisted analysis of dianping/cat@e815e74d4c (2026-08-14). Data as JSON: /api/errors/1e9a8aa5e8d0e35e. Report an issue: GitHub.