attr() declaration with type function breaks parsing

[janschoenherr]

To reproduce:

img {
    aspect-ratio: attr(width type(<number>)) / attr(height type(<number>));
}

Current behavior:

A exception: "Could not parse call arguments or missing ')'" is thrown.

Expected behavior:

img {
    aspect-ratio: attr(width type(<number>)) / attr(height type(<number>));
}

should be rendered

Environment information:

• less version: 4.2.2
• nodejs version: 22.17.0
• operating system: macos

[dosubot]

Hi @janschoenherr! I'm Dosu and I’m helping the less.js team.

Less v4.2.2 doesn't support parsing the CSS attr() function with type arguments like attr(width type(<number>)), which is why you see the "Could not parse call arguments or missing ')'" error. The parser expects function arguments to follow a specific grammar and doesn't recognize the type argument syntax used in modern CSS, so it fails to parse and throws an error see parser code.

Recent updates (e.g., v4.4.2) have fixed some CSS function parsing regressions, but there's no indication that support for attr() with type arguments has been added see PR #4364. There isn't any documentation or discussion about workarounds for this limitation.

For now, Less can't output this syntax as-is. If you need to use it, you may need to avoid preprocessing these lines with Less or use a post-processing step to inject the desired CSS.

To reply, just mention @dosu.

---

^{How did I do? Good | Irrelevant | Incorrect | Verbose | Hallucination | Report 🐛 | Other}