Repository: webpack-contrib/css-loader
Pull request #1124 (2020-07-22 17:19:20)

refactor: change function arguments of the `import` option
BREAKING CHANGE: function arguments of the `import` option were changed, it is now `funciton(url, media, resourcePath) {}`

<!--
  HOLY CRAP a Pull Request. We ❤️ those!

  If you remove or skip this template, you'll make the 🐼 sad and the mighty god
  of Github will appear and pile-drive the close button from a great height
  while making animal noises.

  Please place an x (no spaces!) in all [ ] that apply
-->

This PR contains a:

- [ ] **bugfix**
- [ ] new **feature**
- [x] **code refactor**
- [x] **test update** <!-- if bug or feature is checked, this should be too -->
- [ ] **typo fix**
- [x] **metadata update**

### Motivation / Use-Case

For DX

### Breaking Changes

Yes

### Additional Info

No

codecov[bot]: # [Codecov](https://codecov.io/gh/webpack-contrib/css-loader/pull/1124?src=pr&el=h1) Report
> Merging [#1124](https://codecov.io/gh/webpack-contrib/css-loader/pull/1124?src=pr&el=desc) into [master](https://codecov.io/gh/webpack-contrib/css-loader/commit/c153fe6b1d76d24115001e163f5d39f8ed40ee22&el=desc) will **not change** coverage.
> The diff coverage is `100.00%`.

[![Impacted file tree graph](https://codecov.io/gh/webpack-contrib/css-loader/pull/1124/graphs/tree.svg?width=650&height=150&src=pr&token=DlN3OQ0JnO)](https://codecov.io/gh/webpack-contrib/css-loader/pull/1124?src=pr&el=tree)

```diff
@@           Coverage Diff           @@
##           master    #1124   +/-   ##
=======================================
  Coverage   99.50%   99.50%           
=======================================
  Files          10       10           
  Lines         605      605           
  Branches      186      186           
=======================================
  Hits          602      602           
  Misses          3        3           
```


| [Impacted Files](https://codecov.io/gh/webpack-contrib/css-loader/pull/1124?src=pr&el=tree) | Coverage Δ | |
|---|---|---|
| [src/plugins/postcss-import-parser.js](https://codecov.io/gh/webpack-contrib/css-loader/pull/1124/diff?src=pr&el=tree#diff-c3JjL3BsdWdpbnMvcG9zdGNzcy1pbXBvcnQtcGFyc2VyLmpz) | `100.00% <100.00%> (ø)` | |
| [src/utils.js](https://codecov.io/gh/webpack-contrib/css-loader/pull/1124/diff?src=pr&el=tree#diff-c3JjL3V0aWxzLmpz) | `98.76% <100.00%> (ø)` | |

------

[Continue to review full report at Codecov](https://codecov.io/gh/webpack-contrib/css-loader/pull/1124?src=pr&el=continue).
> **Legend** - [Click here to learn more](https://docs.codecov.io/docs/codecov-delta)
> `Δ = absolute <relative> (impact)`, `ø = not affected`, `? = missing data`
> Powered by [Codecov](https://codecov.io/gh/webpack-contrib/css-loader/pull/1124?src=pr&el=footer). Last update [c153fe6...edc8086](https://codecov.io/gh/webpack-contrib/css-loader/pull/1124?src=pr&el=lastupdated). Read the [comment docs](https://docs.codecov.io/docs/pull-request-comments).


Patch:
diff --git a/README.md b/README.md
index daec715..7dcaae6 100644
--- a/README.md
+++ b/README.md
@@ -262,13 +262,11 @@ module.exports = {
         test: /\.css$/i,
         loader: 'css-loader',
         options: {
-          import: (parsedImport, resourcePath) => {
-            // parsedImport.url - url of `@import`
-            // parsedImport.media - media query of `@import`
+          import: (url, media, resourcePath) => {
             // resourcePath - path to css file
 
             // Don't handle `style.css` import
-            if (parsedImport.url.includes('style.css')) {
+            if (url.includes('style.css')) {
               return false;
             }
 
diff --git a/src/plugins/postcss-import-parser.js b/src/plugins/postcss-import-parser.js
index 71dc394..297c70c 100644
--- a/src/plugins/postcss-import-parser.js
+++ b/src/plugins/postcss-import-parser.js
@@ -140,7 +140,7 @@ export default postcss.plugin(pluginName, (options) => async (css, result) => {
       media = valueParser.stringify(mediaNodes).trim().toLowerCase();
     }
 
-    if (options.filter && !options.filter({ url: normalizedUrl, media })) {
+    if (options.filter && !options.filter(normalizedUrl, media)) {
       // eslint-disable-next-line no-continue
       continue;
     }
diff --git a/src/utils.js b/src/utils.js
index 506aac4..6441cc7 100644
--- a/src/utils.js
+++ b/src/utils.js
@@ -93,9 +93,9 @@ function requestify(url, rootContext) {
 }
 
 function getFilter(filter, resourcePath) {
-  return (item) => {
+  return (...args) => {
     if (typeof filter === 'function') {
-      return filter(item, resourcePath);
+      return filter(...args, resourcePath);
     }
 
     return true;


Test patch:
diff --git a/test/import-option.test.js b/test/import-option.test.js
index 6a3d419..6a15475 100644
--- a/test/import-option.test.js
+++ b/test/import-option.test.js
@@ -52,11 +52,17 @@ describe('"import" option', () => {
 
   it('should work when "Function"', async () => {
     const compiler = getCompiler('./import/import.js', {
-      import: (parsedImport, resourcePath) => {
-        expect(typeof resourcePath === 'string').toBe(true);
+      import: (url, media, resourcePath) => {
+        expect(url).toBeDefined();
+
+        if (url === 'test-nested-media.css') {
+          expect(media).toBeDefined();
+        }
+
+        expect(resourcePath).toBeDefined();
 
         // Don't handle `test.css`
-        if (parsedImport.url.includes('test.css')) {
+        if (url.includes('test.css')) {
           return false;
         }