@depup/jsdom 29.0.2-depup.0 → 29.1.1-depup.30

package/lib/generated/css-property-metadata.js

@@ -799,8 +799,8 @@ module.exports = new Map([
     {
       "caseSensitive": false,
       "dimensionTypes": {
-        "dimension": {
-          "type": "dimension"
+        "ratio": {
+          "type": "ratio"
         }
       }
     }
@@ -3674,6 +3674,12 @@ module.exports = new Map([
       "caseSensitive": false
     }
   ],
+  [
+    "frame-sizing",
+    {
+      "caseSensitive": false
+    }
+  ],
   [
     "gap",
     {
@@ -5120,8 +5126,6 @@ module.exports = new Map([
       "caseSensitive": false,
       "dimensionTypes": {
         "length": {
-          "max": null,
-          "min": 0,
           "type": "length"
         }
       }
@@ -5133,8 +5137,6 @@ module.exports = new Map([
       "caseSensitive": false,
       "dimensionTypes": {
         "length": {
-          "max": null,
-          "min": 0,
           "type": "length"
         }
       }
@@ -5146,8 +5148,6 @@ module.exports = new Map([
       "caseSensitive": false,
       "dimensionTypes": {
         "length": {
-          "max": null,
-          "min": 0,
           "type": "length"
         }
       }
@@ -5159,8 +5159,6 @@ module.exports = new Map([
       "caseSensitive": false,
       "dimensionTypes": {
         "length": {
-          "max": null,
-          "min": 0,
           "type": "length"
         }
       }
@@ -5172,8 +5170,6 @@ module.exports = new Map([
       "caseSensitive": false,
       "dimensionTypes": {
         "length": {
-          "max": null,
-          "min": 0,
           "type": "length"
         }
       }
@@ -5185,8 +5181,6 @@ module.exports = new Map([
       "caseSensitive": false,
       "dimensionTypes": {
         "length": {
-          "max": null,
-          "min": 0,
           "type": "length"
         }
       }
@@ -5198,8 +5192,6 @@ module.exports = new Map([
       "caseSensitive": false,
       "dimensionTypes": {
         "length": {
-          "max": null,
-          "min": 0,
           "type": "length"
         }
       }
@@ -5211,8 +5203,6 @@ module.exports = new Map([
       "caseSensitive": false,
       "dimensionTypes": {
         "length": {
-          "max": null,
-          "min": 0,
           "type": "length"
         }
       }
@@ -5224,8 +5214,6 @@ module.exports = new Map([
       "caseSensitive": false,
       "dimensionTypes": {
         "length": {
-          "max": null,
-          "min": 0,
           "type": "length"
         }
       }
@@ -5237,8 +5225,6 @@ module.exports = new Map([
       "caseSensitive": false,
       "dimensionTypes": {
         "length": {
-          "max": null,
-          "min": 0,
           "type": "length"
         }
       }
@@ -5250,8 +5236,6 @@ module.exports = new Map([
       "caseSensitive": false,
       "dimensionTypes": {
         "length": {
-          "max": null,
-          "min": 0,
           "type": "length"
         }
       }

package/lib/generated/idl/CSSStyleProperties.js

@@ -32661,6 +32661,86 @@ exports.install = (globalObject, globalNames) => {
       }
     }
 
+    get "frame-sizing"() {
+      const esValue = this !== null && this !== undefined ? this : globalObject;
+
+      if (!exports.is(esValue)) {
+        throw new globalObject.TypeError(
+          "'get frame-sizing' called on an object that is not a valid instance of CSSStyleProperties."
+        );
+      }
+
+      ceReactionsPreSteps_jsdom_living_helpers_custom_elements(globalObject);
+      try {
+        return utils.tryWrapperForImpl(esValue[implSymbol]["frame-sizing"]);
+      } finally {
+        ceReactionsPostSteps_jsdom_living_helpers_custom_elements(globalObject);
+      }
+    }
+
+    set "frame-sizing"(V) {
+      const esValue = this !== null && this !== undefined ? this : globalObject;
+
+      if (!exports.is(esValue)) {
+        throw new globalObject.TypeError(
+          "'set frame-sizing' called on an object that is not a valid instance of CSSStyleProperties."
+        );
+      }
+
+      V = conversions["DOMString"](V, {
+        context: "Failed to set the 'frame-sizing' property on 'CSSStyleProperties': The provided value",
+        globals: globalObject,
+        treatNullAsEmptyString: true
+      });
+
+      ceReactionsPreSteps_jsdom_living_helpers_custom_elements(globalObject);
+      try {
+        esValue[implSymbol]["frame-sizing"] = V;
+      } finally {
+        ceReactionsPostSteps_jsdom_living_helpers_custom_elements(globalObject);
+      }
+    }
+
+    get frameSizing() {
+      const esValue = this !== null && this !== undefined ? this : globalObject;
+
+      if (!exports.is(esValue)) {
+        throw new globalObject.TypeError(
+          "'get frameSizing' called on an object that is not a valid instance of CSSStyleProperties."
+        );
+      }
+
+      ceReactionsPreSteps_jsdom_living_helpers_custom_elements(globalObject);
+      try {
+        return utils.tryWrapperForImpl(esValue[implSymbol]["frameSizing"]);
+      } finally {
+        ceReactionsPostSteps_jsdom_living_helpers_custom_elements(globalObject);
+      }
+    }
+
+    set frameSizing(V) {
+      const esValue = this !== null && this !== undefined ? this : globalObject;
+
+      if (!exports.is(esValue)) {
+        throw new globalObject.TypeError(
+          "'set frameSizing' called on an object that is not a valid instance of CSSStyleProperties."
+        );
+      }
+
+      V = conversions["DOMString"](V, {
+        context: "Failed to set the 'frameSizing' property on 'CSSStyleProperties': The provided value",
+        globals: globalObject,
+        treatNullAsEmptyString: true
+      });
+
+      ceReactionsPreSteps_jsdom_living_helpers_custom_elements(globalObject);
+      try {
+        esValue[implSymbol]["frameSizing"] = V;
+      } finally {
+        ceReactionsPostSteps_jsdom_living_helpers_custom_elements(globalObject);
+      }
+    }
+
     get gap() {
       const esValue = this !== null && this !== undefined ? this : globalObject;
 
@@ -65773,6 +65853,8 @@ exports.install = (globalObject, globalNames) => {
     footnotePolicy: { enumerable: true },
     "forced-color-adjust": { enumerable: true },
     forcedColorAdjust: { enumerable: true },
+    "frame-sizing": { enumerable: true },
+    frameSizing: { enumerable: true },
     gap: { enumerable: true },
     "glyph-orientation-vertical": { enumerable: true },
     glyphOrientationVertical: { enumerable: true },

package/lib/jsdom/living/css/CSSGroupingRule-impl.js

@@ -12,11 +12,14 @@ class CSSGroupingRuleImpl extends CSSRuleImpl {
   }
 
   insertRule(rule, index) {
-    return this.cssRules._insert(rule, index, this._isInNestingContext(), this, this.parentStyleSheet);
+    const result = this.cssRules._insert(rule, index, this._isInNestingContext(), this, this.parentStyleSheet);
+    this.parentStyleSheet?.ownerNode?._ownerDocument._clearStyleCache();
+    return result;
   }
 
   deleteRule(index) {
     this.cssRules._remove(index);
+    this.parentStyleSheet?.ownerNode?._ownerDocument._clearStyleCache();
   }
 
   _isInNestingContext() {

package/lib/jsdom/living/css/CSSStyleDeclaration-impl.js

@@ -391,10 +391,17 @@ class CSSStyleDeclarationImpl {
       case "padding": {
         return this.#resolvePositionShorthand(property);
       }
+      case "border":
+      case "border-top":
+      case "border-right":
+      case "border-bottom":
+      case "border-left":
+      case "border-width":
+      case "border-style":
+      case "border-color": {
+        return this.#resolveBorderShorthands(property);
+      }
       default: {
-        if (property.startsWith("border")) {
-          return this.#resolveBorderShorthands(property);
-        }
         return value;
       }
     }

package/lib/jsdom/living/css/CSSStyleSheet-impl.js

@@ -37,7 +37,9 @@ class CSSStyleSheetImpl extends StyleSheetImpl {
       ]);
     }
 
-    return this.cssRules._insertParsed(parsed, index, null, this);
+    const result = this.cssRules._insertParsed(parsed, index, null, this);
+    this.ownerNode?._ownerDocument._clearStyleCache();
+    return result;
   }
 
   deleteRule(index) {
@@ -45,6 +47,7 @@ class CSSStyleSheetImpl extends StyleSheetImpl {
     this.#checkModificationAllowed();
 
     this.cssRules._remove(index);
+    this.ownerNode?._ownerDocument._clearStyleCache();
   }
 
   // Legacy method
@@ -81,6 +84,8 @@ class CSSStyleSheetImpl extends StyleSheetImpl {
 
     // Parse and populate
     cssParser.parseIntoStyleSheet(text, this._globalObject, this);
+
+    this.ownerNode?._ownerDocument._clearStyleCache();
   }
 
   replace(text) {
@@ -107,6 +112,7 @@ class CSSStyleSheetImpl extends StyleSheetImpl {
         this.cssRules._clear();
         cssParser.parseIntoStyleSheet(text, this._globalObject, this);
         this.#disallowModification = false;
+        this.ownerNode?._ownerDocument._clearStyleCache();
 
         // webidl2js doesn't auto-wrap return values: https://github.com/jsdom/webidl2js/issues/257
         resolve(wrapperForImpl(this));

package/lib/jsdom/living/css/helpers/computed-style.js

@@ -99,9 +99,11 @@ function handleSheet(sheetImpl, elementImpl, declaration, specificities) {
 }
 
 function handleRule(ruleImpl, elementImpl, declaration, specificities) {
-  const { ast, match } = matches(ruleImpl.selectorText, elementImpl);
-  if (match) {
-    handleStyle(ruleImpl.style, declaration, specificities, ast);
+  if (ruleMightMatchElement(ruleImpl, elementImpl)) {
+    const { ast, match } = matches(ruleImpl.selectorText, elementImpl);
+    if (match) {
+      handleStyle(ruleImpl.style, declaration, specificities, ast);
+    }
   }
 }
 
@@ -139,6 +141,44 @@ function handlePropertyForInlineStyle(property, declaration, style) {
   }
 }
 
+function ruleMightMatchElement(ruleImpl, elementImpl) {
+  if (!ruleImpl._selectorSubjects) {
+    const domSelector = elementImpl._ownerDocument._getDOMSelector();
+    ruleImpl._selectorSubjects =
+      domSelector.extractSubjects(
+        ruleImpl.selectorText,
+        elementImpl._ownerDocument.contentType !== "text/html"
+      );
+  }
+
+  const subjects = ruleImpl._selectorSubjects;
+  if (subjects.length === 0) {
+    return true;
+  }
+
+  const id = elementImpl.getAttributeNS(null, "id");
+  const { classList } = elementImpl;
+  // TODO: Remove toLowerCase() after updating the dom-selector.
+  const tag = elementImpl._localName.toLowerCase();
+  for (const keys of subjects) {
+    let mightMatch = true;
+    if (keys.id && keys.id !== id) {
+      mightMatch = false;
+    } else if (keys.className && !classList.contains(keys.className)) {
+      mightMatch = false;
+      // TODO: Remove toLowerCase() after updating the dom-selector.
+    } else if (keys.tag && keys.tag.toLowerCase() !== tag) {
+      mightMatch = false;
+    }
+
+    if (mightMatch) {
+      return true;
+    }
+  }
+
+  return false;
+}
+
 function matches(selectorText, elementImpl) {
   const domSelector = elementImpl._ownerDocument._getDOMSelector();
   const { ast, match, pseudoElement } = domSelector.check(selectorText, elementImpl);
@@ -261,14 +301,7 @@ function replaceGlobalKeywords(property, value, elementImpl, { inherit, initial,
   return value;
 }
 
-function invalidateStyleCache(elementImpl) {
-  if (elementImpl._attached) {
-    elementImpl._ownerDocument._styleCache = new WeakMap();
-  }
-}
-
 exports.SHADOW_DOM_PSEUDO_REGEXP = /^::(?:part|slotted)\(/i;
 exports.getComputedStyleDeclaration = getComputedStyleDeclaration;
 exports.getInheritedPropertyValue = getInheritedPropertyValue;
-exports.invalidateStyleCache = invalidateStyleCache;
 exports.replaceEmptyValueAndKeywords = replaceEmptyValueAndKeywords;

package/lib/jsdom/living/css/helpers/css-values.js

@@ -27,6 +27,7 @@ const AST_TYPES = Object.freeze({
   IDENTIFIER: "Identifier",
   NUMBER: "Number",
   PERCENTAGE: "Percentage",
+  RATIO: "Ratio",
   STRING: "String",
   URL: "Url"
 });
@@ -438,6 +439,24 @@ function serializePercentage(val, opt = {}) {
   return `${num}%`;
 }
 
+/**
+ * Serializes a <ratio> value.
+ *
+ * @param {Array<object>} val - The AST value.
+ * @returns {string|undefined} The serialized ratio.
+ */
+function serializeRatio(val) {
+  const res = parseNumericValue(
+    val,
+    { max: Number.INFINITY, min: 0 },
+    type => type === AST_TYPES.NUMBER
+  );
+  if (!res) {
+    return undefined;
+  }
+  return `${res.num} / 1`;
+}
+
 /**
  * Serializes a <url> value.
  *
@@ -810,6 +829,7 @@ exports.serializeGradient = serializeGradient;
 exports.serializeLength = serializeLength;
 exports.serializeNumber = serializeNumber;
 exports.serializePercentage = serializePercentage;
+exports.serializeRatio = serializeRatio;
 exports.serializeString = serializeString;
 exports.serializeURL = serializeURL;
 exports.splitValue = splitValue;

package/lib/jsdom/living/css/helpers/generic-property-descriptor.js

@@ -38,7 +38,8 @@ function createGenericPropertyDescriptor(property, { caseSensitive, dimensionTyp
               dimension: dimensionType,
               length: lengthType,
               number: numberType,
-              percentage: percentageType
+              percentage: percentageType,
+              ratio: ratioType
             } = dimensionTypes;
             const { color: colorType, image: imageType, paint: paintType } = functionTypes;
             const [{ name, type, value: itemValue }] = parsedValue;
@@ -76,6 +77,8 @@ function createGenericPropertyDescriptor(property, { caseSensitive, dimensionTyp
                   val = parsers.serializeLength(parsedValue, lengthType);
                 } else if (percentageType) {
                   val = parsers.serializePercentage(parsedValue, percentageType);
+                } else if (ratioType) {
+                  val = parsers.serializeRatio(parsedValue, ratioType);
                 }
                 this._setProperty(property, val, priority);
                 break;

package/lib/jsdom/living/css/helpers/shorthand-properties.js

@@ -234,18 +234,22 @@ function replaceBackgroundShorthand(property, properties) {
     const isDefaultBox =
       originValue === background.initialValues.get("background-origin") &&
       clipValue === background.initialValues.get("background-clip");
+    let boxSet = false;
     for (const longhand of background.initialValues.keys()) {
       const value = bgValue[longhand];
       if (!value) {
         continue;
       }
-      if (longhand === "background-origin") {
-        if (!isDefaultBox) {
-          bg.push(originValue);
-        }
-      } else if (longhand === "background-clip") {
-        if (!isDefaultBox && originValue !== clipValue) {
-          bg.push(clipValue);
+      if (longhand === "background-origin" || longhand === "background-clip") {
+        if (isDefaultBox || boxSet) {
+          continue;
+        } else {
+          if (originValue === clipValue) {
+            bg.push(originValue);
+          } else {
+            bg.push(originValue, clipValue);
+          }
+          boxSet = true;
         }
       } else if (value !== background.initialValues.get(longhand)) {
         if (longhand === "background-position") {

package/lib/jsdom/living/css/helpers/stylesheets.js

@@ -2,7 +2,6 @@
 const { legacyHookDecode } = require("@exodus/bytes/encoding.js");
 const whatwgURL = require("whatwg-url");
 const { parseStyleSheet, parseIntoStyleSheet } = require("./css-parser");
-const { invalidateStyleCache } = require("./computed-style");
 
 // TODO: this should really implement https://html.spec.whatwg.org/multipage/links.html#link-type-stylesheet
 // It (and the things it calls) is nowhere close right now.
@@ -54,7 +53,7 @@ exports.removeStyleSheet = (sheet, elementImpl) => {
   // Remove the association explicitly; in the spec it's implicit so this step doesn't exist.
   elementImpl.sheet = null;
 
-  invalidateStyleCache(elementImpl);
+  elementImpl._ownerDocument._clearStyleCache();
 
   sheet.parentStyleSheet = null;
   sheet.ownerNode = null;
@@ -112,7 +111,7 @@ exports.addStyleSheet = (sheet, elementImpl) => {
   // Set the association explicitly; in the spec it's implicit.
   elementImpl.sheet = sheet;
 
-  invalidateStyleCache(elementImpl);
+  elementImpl._ownerDocument._clearStyleCache();
 
   // TODO: title and disabled stuff
 };

package/lib/jsdom/living/css/properties/background.js

@@ -194,6 +194,7 @@ const descriptor = {
       const isDefaultBox =
         originValue === initialValues.get(backgroundOrigin.property) &&
         clipValue === initialValues.get(backgroundClip.property);
+      let boxSet = false;
       for (const [longhand] of shorthandFor) {
         let value;
         if (bgMap.has(longhand)) {
@@ -205,13 +206,16 @@ const descriptor = {
         if (parsers.hasVarFunc(value)) {
           return "";
         }
-        if (longhand === backgroundOrigin.property) {
-          if (!isDefaultBox) {
-            bg.push(originValue);
-          }
-        } else if (longhand === backgroundClip.property) {
-          if (!isDefaultBox && originValue !== clipValue) {
-            bg.push(clipValue);
+        if (longhand === backgroundOrigin.property || longhand === backgroundClip.property) {
+          if (isDefaultBox || boxSet) {
+            continue;
+          } else {
+            if (originValue === clipValue) {
+              bg.push(originValue);
+            } else {
+              bg.push(originValue, clipValue);
+            }
+            boxSet = true;
           }
         } else if (longhand === backgroundColor.property) {
           if (i === l - 1 && (value !== initialValues.get(longhand) || bgMap.has(longhand))) {
@@ -285,7 +289,6 @@ function parse(v) {
     const bgPosition = [];
     const bgSize = [];
     const bgRepeat = [];
-    const bgBox = [];
     const bgParts = parsers.splitValue(values[i], {
       delimiter: "/"
     });
@@ -294,17 +297,25 @@ function parse(v) {
     }
     const [bgPart1, bgPart2 = ""] = bgParts;
     const parts1 = parsers.splitValue(bgPart1);
+    let originFilled = false;
     for (const part of parts1) {
       let partValid = false;
       for (const [longhand, value] of shorthandFor) {
         if (parsers.isValidPropertyValue(longhand, part)) {
           partValid = true;
           switch (longhand) {
-            case backgroundClip.property:
-            case backgroundOrigin.property: {
+            case backgroundClip.property: {
               const parsedValue = value.parse(part);
               if (parsedValue) {
-                bgBox.push(parsedValue);
+                bg[longhand] = parsedValue;
+              }
+              break;
+            }
+            case backgroundOrigin.property: {
+              const parsedValue = value.parse(part);
+              if (parsedValue && !originFilled) {
+                bg[longhand] = parsedValue;
+                originFilled = true;
               }
               break;
             }
@@ -356,11 +367,18 @@ function parse(v) {
           if (parsers.isValidPropertyValue(longhand, part)) {
             partValid = true;
             switch (longhand) {
-              case backgroundClip.property:
-              case backgroundOrigin.property: {
+              case backgroundClip.property: {
                 const parsedValue = value.parse(part);
                 if (parsedValue) {
-                  bgBox.push(parsedValue);
+                  bg[longhand] = parsedValue;
+                }
+                break;
+              }
+              case backgroundOrigin.property: {
+                const parsedValue = value.parse(part);
+                if (parsedValue && !originFilled) {
+                  bg[longhand] = parsedValue;
+                  originFilled = true;
                 }
                 break;
               }
@@ -426,25 +444,6 @@ function parse(v) {
         bg[backgroundRepeat.property] = value;
       }
     }
-    if (bgBox.length) {
-      switch (bgBox.length) {
-        case 1: {
-          const [value] = bgBox;
-          bg[backgroundOrigin.property] = value;
-          bg[backgroundClip.property] = value;
-          break;
-        }
-        case 2: {
-          const [value1, value2] = bgBox;
-          bg[backgroundOrigin.property] = value1;
-          bg[backgroundClip.property] = value2;
-          break;
-        }
-        default: {
-          return undefined;
-        }
-      }
-    }
     bgValues.push(bg);
   }
   return bgValues;

package/lib/jsdom/living/nodes/Document-impl.js

@@ -212,6 +212,10 @@ class DocumentImpl extends NodeImpl {
     this._baseURLSerializedCache = null;
   }
 
+  _clearStyleCache() {
+    this._styleCache = new WeakMap();
+  }
+
   // The `DOMSelector` instance is lazily created, as it is somewhat expensive to create and not always needed.
   _getDOMSelector() {
     if (!this.#domSelector) {

package/lib/jsdom/living/nodes/Node-impl.js

@@ -19,7 +19,6 @@ const {
   isShadowRoot, shadowIncludingRoot, assignSlot, assignSlotableForTree, assignSlotable, signalSlotChange, isSlot,
   shadowIncludingInclusiveDescendantsIterator, shadowIncludingDescendantsIterator
 } = require("../helpers/shadow-dom");
-const { invalidateStyleCache } = require("../css/helpers/computed-style");
 
 function nodeEquals(a, b) {
   if (a.nodeType !== b.nodeType) {
@@ -240,11 +239,15 @@ class NodeImpl extends EventTargetImpl {
       this._childNodesList._update();
     }
     this._clearMemoizedQueries();
-    invalidateStyleCache(this);
+    if (this._attached) {
+      this._ownerDocument._clearStyleCache();
+    }
   }
 
   _childTextContentChangeSteps() {
-    invalidateStyleCache(this);
+    if (this._attached) {
+      this._ownerDocument._clearStyleCache();
+    }
   }
 
   _clearMemoizedQueries() {