1287171 - Implement DevTools support for Properties & Values API

Status: RESOLVED DUPLICATE of bug 1841021

(DevTools :: Inspector, enhancement, P3)

Description

[Jonathan Chan [:jyc]]

Implement support for the CSS Properties & Values API ( https://drafts.css-houdini.org/css-properties-values-api/ ) in devtools.

Placeholder bug, still working out what this would entail!

Comment 1

[Jonathan Chan [:jyc]]

Thanks for the help!
Tentative list of things I've seen:

- The Computed tab in the Inspector currently only seems to show standard properties. Because custom properties can be animated and that requires computing them, would it make sense to include them too? The patches add a new computed variables style struct specifically for registered custom properties, so this should be not hard.
- The Rules tab strikes out declarations that don't type correctly. I think that this needs to be updated for custom properties. If there is a cycle in variable declarations, that becomes invalid at compute time -- should these declarations get strikes too? The patches modify CSSVariableDeclarations so it's possible to get which variable declaration is actually used, so I think that this should be not hard either. If a declaration involves a cycle, then it will be used but will have no computed value.

Comment 2

[Patrick Brosset <:pbro>]

Triaging as enhancement for now.
In terms of priority, could you help me assess this? What's the priority of the corresponding platform bug to implement custom properties (bug 1273706)?
When do you expect it to land? Will it be enabled by default or ship hidden behind a pref?

Comment 3

[Daniel Holbert [:dholbert]]

I'll steal the needinfo on this.

(In reply to Patrick Brosset <:pbro> (PTO until August 16, not doing reviews) from comment #2)
> Triaging as enhancement for now.

That sounds good.

> In terms of priority, could you help me assess this? What's the priority of
> the corresponding platform bug to implement custom properties (bug 1273706)?

Probably low-priority from a devtools perspective. (Zero priority until the dependent bug has landed and there's something to test.)  Priority level will be in part based on how well these custom properties get already exposed in existing devtools.

> When do you expect it to land?

Within the next few weeks, probably. (undergoing review now.)

> Will it be enabled by default or ship hidden
> behind a pref?

It'll be hidden behind a pref (tentatively named "layout.css.properties_and_values.enabled") for now.

I expect we'll do the standard "enable on Nightly/Aurora for testing, but not in release builds" partial-enabling after it's gotten some baking & opt-in nightly testing.

Comment 4

[Sebastian Zartner [:sebo]]

I suspect that it would also be useful for authors to be able to get from the property within the Rules or Computed panel to their declaration in JavaScript within the Debugger panel or in CSS in the Style Editor.
It might also be worth exposing their definition info (initial value, syntax, and whether it inherits) directly within the Rules and Computed panel.

Sebastian

Comment 5

[Frédéric Wang Nélar]

Can we mark this as a duplicate of bug 1841021?

Comment 6

[Sebastian Zartner [:sebo]]

It looks like bug 1841021 is more active. So yes. Let's close this one.

Sebastian