Skip to content

Commit

Permalink
Add Filter Parameter (#327)
Browse files Browse the repository at this point in the history
This allows for conditionally processing imports based on their URLs.

Closes #279, #254, #299, #259
  • Loading branch information
0xcaff authored and RyanZim committed Feb 10, 2018
1 parent 7c863ea commit 5a99783
Show file tree
Hide file tree
Showing 9 changed files with 122 additions and 0 deletions.
10 changes: 10 additions & 0 deletions README.md
Expand Up @@ -35,6 +35,8 @@ If this behavior is not what you want, look at `skipDuplicates` option
please look at
[postcss-easy-import](https://github.com/trysound/postcss-easy-import)
(which use this plugin under the hood).
- Imports which are not modified (by `options.filter` or because they are remote
imports) are moved to the top of the output.
- **This plugin attempts to follow the CSS `@import` spec**; `@import`
statements must precede all other statements (besides `@charset`).

Expand Down Expand Up @@ -110,6 +112,14 @@ Checkout the [tests](test) for more examples.

### Options

### `filter`
Type: `Function`
Default: `() => true`

Only transform imports for which the test function returns `true`. Imports for
which the test function returns `false` will be left as is. The function gets
the path to import as an argument and should return a boolean.

#### `root`

Type: `String`
Expand Down
6 changes: 6 additions & 0 deletions index.js
Expand Up @@ -109,6 +109,7 @@ function applyMedia(bundle) {
function applyStyles(bundle, styles) {
styles.nodes = []

// Strip additional statements.
bundle.forEach(stmt => {
if (stmt.type === "import") {
stmt.node.parent = undefined
Expand Down Expand Up @@ -140,6 +141,11 @@ function parseStyles(result, styles, options, state, media) {
return
}

if (options.filter && !options.filter(stmt.uri)) {
// rejected by filter
return
}

return resolveImportId(result, stmt, options, state)
})
}, Promise.resolve())
Expand Down
17 changes: 17 additions & 0 deletions test/filter.js
@@ -0,0 +1,17 @@
// external tooling
import test from "ava"

// internal tooling
import checkFixture from "./helpers/check-fixture"

test("should filter all imported stylesheets", checkFixture, "filter-all", {
filter: () => false,
})

test("should filter some stylesheets", checkFixture, "filter-some", {
filter: url => url !== "foobar.css",
})

test("shouldn't accept ignored stylesheets", checkFixture, "filter-ignore", {
filter: () => true,
})
12 changes: 12 additions & 0 deletions test/fixtures/filter-all.css
@@ -0,0 +1,12 @@
@import "foo.css";
@import "foo.css" screen;
@import 'bar.css';
@import 'bar.css' screen;
@import url(baz.css);
@import url(baz.css) screen;
@import url("foobar.css");
@import url("foobar.css") screen and (min-width: 25em);
@import url('foobarbaz.css');
@import url('foobarbaz.css') print, screen and (min-width: 25em);

content{}
11 changes: 11 additions & 0 deletions test/fixtures/filter-all.expected.css
@@ -0,0 +1,11 @@
@import "foo.css";
@import "foo.css" screen;
@import 'bar.css';
@import 'bar.css' screen;
@import url(baz.css);
@import url(baz.css) screen;
@import url("foobar.css");
@import url("foobar.css") screen and (min-width: 25em);
@import url('foobarbaz.css');
@import url('foobarbaz.css') print, screen and (min-width: 25em);
content{}
15 changes: 15 additions & 0 deletions test/fixtures/filter-ignore.css
@@ -0,0 +1,15 @@
@import "ignore.css" (min-width: 25em);
@import "http://css";
@import "https://css";
@import 'http://css';
@import 'https://css';
@import url(http://css);
@import url(https://css);
@import url("http://css");
@import url("https://css");
@import url('http://css');
@import url('https://css');
@import url("//css");
@import url('//css');
@import url(//css);
content{}
19 changes: 19 additions & 0 deletions test/fixtures/filter-ignore.expected.css
@@ -0,0 +1,19 @@
@import "http://css" (min-width: 25em);
@import "http://css-screen" (min-width: 25em) and screen;
@import "http://css";
@import "https://css";
@import 'http://css';
@import 'https://css';
@import url(http://css);
@import url(https://css);
@import url("http://css");
@import url("https://css");
@import url('http://css');
@import url('https://css');
@import url("//css");
@import url('//css');
@import url(//css);
@media (min-width: 25em){
ignore{}
}
content{}
12 changes: 12 additions & 0 deletions test/fixtures/filter-some.css
@@ -0,0 +1,12 @@
@import "foo.css";
@import "foo.css" screen;
@import 'bar.css';
@import 'bar.css' screen;
@import url(baz.css);
@import url(baz.css) screen;
@import url("foobar.css");
@import url("foobar.css") screen and (min-width: 25em);
@import url('foobarbaz.css');
@import url('foobarbaz.css') print, screen and (min-width: 25em);

content{}
20 changes: 20 additions & 0 deletions test/fixtures/filter-some.expected.css
@@ -0,0 +1,20 @@

@import url("foobar.css");
@import url("foobar.css") screen and (min-width: 25em);
foo{}
@media screen{
foo{}
}
bar{}
@media screen{
bar{}
}
baz{}
@media screen{
baz{}
}
foobarbaz{}
@media print, screen and (min-width: 25em){
foobarbaz{}
}
content{}

0 comments on commit 5a99783

Please sign in to comment.