quasarframework/quasar · error · TypeError

Expected a string as value

Error message

Expected a string as value

What it means

setCssVar(propName, value, element) requires value to be a string because it is passed directly to element.style.setProperty(). It throws this TypeError when value is a number, object, null, or undefined — even if it looks like a color.

Source

Thrown at ui/src/utils/css-var/set-css-var.js:6

export default function setCssVar(propName, value, element = document.body) {
  if (typeof propName !== 'string') {
    throw new TypeError('Expected a string as propName')
  }
  if (typeof value !== 'string') {
    throw new TypeError('Expected a string as value')
  }
  if (!(element instanceof Element)) {
    throw new TypeError('Expected a DOM element')
  }

  element.style.setProperty(`--q-${propName}`, value)
}

View on GitHub (pinned to 4841521b5f)

Solutions

  1. Pass a CSS value string: setCssVar('primary', '#f37b26').
  2. Convert RGB objects with colors.rgbToHex(rgb) before setting.
  3. Coerce numbers: setCssVar(name, String(value)).
  4. Validate/normalize the theme config so values are always strings.

Example fix

// before
setCssVar('primary', colors.textToRgb('#f00')) // object, throws
// after
setCssVar('primary', colors.rgbToHex(colors.textToRgb('#f00')))
Defensive patterns

Strategy: validation

Validate before calling

if (typeof value !== 'string') throw new Error('setCssVar requires a string value')

Type guard

const isCssValue = (v) => typeof v === 'string' && v.length > 0

Try / catch

try {
  setCssVar('primary', value)
} catch (err) {
  if (err instanceof TypeError && /as value/.test(err.message)) {
    setCssVar('primary', String(value))
  } else throw err
}

Prevention

When it happens

Trigger: setCssVar('primary', 0xff0000); setCssVar('primary', { r: 243, g: 123, b: 38 }); setCssVar('primary') with no value; passing a colors.textToRgb() object instead of a string.

Common situations: Reading colors from JSON/config as numbers or RGB objects; forgetting to serialize a computed color with rgbToHex(); passing undefined because an upstream variable was never assigned.

Related errors


AI-assisted analysis of quasarframework/quasar@4841521b5f (2026-08-30). Data as JSON: /api/errors/0d623c53d0780ccc. Report an issue: GitHub.