+Tab Atkins <tabatk...@google.com> On Tue, Feb 25, 2025 at 9:06 PM Alan Stearns <famuli...@gmail.com> wrote:
> This is a feature that is greatly desired by developers, and as such runs > increased risk that whatever gets shipped first gets heavily used and then > cannot be improved due to web compat. I think it’s premature to ship > without signals from other engines and without a TAG review. We should have > more time with this feature behind a flag. > > Another signal for implementing behind a feature flag for now: > https://blog.kizu.dev/intent-to-experiment-for-longer/ > > On Tuesday, February 25, 2025 at 4:26:25 AM UTC-8 and...@chromium.org > wrote: > >> Contact emails >> >> and...@chromium.org, se...@chromium.org >> >> Explainer >> >> https://css.oddbird.net/sasslike/mixins-functions >> >> Note: the explainer includes a description of mixins as well. This >> intent covers custom functions (@function) only. >> >> Specification >> >> https://drafts.csswg.org/css-mixins-1 >> >> Note: despite its shortname (css-mixins), the spec currently describes custom >> functions only. >> >> Summary >> >> Custom Functions are similar to custom properties >> <https://drafts.csswg.org/css-variables>, but instead of returning a >> single fixed value, it returns a value based on other custom properties, >> parameters, and conditionals. >> >> Example: Custom light-dark function: >> >> @function --light-dark(--light, --dark) { >> >> result: var(--light); >> >> @media (prefers-color-scheme: dark) { >> >> result: var(--dark); >> >> } >> >> } >> >> div { >> >> background-image: --light-dark(black-logo.png, white-logo.png); >> >> } >> >> Blink component >> >> Blink>CSS >> <https://issues.chromium.org/issues?q=customfield1222907:%22Blink%3ECSS%22> >> >> TAG review >> >> https://github.com/w3ctag/design-reviews/issues/1031 >> >> TAG review status >> >> Pending >> >> Risks >> >> Interoperability and Compatibility >> >> None >> >> >> Gecko: No signal ( >> https://github.com/mozilla/standards-positions/issues/1148) >> >> WebKit: No signal ( >> https://github.com/WebKit/standards-positions/issues/437) >> >> Web developers: Positive >> >> (Dug up what I could find per goo.gle/developer-signals): >> >> >> - >> >> >> >> https://medium.com/css-magic/custom-css-functions-the-next-big-leap-in-styling-5acbd69f5526 >> - >> >> >> >> https://johannesodland.github.io/2024/12/12/web-wish-12-custom-css-functions.html >> - >> >> “sorely needed functionality for authors” >> >> <https://github.com/w3ctag/design-reviews/issues/1031#issuecomment-2637024845> >> - LeaVerou <https://github.com/LeaVerou> >> - >> >> Appeared as a missing feature in State of CSS 2024 >> <https://2024.stateofcss.com/en-US/usage/#css_missing_features>. >> >> >> Other signals: >> >> WebView application risks >> >> None >> >> >> Debuggability >> >> The Devtools team is working on “basic support” for @function: >> https://docs.google.com/document/d/17UCa0XDXAG9EBx18w1fXAA9SL3V9Lr4vTptaXYyE1CA/ >> >> Unfortunately that doc requires @google.com to access, but “basic >> support” primarily means that callsites can be clicked, you’ll be taken to >> the relevant function, and you’ll be able to edit the contents of the >> function. >> >> Will this feature be supported on all six Blink platforms (Windows, Mac, >> Linux, ChromeOS, Android, and Android WebView)? >> >> Yes >> >> Is this feature fully tested by web-platform-tests >> <https://chromium.googlesource.com/chromium/src/+/main/docs/testing/web_platform_tests.md> >> ? >> >> Yes >> >> https://wpt.fyi/results/css/css-mixins >> >> >> - >> >> at-function-cssom.tentative.html >> >> <https://wpt.fyi/results/css/css-mixins/at-function-cssom.tentative.html?label=experimental&label=master&aligned> >> is >> marked tentative because the spec is currently missing a few obvious parts >> from the API. >> - >> >> The subtest "Indexed property getter" is failing due to a Bindings >> bug. This is an existing issue (likely low impact) that's unrelated to >> Custom Functions. crbug.com/333965945 >> - >> >> dashed-function-cycles.tentative.html >> >> <https://wpt.fyi/results/css/css-mixins/dashed-function-cycles.tentative.html?label=master&label=experimental&aligned> >> is >> marked tentative because the spec has not yet caught up with the >> resolution >> in https://github.com/w3c/csswg-drafts/issues/11500. >> >> >> In both cases, I’ll make sure we get these things edited so we can remove >> the .tentative suffixes before shipping. >> >> I do not plan to fix crbug.com/333965945 before shipping, which means >> that a failure on "Indexed property getter" is to be expected. I will not >> ship with any other test failures; unexpected red boxes on wpt.fyi may be >> considered temporary, usually due to Canary not having picked up the latest >> changes yet. >> >> Flag name on about://flags >> >> CSSFunctions >> >> Finch feature name >> >> CSSFunctions >> >> Requires code in //chrome? >> >> False >> >> Tracking bug >> >> https://issues.chromium.org/issues/325504770 >> >> Estimated milestones >> >> Shipping on desktop >> >> 136 >> >> Shipping on Android >> >> 136 >> >> Shipping on WebView >> >> 136 >> >> >> Anticipated spec changes >> >> At this point, I anticipate only one real spec change: disallowing >> argument values that begin with two dashes (‘--’). This is to make #11749 >> (named arguments) <https://github.com/w3c/csswg-drafts/issues/11749> >> possible in the future without compat concerns. >> >> All other issues are not interesting in terms of compat risk. >> >> Full list (only the top one being interesting): >> >> >> - >> >> #11749 [css-mixins-1] Named argument passing? >> <https://github.com/w3c/csswg-drafts/issues/11749> >> - >> >> This can be added later. However, we should reserve space for this >> in the syntax immediately, to avoid compat issues in the future. Issue >> 398887938 <https://issues.chromium.org/issues/398887938> tracks >> this. >> - >> >> #10558 [css-mixins] <dashed-function> syntax seems invalid >> <https://github.com/w3c/csswg-drafts/issues/10558> >> - >> >> Editorial issue. The commenter seems satisfied now: “So this issue >> may therefore be considered fixed” >> >> <https://github.com/w3c/csswg-drafts/issues/10558#issuecomment-2255746650> >> . >> - >> >> #10006 [css-mixins] Allow mixins/functions to be called via custom >> properties <https://github.com/w3c/csswg-drafts/issues/10006> >> - >> >> We can choose to add this later; it does not affect the API >> shipping now. >> - >> >> #9992 Proposal: CSS Variable Groups >> <https://github.com/w3c/csswg-drafts/issues/9992> >> - >> >> Same as the previous issue. >> - >> >> #9990 [css-values][css-variables][css-mixins] Generic fallback syntax >> for IACVT values <https://github.com/w3c/csswg-drafts/issues/9990> >> - >> >> Same as the previous issue. >> - >> >> #10222 [css-mixins] Proposal: @like rule for repurposing page default >> styles <https://github.com/w3c/csswg-drafts/issues/10222> >> - >> >> Unrelated to CSS Functions. (Marked css-mixins since it has >> conceptual similarities with mixins.) >> - >> >> #11500 [css-values] Short-circuit if() evaluation >> <https://github.com/w3c/csswg-drafts/issues/11500> >> - >> >> Resolved, just needs a spec edit. >> - >> >> #11455 [css-values-5][css-mixins-1] Add an if-test for local variables >> <https://github.com/w3c/csswg-drafts/issues/11455> >> - >> >> Same as the previous issue. >> - >> >> #11190 [css-functions-mixins] Handling superfluous arguments >> <https://github.com/w3c/csswg-drafts/issues/11190> >> - >> >> Same as the previous issue. >> - >> >> #10562 [css-mixins] Should result be mandatory in @function? >> <https://github.com/w3c/csswg-drafts/issues/10562> >> - >> >> Same as the previous issue. >> - >> >> #9350 Proposal: Custom CSS Functions & Mixins >> <https://github.com/w3c/csswg-drafts/issues/9350> >> - >> >> Same as the previous issue. >> >> >> Link to entry on the Chrome Platform Status >> >> https://chromestatus.com/feature/5179721933651968?gate=5074532782309376 >> >> Links to previous Intent discussions >> >> Intent to Prototype: >> https://groups.google.com/a/chromium.org/g/blink-dev/c/b-BTxKD-Ldc/m/1pyobjq7AQAJ >> >> -- You received this message because you are subscribed to the Google Groups "blink-dev" group. To unsubscribe from this group and stop receiving emails from it, send an email to blink-dev+unsubscr...@chromium.org. To view this discussion visit https://groups.google.com/a/chromium.org/d/msgid/blink-dev/CAKFBnUofT%2BKD_b7r28JUJRdUgCs9HJaFhStgZsg8QyTUfJgR3Q%40mail.gmail.com.