Re: [csswg-drafts] [css-backgrounds] Always serialize 'background-size' and `mask-size` as two values (#7802)

https://discuss.httparchive.org/ is also a good place to ask. Docs at https://har.fyi/ (but the docs don't yet cover the `parsed_css` table). 

I can take a stab at running a query. Results for 1% subset:


Row | client | pages_with_background_size | pages_with_single_value_len_pct | pages_with_single_value_auto | total_pages | pct_pages_with_background_size | pct_pages_with_single_value_len_pct | pct_pages_with_single_value_auto
-- | -- | -- | -- | -- | -- | -- | -- | --
1 | desktop | 198050 | 115811 | 63574 | 223050 | 0.887917507285362 | 0.51921542255099751 | 0.28502129567361578
2 | mobile | 251838 | 144267 | 75721 | 281564 | 0.894425423704735 | 0.51237729255160458 | 0.26892997684363057

This is surprisingly high.

However, to assess compat, what we really want to look for are pages that get the serialization and expect one vs two values. This is probably not feasible with httparchive, but maybe with a use counter.

<details><summary>Query</summary>

I started with https://github.com/HTTPArchive/almanac.httparchive.org/blob/main/sql/2022/css/box_sizing.sql (linked from https://almanac.httparchive.org/en/2022/css ) and modified it to check for `background-size` instead, then asked ChatGPT o3 to further modify the query. The utility script is available here https://storage.cloud.google.com/httparchive/lib/css-utils.js

```
#standardSQL
--------------------------------------------------------------------------------
-- Temporary JS UDFs ------------------------------------------------------------
--------------------------------------------------------------------------------
CREATE TEMPORARY FUNCTION countBackgroundSizeDeclarationsAny(css STRING)
RETURNS NUMERIC
LANGUAGE js
OPTIONS (library = "gs://httparchive/lib/css-utils.js")
AS r'''
try {
  const ast = JSON.parse(css);
  /* Count every background-size declaration, regardless of value */
  return countDeclarations(ast.stylesheet.rules,
                           {properties: /^(background-size)$/});
} catch (e) {
  return null;
}
''';

CREATE TEMPORARY FUNCTION countBackgroundSizeDeclarationsSingleAuto(css STRING)
RETURNS NUMERIC
LANGUAGE js
OPTIONS (library = "gs://httparchive/lib/css-utils.js")
AS r'''
try {
  const ast = JSON.parse(css);
  /* Count only single-value background-size declarations equal to “auto” */
  return countDeclarations(ast.stylesheet.rules,
                           {properties: /^(background-size)$/,
                            values: /^\s*auto\s*$/i});
} catch (e) {
  return null;
}
''';

CREATE TEMPORARY FUNCTION countBackgroundSizeDeclarationsSingleLenPct(css STRING)
RETURNS NUMERIC
LANGUAGE js
OPTIONS (library = "gs://httparchive/lib/css-utils.js")
AS r'''
try {
  const ast = JSON.parse(css);
  /* Count single-value background-size declarations that are a length or percentage
     (and explicitly NOT “auto”). */
  return countDeclarations(ast.stylesheet.rules,
                           {properties: /^(background-size)$/,
                            values: /^\s*(\d+(\.\d+)?([a-zA-Z]+|%))\s*$/});
} catch (e) {
  return null;
}
''';

--------------------------------------------------------------------------------
-- Main query ------------------------------------------------------------------
--------------------------------------------------------------------------------
WITH page_counts AS (
  SELECT
    client,
    page,

    --  Any background-size declarations (no value filter)
    SUM(countBackgroundSizeDeclarationsAny(css))           AS any_decls,

    --  Single-value = “auto”
    SUM(countBackgroundSizeDeclarationsSingleAuto(css))    AS auto_single_decls,

    --  Single-value = length / percentage
    SUM(countBackgroundSizeDeclarationsSingleLenPct(css))  AS lenpct_single_decls
  FROM
    `httparchive.crawl.parsed_css`
    TABLESAMPLE SYSTEM (1 PERCENT)
  WHERE
    date = '2025-07-01'
  GROUP BY
    client,
    page
)

SELECT
  client,

  --------------------------------------------------------------------------
  -- raw page counts -------------------------------------------------------
  --------------------------------------------------------------------------
  COUNTIF(any_decls            > 0) AS pages_with_background_size,
  COUNTIF(lenpct_single_decls  > 0) AS pages_with_single_value_len_pct,
  COUNTIF(auto_single_decls    > 0) AS pages_with_single_value_auto,
  COUNT(0)                           AS total_pages,

  --------------------------------------------------------------------------
  -- percentages -----------------------------------------------------------
  --------------------------------------------------------------------------
  SAFE_DIVIDE(COUNTIF(any_decls           > 0), COUNT(0))
      AS pct_pages_with_background_size,
  SAFE_DIVIDE(COUNTIF(lenpct_single_decls > 0), COUNT(0))
      AS pct_pages_with_single_value_len_pct,
  SAFE_DIVIDE(COUNTIF(auto_single_decls   > 0), COUNT(0))
      AS pct_pages_with_single_value_auto

FROM page_counts
GROUP BY client
ORDER BY client;

```

-- 
GitHub Notification of comment by zcorpan
Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/7802#issuecomment-3154095855 using your GitHub account


-- 
Sent via github-notify-ml as configured in https://github.com/w3c/github-notify-ml-config

Received on Tuesday, 5 August 2025 08:30:53 UTC