[w3ctag/design-reviews] @property (#402)

こんにちはTAG!

I'm requesting a TAG review of:

  - Name: `@property` (part of CSS Properties and Values API Level 1, #318)
  - Specification URL: [The @property rule](https://drafts.css-houdini.org/css-properties-values-api/#at-property-rule)
  - GitHub issues: [https://github.com/w3c/css-houdini-drafts/issues], use `[css-properties-values-api]` prefix in the title of issues.
  - Tests: [Blink-specific test](https://cs.chromium.org/chromium/src/third_party/blink/web_tests/fast/css/css-properties-values-api/at-property.html?q=at-property.html&sq=package:chromium&g=0&l=1) (will "upgrade" to WPT).
  - Primary contacts (and their relationship to the specification): @andruud (Chrome implementor), @tabatkins (editor)
 - I added a (very) brief description of this feature near the bottom.

Further details:

  - Relevant time constraints or deadlines: **Dec 1st 2019**. I will attempt to ship this in December, or as soon as possible after December.
  - [x] I have read and filled out the [Self-Review Questionnare on Security and Privacy](https://www.w3.org/TR/security-privacy-questionnaire/). I can't think of any Security and Privacy issues related to this feature.
  - [x] I have reviewed the TAG's [API Design Principles](https://w3ctag.github.io/design-principles/)
  - The group where the work on this specification is: [CSSWG](https://www.w3.org/wiki/CSSWG) ([Houdini TF](https://github.com/w3c/css-houdini-drafts/wiki)).

We'd prefer the TAG provide feedback as (please select one):

  - [x] open issues in our GitHub repo for each point of feedback
  - [ ] open a single issue in our GitHub repo for the entire review
  - [ ] leave review feedback as a comment in this issue and @-notify [github usernames]

Description:

The `@property` rule is briefly put a way to [register a custom property](https://drafts.css-houdini.org/css-properties-values-api/#register-a-custom-property) in pure CSS.

For example, the two pieces of code (JS and CSS respectively) are equivalent, and result in exactly the same property registration:

```
CSS.registerProperty({
  name: '--x',
  syntax: '<length>',
  inherits: false,
  initialValue: '0px'
});
```

```
@property --x {
  syntax: "<length>";
  inherits: false;
  initial-value: 0px;
}
```

Authors often just want make a custom property animatable, and having to resort to JS just for this is not always desirable or possible (e.g. JS may be disabled).

See also the amount of exceitement on the [original proposal](https://github.com/w3c/css-houdini-drafts/issues/137) (reactions at the bottom of the first post).

Notable _resolved_ issues:

- [@property vs registerProperty](https://github.com/w3c/css-houdini-drafts/issues/845)
- [@property in shadow trees](https://github.com/w3c/css-houdini-drafts/issues/846)



-- 
You are receiving this because you are subscribed to this thread.
Reply to this email directly or view it on GitHub:
https://github.com/w3ctag/design-reviews/issues/402