Cover the features listed in the State Of XYZ surveys #1624

captainbrosset · 2024-08-20T09:05:25Z

Here is another potentially useful burndown list to add features to the repo.
The CSS and HTML features are mentioned, in some way, in either State of CSS or State of HTML (over the past 4 years).
This was made by using the GraphQL API as detailed in Devographics/surveys#247 (comment).

The first ID on each row is the ID of features in State of CSS and State of HTML. Not to be confused with web-features IDs (even if they look very similar in some cases).
I've checked some of the boxes below according to what I think web-features already covers and added links to the relevant web-features-explorer pages.

I added the word "unclear" for some of the features, with my questions.

CSS (2021/2022/2023/2024)

HTML (2023/2024)

The text was updated successfully, but these errors were encountered:

SachaG · 2024-08-20T12:44:05Z

at_container (unclear: is this a group for the 2 above properties?)

Before style queries were a concern we used at_container to designate container size queries, but I decided to make the split more explicit going forward.

autonome · 2024-08-20T13:42:23Z

accordion_element

looks like details and exclusive details are already done, if that's what this is referring to.

captainbrosset · 2024-08-21T08:02:56Z

accordion_element

looks like details and exclusive details are already done, if that's what this is referring to.

I think this comes from https://2023.stateofhtml.com/en-US/usage/#html_missing_elements which is about missing html elements. So, by definition, we won't have a web-feature entry for it, or other missing elements (e.g. carousel, data table, tabs, ...)

ddbeck · 2024-08-21T15:11:37Z

The first ID on each row is the ID of features in State of CSS and State of HTML

Are there human-readable strings strings associated with the IDs? Some of the IDs are easy enough to figure out, but others are unclear.

SachaG · 2024-08-21T18:19:53Z

@ddbeck you can get more metadata via our GraphQL API https://graphiql.devographics.com/. Here's an example query:

query MyQuery {
  entity(id: "subgrid") {
    id
    name
  }
}

ddbeck · 2024-08-22T12:43:14Z

Thank you, @SachaG! I put the results in a gist: https://gist.github.com/ddbeck/5fc3c7b8c07f0e14d753579b03ef4fc9. This might be a good source of prior art for our name fields, too.

jamesnw · 2024-08-22T14:38:31Z

Here is the CSS section with a few updates with in progress PRs, and I used the Graphql explorer to confirm the open questions.

CSS (2021/2022/2023/2024)

accent_color https://web-platform-dx.github.io/web-features-explorer/features/accent-color/
anchor_positioning https://web-platform-dx.github.io/web-features-explorer/features/anchor-positioning/
aria_attributes https://web-platform-dx.github.io/web-features-explorer/features/aria-attribute-reflection/
aspect_ratio https://web-platform-dx.github.io/web-features-explorer/features/aspect-ratio/
at_container_size https://web-platform-dx.github.io/web-features-explorer/features/container-queries/
at_container_style https://web-platform-dx.github.io/web-features-explorer/features/contain-style/
at_container (likely not needed, this was used before size and style queries were introduced separately) See comment
at_property https://web-platform-dx.github.io/web-features-explorer/features/registered-custom-properties/ (this also covers CSS.registedrProperty())
at_scope https://web-platform-dx.github.io/web-features-explorer/features/scope/
backdrop_filter https://web-platform-dx.github.io/web-features-explorer/features/backdrop-filter/
blend_modes (In progress Add background-blend-mode and mix-blend-mode #1648)
break_rules https://web-platform-dx.github.io/web-features-explorer/features/page-breaks/
calc https://web-platform-dx.github.io/web-features-explorer/features/calc/
cascade_layers https://web-platform-dx.github.io/web-features-explorer/features/cascade-layers/
clip_path In Progress PR Add clipping, shapes and masking #1649
color_contrast
color_function https://web-platform-dx.github.io/web-features-explorer/features/color-function/
color_gamut
color_mix https://web-platform-dx.github.io/web-features-explorer/features/color-mix/
color_scheme https://web-platform-dx.github.io/web-features-explorer/features/color-scheme/
comparison_functions https://web-platform-dx.github.io/web-features-explorer/features/min-max-clamp/
conic_gradient https://web-platform-dx.github.io/web-features-explorer/features/conic-gradients/
containment - web-features defines inline-size, layout, and paint containment. This is the containment group
content_visibility https://web-platform-dx.github.io/web-features-explorer/features/content-visibility/
css_nesting https://web-platform-dx.github.io/web-features-explorer/features/nesting/
currentcolor (ongoing PR: Add Color types #1619)
discrete_properties_animations https://web-platform-dx.github.io/web-features-explorer/features/transition-behavior/
exponential_functions https://web-platform-dx.github.io/web-features-explorer/features/exp-functions/
feature_support_queries https://web-platform-dx.github.io/web-features-explorer/features/supports/
filter_effects
flexbox_gap https://web-platform-dx.github.io/web-features-explorer/features/flexbox-gap/
flexbox https://web-platform-dx.github.io/web-features-explorer/features/flexbox/
focus_visible https://web-platform-dx.github.io/web-features-explorer/features/focus-visible/
font_display (In Progress Add Font face features #1644 )
font_palette https://web-platform-dx.github.io/web-features-explorer/features/font-palette/
font_variant_numeric - In Progress PR - Add Font variant group and members #1621
font_variant - (PR - Add Font variant group and members #1621)
forced_colors (PR- Add forced-colors #1651 )
gradient_color_spaces https://web-platform-dx.github.io/web-features-explorer/features/conic-gradients/, specifically css.types.image.gradient.conic-gradient.interpolation_color_space
grid
hanging_punctuation
has_selector https://web-platform-dx.github.io/web-features-explorer/features/has/
houdini
image_function
image_set https://web-platform-dx.github.io/web-features-explorer/features/image-set/
individual_transform_properties https://web-platform-dx.github.io/web-features-explorer/features/individual-transforms/
initial_letter In progress PR- Add initial letter #1643
intrinsic_sizing
light_dark https://web-platform-dx.github.io/web-features-explorer/features/light-dark/
line_clamp https://web-platform-dx.github.io/web-features-explorer/features/line-clamp/
linear_easing_function https://web-platform-dx.github.io/web-features-explorer/features/linear-easing/
logical_properties
marker
masks https://web-platform-dx.github.io/web-features-explorer/features/masks/
media_queries_range_contexts https://web-platform-dx.github.io/web-features-explorer/features/media-query-range-syntax/
multi_column
nth_child_of_s https://web-platform-dx.github.io/web-features-explorer/features/nth-child-of/
object_fit
object_view_box https://web-platform-dx.github.io/web-features-explorer/features/object-view-box/
offset_path https://web-platform-dx.github.io/web-features-explorer/features/motion-path/
overflow_anchor
overscroll_behavior
perspective
pointer_events
position_sticky https://web-platform-dx.github.io/web-features-explorer/features/sticky-positioning/
prefers_color_scheme https://web-platform-dx.github.io/web-features-explorer/features/prefers-color-scheme/
prefers_contrast (PR Add prefers- media queries #1652)
prefers_reduced_data (PR Add prefers- media queries #1652)
prefers_reduced_motion (PR Add prefers- media queries #1652)
relative_colors https://web-platform-dx.github.io/web-features-explorer/features/relative-color/
scroll_behavior
scroll_snap https://web-platform-dx.github.io/web-features-explorer/features/scroll-snap/
scroll_timeline https://web-platform-dx.github.io/web-features-explorer/features/scroll-driven-animations/
scrollbar_gutter https://web-platform-dx.github.io/web-features-explorer/features/scrollbar-gutter/
shadow_dom_css
shapes In Progress PR Add clipping, shapes and masking #1649
sign_related_functions https://web-platform-dx.github.io/web-features-explorer/features/abs-sign/
stepped_value_functions
subgrid https://web-platform-dx.github.io/web-features-explorer/features/subgrid/
tabindex https://web-platform-dx.github.io/web-features-explorer/features/tabindex/
text_wrap_balance https://web-platform-dx.github.io/web-features-explorer/features/text-wrap-balance/
text_wrap_pretty https://web-platform-dx.github.io/web-features-explorer/features/text-wrap-pretty/
touch_action
trigonometric_functions https://web-platform-dx.github.io/web-features-explorer/features/trig-functions/
variable_fonts - PR In progress Add Font variant group and members #1621
variables https://web-platform-dx.github.io/web-features-explorer/features/custom-properties/
view_timeline https://web-platform-dx.github.io/web-features-explorer/features/scroll-driven-animations/
view_transitions https://web-platform-dx.github.io/web-features-explorer/features/view-transitions/
viewport_percentage_length_units https://web-platform-dx.github.io/web-features-explorer/features/viewport-units/
where_selector https://web-platform-dx.github.io/web-features-explorer/features/where/
wide_gamut_colors https://web-platform-dx.github.io/web-features-explorer/features/lab/ and https://web-platform-dx.github.io/web-features-explorer/features/oklab/
will_change https://web-platform-dx.github.io/web-features-explorer/features/will-change/
writing_modes (PR Add Writing mode, Vertical form controls #1693 )

@captainbrosset Would you prefer to copy this into the top description, or for me to maintain this list in this comment where I can edit it?

captainbrosset · 2024-08-22T17:29:50Z

@jamesnw I updated the top description based on your comment. Thank you!

captainbrosset mentioned this issue Aug 20, 2024

Coordinating web-features + State Of Devographics/surveys#247

Open

SachaG mentioned this issue Aug 20, 2024

ID standardization (web-features/Devographics/MDN/CanIUse/etc.) #1626

Open

SondraE mentioned this issue Aug 21, 2024

Add initial letter #1643

Merged

This was referenced Aug 22, 2024

Add background-blend-mode and mix-blend-mode #1648

Open

Add clipping, shapes and masking #1649

Merged

Add forced-colors #1651

Merged

Add prefers- media queries #1652

Closed

ddbeck added feature definition Creating or defining new features or groups of features. tracking Issues that track other issues labels Aug 26, 2024

jamesnw mentioned this issue Aug 27, 2024

Add Media queries #1673

Merged

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Cover the features listed in the State Of XYZ surveys #1624

Cover the features listed in the State Of XYZ surveys #1624

captainbrosset commented Aug 20, 2024 •

edited

Loading

SachaG commented Aug 20, 2024

autonome commented Aug 20, 2024

captainbrosset commented Aug 21, 2024

ddbeck commented Aug 21, 2024

SachaG commented Aug 21, 2024

ddbeck commented Aug 22, 2024

jamesnw commented Aug 22, 2024 •

edited

Loading

captainbrosset commented Aug 22, 2024

Cover the features listed in the State Of XYZ surveys #1624

Cover the features listed in the State Of XYZ surveys #1624

Comments

captainbrosset commented Aug 20, 2024 • edited Loading

CSS (2021/2022/2023/2024)

HTML (2023/2024)

SachaG commented Aug 20, 2024

autonome commented Aug 20, 2024

captainbrosset commented Aug 21, 2024

ddbeck commented Aug 21, 2024

SachaG commented Aug 21, 2024

ddbeck commented Aug 22, 2024

jamesnw commented Aug 22, 2024 • edited Loading

CSS (2021/2022/2023/2024)

captainbrosset commented Aug 22, 2024

captainbrosset commented Aug 20, 2024 •

edited

Loading

jamesnw commented Aug 22, 2024 •

edited

Loading