Initial commit

This commit is contained in:
Patrick Marsceill
2017-03-09 13:16:08 -05:00
commit b7b0d0d7bf
4147 changed files with 401224 additions and 0 deletions

View File

@@ -0,0 +1,129 @@
# property-no-unknown
Disallow unknown properties.
```css
a { heigth: 100%; }
/** ↑
* These properties */
```
This rule considers properties defined in the [CSS Specifications and browser specific properties](https://github.com/betit/known-css-properties#source) to be known.
This rule ignores variables (`$sass`, `@less`, `--custom-property`).
This rule ignores vendor-prefixed properties (e.g., `-moz-align-self`, `-webkit-align-self`).
Use option `checkPrefixed` described below to turn on checking of vendor-prefixed properties.
## Options
### `true`
The following patterns are considered warnings:
```css
a {
colr: blue;
}
```
```css
a {
my-property: 1;
}
```
The following patterns are *not* considered warnings:
```css
a {
color: green;
}
```
```css
a {
fill: black;
}
```
```css
a {
-moz-align-self: center;
}
```
```css
a {
-webkit-align-self: center;
}
```
```css
a {
align-self: center;
}
```
## Optional secondary options
### `ignoreProperties: ["/regex/", "string"]`
Given:
```js
["/^my-/", "custom"]
```
The following patterns are *not* considered warnings:
```css
a {
my-property: 10px;
}
```
```css
a {
my-other-property: 10px;
}
```
```css
a {
custom: 10px;
}
```
### `checkPrefixed: true | false` (default: `false`)
If `true`, this rule will check vendor-prefixed properties.
For example with `true`:
The following patterns are *not* considered warnings:
```css
a {
-webkit-overflow-scrolling: auto;
}
```
```css
a {
-moz-box-flex: 0;
}
```
The following patterns are considered warnings:
```css
a {
-moz-align-self: center;
}
```
```css
a {
-moz-overflow-scrolling: center;
}
```

View File

@@ -0,0 +1,74 @@
"use strict"
const isCustomProperty = require("../../utils/isCustomProperty")
const isStandardSyntaxDeclaration = require("../../utils/isStandardSyntaxDeclaration")
const isStandardSyntaxProperty = require("../../utils/isStandardSyntaxProperty")
const optionsMatches = require("../../utils/optionsMatches")
const report = require("../../utils/report")
const ruleMessages = require("../../utils/ruleMessages")
const validateOptions = require("../../utils/validateOptions")
const _ = require("lodash")
const properties = require("known-css-properties").all
const postcss = require("postcss")
const ruleName = "property-no-unknown"
const messages = ruleMessages(ruleName, {
rejected: property => `Unexpected unknown property "${property}"`,
})
const rule = function (actual, options) {
return (root, result) => {
const validOptions = validateOptions(result, ruleName, { actual }, {
actual: options,
possible: {
ignoreProperties: [_.isString],
checkPrefixed: _.isBoolean,
},
optional: true,
})
if (!validOptions) {
return
}
const shouldCheckPrefixed = _.get(options, "checkPrefixed")
root.walkDecls(decl => {
const prop = decl.prop
if (!isStandardSyntaxProperty(prop)) {
return
}
if (!isStandardSyntaxDeclaration(decl)) {
return
}
if (isCustomProperty(prop)) {
return
}
if (!shouldCheckPrefixed && postcss.vendor.prefix(prop)) {
return
}
if (optionsMatches(options, "ignoreProperties", prop)) {
return
}
if (properties.indexOf(prop.toLowerCase()) !== -1) {
return
}
report({
message: messages.rejected(prop),
node: decl,
result,
ruleName,
})
})
}
}
rule.ruleName = ruleName
rule.messages = messages
module.exports = rule