Refactoring

- merged parseCSSValue() and parseCSSGrammar()
- all entry points now consistently returns error, null, or a valid value

Author: cdoublev

__tests__/value.js

@@ -30,6 +30,7 @@ const { cssom, install } = require('../lib/index.js')
 const { createContext, parseCSSGrammar } = require('../lib/parse/parser.js')
 const { toDegrees, toRadians } = require('../lib/utils/math.js')
 const { keywords: cssWideKeywords } = require('../lib/values/substitutions.js')
+const { isFailure } = require('../lib/utils/value.js')
 const { serializeCSSComponentValue } = require('../lib/serialize.js')
 
 /**
@@ -41,11 +42,14 @@ const { serializeCSSComponentValue } = require('../lib/serialize.js')
  */
 function parse(definition, value, serialize = true, context) {
     value = parseCSSGrammar(value, definition, context)
-    if (serialize) {
-        if (value) {
-            return serializeCSSComponentValue(value)
+    if (isFailure(value)) {
+        if (serialize) {
+            return ''
         }
-        return ''
+        return null
+    }
+    if (serialize) {
+        return serializeCSSComponentValue(value)
     }
     return value
 }

lib/cssom/CSS-impl.js

@@ -1,5 +1,5 @@
 
-const { isComputationallyIndependent, isList } = require('../utils/value.js')
+const { isComputationallyIndependent, isFailure, isList } = require('../utils/value.js')
 const { parseCSSDeclaration, parseCSSGrammar } = require('../parse/parser.js')
 const { serializeIdentifier, serializeCSSComponentValue } = require('../serialize.js')
 const { keywords: cssWideKeywords } = require('../values/substitutions.js')
@@ -40,7 +40,7 @@ const MISSING_INITIAL_CUSTOM_PROPERTY_VALUE = {
  * definition in multiple places.
  */
 function supportsValue(property, value) {
-    return parseCSSDeclaration(property, value, false, '@style') !== null
+    return !isFailure(parseCSSDeclaration(property, value, false, '@style'))
 }
 
 /**
@@ -50,7 +50,7 @@ function supportsValue(property, value) {
  */
 function supportsCondition(conditionText) {
     const condition = parseCSSGrammar(`(${conditionText})`, '<supports-condition>')
-    return condition ? matchSupport(condition) : false
+    return !isFailure(condition) && matchSupport(condition)
 }
 
 /**
@@ -81,15 +81,15 @@ class CSSImpl {
      * @see {@link https://drafts.css-houdini.org/css-properties-values-api-1/#dom-css-registerproperty}
      */
     registerProperty({ name, inherits, initialValue, syntax }) {
-        if (!parseCSSGrammar(name, '<custom-property-name>', '@property')) {
+        if (isFailure(parseCSSGrammar(name, '<custom-property-name>', '@property'))) {
             throw INVALID_CUSTOM_PROPERTY_NAME
         }
         const register = globalThis.document._registeredPropertySet
         if (register.some(definition => definition.name === name)) {
             throw INVALID_CUSTOM_PROPERTY_OVERRIDE
         }
         syntax = parseCSSGrammar(syntax, '<syntax>', '@property')
-        if (syntax === null) {
+        if (isFailure(syntax)) {
             throw INVALID_CUSTOM_PROPERTY_SYNTAX
         }
         syntax = serializeCSSComponentValue(syntax)
@@ -99,15 +99,15 @@ class CSSImpl {
                 return
             }
             initialValue = parseCSSGrammar(initialValue, '<declaration-value>?', '@property')
-            if (initialValue && isValidUniversalInitialValue(initialValue)) {
+            if (!isFailure(initialValue) && isValidUniversalInitialValue(initialValue)) {
                 register.push({ inherits, initialValue, name, syntax })
                 return
             }
             throw INVALID_INITIAL_CUSTOM_PROPERTY_VALUE_UNIVERSAL
         }
         if (initialValue) {
             initialValue = parseCSSGrammar(initialValue, syntax, '@property')
-            if (initialValue && isComputationallyIndependent(initialValue)) {
+            if (!isFailure(initialValue) && isComputationallyIndependent(initialValue)) {
                 register.push({ inherits, initialValue, name, syntax })
                 return
             }

lib/cssom/CSSCounterStyleRule-impl.js

@@ -1,11 +1,11 @@
 
+const { isFailure, isList } = require('../utils/value.js')
 const { parseBlockContents, parseCSSDeclaration, parseCSSGrammar } = require('../parse/parser.js')
 const { serializeCSSComponentValue, serializeCSSValue } = require('../serialize.js')
 const { implementation: CSSRuleImpl } = require('./CSSRule-impl.js')
 const counterStyles = require('../values/counter-styles.js')
 const { cssPropertyToIDLAttribute } = require('../utils/string.js')
 const { '@counter-style': descriptors } = require('../descriptors/definitions.js')
-const { isList } = require('../utils/value.js')
 const { keyword } = require('../values/value.js')
 
 const descriptorNames = Object.keys(descriptors)
@@ -56,9 +56,9 @@ class CSSCounterStyleRuleImpl extends CSSRuleImpl {
         if (this.system !== 'additive') {
             return
         }
-        value = parseCSSDeclaration('additive-symbols', value, false, this)?.value
-        if (value) {
-            this._additiveSymbols = value
+        value = parseCSSDeclaration('additive-symbols', value, false, this)
+        if (!isFailure(value)) {
+            this._additiveSymbols = value.value
         }
     }
 
@@ -70,9 +70,9 @@ class CSSCounterStyleRuleImpl extends CSSRuleImpl {
         return _fallback ? serializeCSSValue({ name: 'fallback', value: _fallback }) : ''
     }
     set fallback(value) {
-        value = parseCSSDeclaration('fallback', value, false, this)?.value
-        if (value) {
-            this._fallback = value
+        value = parseCSSDeclaration('fallback', value, false, this)
+        if (!isFailure(value)) {
+            this._fallback = value.value
         }
     }
 
@@ -84,7 +84,7 @@ class CSSCounterStyleRuleImpl extends CSSRuleImpl {
     }
     set name(name) {
         name = parseCSSGrammar(CSS.escape(name), '<counter-style-name>', this)
-        if (name) {
+        if (!isFailure(name)) {
             const lowercase = name.value.toLowerCase()
             if (counterStyles.predefined.includes(lowercase)) {
                 name = keyword(lowercase, ['counter-style-name'])
@@ -101,9 +101,9 @@ class CSSCounterStyleRuleImpl extends CSSRuleImpl {
         return _negative ? serializeCSSValue({ name: 'negative', value: _negative }) : ''
     }
     set negative(value) {
-        value = parseCSSDeclaration('negative', value, false, this)?.value
-        if (value) {
-            this._negative = value
+        value = parseCSSDeclaration('negative', value, false, this)
+        if (!isFailure(value)) {
+            this._negative = value.value
         }
     }
 
@@ -115,9 +115,9 @@ class CSSCounterStyleRuleImpl extends CSSRuleImpl {
         return _pad ? serializeCSSValue({ name: 'pad', value: _pad }) : ''
     }
     set pad(value) {
-        value = parseCSSDeclaration('pad', value, false, this)?.value
-        if (value) {
-            this._pad = value
+        value = parseCSSDeclaration('pad', value, false, this)
+        if (!isFailure(value)) {
+            this._pad = value.value
         }
     }
 
@@ -129,9 +129,9 @@ class CSSCounterStyleRuleImpl extends CSSRuleImpl {
         return _prefix ? serializeCSSValue({ name: 'prefix', value: _prefix }) : ''
     }
     set prefix(value) {
-        value = parseCSSDeclaration('prefix', value, false, this)?.value
-        if (value) {
-            this._prefix = value
+        value = parseCSSDeclaration('prefix', value, false, this)
+        if (!isFailure(value)) {
+            this._prefix = value.value
         }
     }
 
@@ -143,9 +143,9 @@ class CSSCounterStyleRuleImpl extends CSSRuleImpl {
         return _range ? serializeCSSValue({ name: 'range', value: _range }) : ''
     }
     set range(value) {
-        value = parseCSSDeclaration('range', value, false, this)?.value
-        if (value) {
-            this._range = value
+        value = parseCSSDeclaration('range', value, false, this)
+        if (!isFailure(value)) {
+            this._range = value.value
         }
     }
 
@@ -157,9 +157,9 @@ class CSSCounterStyleRuleImpl extends CSSRuleImpl {
         return _speakAs ? serializeCSSValue({ name: 'speak-as', value: _speakAs }) : ''
     }
     set speakAs(value) {
-        value = parseCSSDeclaration('speak-as', value, false, this)?.value
-        if (value) {
-            this._speakAs = value
+        value = parseCSSDeclaration('speak-as', value, false, this)
+        if (!isFailure(value)) {
+            this._speakAs = value.value
         }
     }
 
@@ -171,9 +171,9 @@ class CSSCounterStyleRuleImpl extends CSSRuleImpl {
         return _suffix ? serializeCSSValue({ name: 'suffix', value: _suffix }) : ''
     }
     set suffix(value) {
-        value = parseCSSDeclaration('suffix', value, false, this)?.value
-        if (value) {
-            this._suffix = value
+        value = parseCSSDeclaration('suffix', value, false, this)
+        if (!isFailure(value)) {
+            this._suffix = value.value
         }
     }
 
@@ -189,9 +189,9 @@ class CSSCounterStyleRuleImpl extends CSSRuleImpl {
         if (system === 'additive' || system.startsWith('extends')) {
             return
         }
-        value = parseCSSDeclaration('symbols', value, false, this)?.value
-        if (value && (1 < value.length || (system !== 'alphabetic' && system !== 'numeric'))) {
-            this._symbols = value
+        value = parseCSSDeclaration('symbols', value, false, this)
+        if (!isFailure(value) && (1 < value.value.length || (system !== 'alphabetic' && system !== 'numeric'))) {
+            this._symbols = value.value
         }
     }
 
@@ -206,15 +206,15 @@ class CSSCounterStyleRuleImpl extends CSSRuleImpl {
         const { _system } = this
         if (!_system) {
             // Explicit defaut system
-            value = parseCSSDeclaration('system', value, false, this)?.value
-            if (value?.value === 'symbolic') {
-                this._system = value
+            value = parseCSSDeclaration('system', value, false, this)
+            if (!isFailure(value) && value.value.value === 'symbolic') {
+                this._system = value.value
             }
         } else if (isList(_system)) {
             // Fixed <integer>? or extends <counter-style-name>
-            value = parseCSSDeclaration('system', value, false, this)?.value
-            if (value && value[0]?.value === _system[0]?.value) {
-                this._system = value
+            value = parseCSSDeclaration('system', value, false, this)
+            if (!isFailure(value) && value.value[0]?.value === _system[0]?.value) {
+                this._system = value.value
             }
         }
     }

lib/cssom/CSSFontFeatureValuesMap-impl.js

@@ -1,7 +1,7 @@
 
+const { isFailure, isList } = require('../utils/value.js')
 const { parseBlockContents, parseCSSDeclaration } = require('../parse/parser.js')
 const error = require('../error.js')
-const { isList } = require('../utils/value.js')
 const root = require('../rules/definitions.js')
 
 const INVALID_FONT_FEATURE_VALUE_ERROR = {
@@ -87,7 +87,7 @@ class CSSFontFeatureValuesMapImpl {
         if (!Array.isArray(values)) {
             values = [values]
         }
-        if (!parseCSSDeclaration(key, values.join(' '), false, this)) {
+        if (isFailure(parseCSSDeclaration(key, values.join(' '), false, this))) {
             throw error(INVALID_FONT_FEATURE_VALUE_ERROR)
         }
         this._map.set(key, values)

lib/cssom/CSSKeyframeRule-impl.js

@@ -3,6 +3,7 @@ const { parseBlockContents, parseCSSGrammar } = require('../parse/parser.js')
 const CSSKeyframeProperties = require('./CSSKeyframeProperties.js')
 const { implementation: CSSRuleImpl } = require('./CSSRule-impl')
 const error = require('../error.js')
+const { isFailure } = require('../utils/value.js')
 const { serializeCSSComponentValueList } = require('../serialize.js')
 
 const SET_INVALID_KEY_TEXT_ERROR = {
@@ -53,11 +54,10 @@ class CSSKeyframeRuleImpl extends CSSRuleImpl {
      */
     set keyText(selector) {
         selector = parseCSSGrammar(selector, '<keyframe-selector>#', this)
-        if (selector) {
-            this._keyText = selector
-        } else {
+        if (isFailure(selector)) {
             throw error(SET_INVALID_KEY_TEXT_ERROR)
         }
+        this._keyText = selector
     }
 }
 

lib/cssom/CSSKeyframesRule-impl.js

@@ -5,6 +5,7 @@ const { implementation: CSSRuleImpl } = require('./CSSRule-impl.js')
 const CSSRuleList = require('./CSSRuleList.js')
 const error = require('../error.js')
 const idlUtils = require('./utils.js')
+const { isFailure } = require('../utils/value.js')
 
 const SET_INVALID_NAME_ERROR = {
     message: "Cannot set 'name': invalid value",
@@ -63,11 +64,10 @@ class CSSKeyframesRuleImpl extends CSSRuleImpl {
      */
     set name(name) {
         name = parseCSSGrammar(CSS.escape(name), '<keyframes-name>', this)
-        if (name) {
-            this._name = name
-        } else {
+        if (isFailure(name)) {
             throw error(SET_INVALID_NAME_ERROR)
         }
+        this._name = name
     }
 
     /**
@@ -108,7 +108,7 @@ class CSSKeyframesRuleImpl extends CSSRuleImpl {
      */
     deleteRule(selector) {
         selector = parseCSSGrammar(selector, '<keyframe-selector>#', this)
-        if (selector) {
+        if (!isFailure(selector)) {
             selector = serializeCSSComponentValueList(selector)
             const rules = this.cssRules._rules
             const index = rules.findLastIndex(rule => rule.keyText === selector)
@@ -125,7 +125,7 @@ class CSSKeyframesRuleImpl extends CSSRuleImpl {
      */
     findRule(selector) {
         selector = parseCSSGrammar(selector, '<keyframe-selector>#', this)
-        if (selector) {
+        if (!isFailure(selector)) {
             selector = serializeCSSComponentValueList(selector)
             const rules = this.cssRules._rules
             const index = rules.findLastIndex(rule => rule.keyText === selector)

lib/cssom/CSSPageRule-impl.js

@@ -4,6 +4,7 @@ const { implementation: CSSGroupingRuleImpl } = require('./CSSGroupingRule-impl'
 const CSSPageDeclarations = require('./CSSPageDeclarations.js')
 const CSSPageDescriptors = require('./CSSPageDescriptors.js')
 const CSSRuleList = require('./CSSRuleList.js')
+const { isFailure } = require('../utils/value.js')
 const { serializeCSSComponentValue } = require('../serialize.js')
 
 /**
@@ -74,7 +75,7 @@ class CSSPageRuleImpl extends CSSGroupingRuleImpl {
      */
     set selectorText(selector) {
         selector = parseCSSGrammar(selector, '<page-selector-list>', this)
-        if (selector) {
+        if (!isFailure(selector)) {
             this._selectors = selector
         }
     }

lib/cssom/CSSStyleDeclaration-impl.js

@@ -210,7 +210,7 @@ class CSSStyleDeclarationImpl {
         }
         const context = this.parentRule ?? this._ownerNode
         const declaration = parseCSSDeclaration(name, value, !!priority, context)
-        if (declaration === null) {
+        if (isFailure(declaration)) {
             return
         }
         let updated = true

lib/cssom/CSSStyleRule-impl.js

@@ -7,6 +7,7 @@ const CSSRuleList = require('./CSSRuleList.js')
 const CSSScopeRule = require('./CSSScopeRule.js')
 const CSSStyleProperties = require('./CSSStyleProperties.js')
 const CSSStyleRule = require('./CSSStyleRule.js')
+const { isFailure } = require('../utils/value.js')
 const { serializeCSSComponentValueList } = require('../serialize.js')
 
 const nestingSelector = { types: ['<delimiter-token>'], value: '&' }
@@ -103,7 +104,7 @@ class CSSStyleRuleImpl extends CSSGroupingRuleImpl {
     set selectorText(selector) {
         const definition = this.parentRule ? '<relative-selector-list>' : '<selector-list>'
         selector = parseCSSGrammar(selector, definition, this)
-        if (selector) {
+        if (!isFailure(selector)) {
             this._selectors = selector
         }
     }

lib/parse/arbitrary.js

@@ -103,7 +103,7 @@ function matchCommaContainingValue(node, match) {
  * @returns {SyntaxError|object|null}
  */
 function matchDeclaration(node, parser) {
-    return parser.parseDeclaration(node.input, '@style') ?? null
+    return parser.parseDeclaration(node.input, '@style')
 }
 
 /**