From 33aebed87de36efa3069067cee00141bebf4ebd4 Mon Sep 17 00:00:00 2001
From: Akshay Jat <akshayjat06@gmail.com>
Date: Mon, 8 Oct 2018 06:15:09 -0700
Subject: [PATCH] fix(addStyles): support exports of transpiled transforms
 (`options.transform`) (#333)

---
 README.md                        |  2 ++
 lib/addStyles.js                 |  4 +++-
 test/basic.test.js               | 25 +++++++++++++++++++++++++
 test/transforms/transform_es6.js |  3 +++
 4 files changed, 33 insertions(+), 1 deletion(-)
 create mode 100644 test/transforms/transform_es6.js

diff --git a/README.md b/README.md
index 1c7e5f15..ee8226a4 100644
--- a/README.md
+++ b/README.md
@@ -246,6 +246,8 @@ A `transform` is a function that can modify the css just before it is loaded int
 This function will be called on the css that is about to be loaded and the return value of the function will be loaded into the page instead of the original css.
 If the return value of the `transform` function is falsy, the css will not be loaded into the page at all.
 
+> :Warning: In case you are using ES Module syntax in `tranform.js` then, you **need to transpile** it or otherwise it will throw an `{Error}`.
+
 **webpack.config.js**
 ```js
 {
diff --git a/lib/addStyles.js b/lib/addStyles.js
index 077a368f..c80fd2d0 100644
--- a/lib/addStyles.js
+++ b/lib/addStyles.js
@@ -254,7 +254,9 @@ function addStyle (obj, options) {
 
 	// If a transform function was defined, run it on the css
 	if (options.transform && obj.css) {
-	    result = options.transform(obj.css);
+	    result = typeof options.transform === 'function'
+		 ? options.transform(obj.css) 
+		 : options.transform.default(obj.css);
 
 	    if (result) {
 	    	// If transform returns a value, use that instead of the original css.
diff --git a/test/basic.test.js b/test/basic.test.js
index 22c9baad..194d5140 100644
--- a/test/basic.test.js
+++ b/test/basic.test.js
@@ -536,6 +536,31 @@ describe("basic tests", function() {
 
       runCompilerTest(expected, done);
     });
+
+    it("es6 export: should throw error transform is not a function", function(done) {
+      const transform = require('./transforms/transform_es6');
+      styleLoaderOptions.transform = 'test/transforms/transform_es6';
+
+      // const expectedTansformedStyle = transform(requiredStyle);
+      const expected = new TypeError('transform is not a function').message;
+
+      runCompilerTest(expected, done, function() { 
+        try { 
+          let test = transform(requiredStyle);
+        } catch(error) { 
+          return error.message;
+        } });
+    });
+
+    it("es6 export: should not throw any error", function(done) {
+      const transform = require('./transforms/transform_es6');
+      styleLoaderOptions.transform = 'test/transforms/transform_es6';
+
+      const expectedTansformedStyle = transform[Object.keys(transform)[0]](requiredStyle);
+      const expected = [existingStyle, expectedTansformedStyle].join("\n");
+
+      runCompilerTest(expected, done);
+    });
   });
 
   describe("HMR", function() {
diff --git a/test/transforms/transform_es6.js b/test/transforms/transform_es6.js
new file mode 100644
index 00000000..a2b0eecb
--- /dev/null
+++ b/test/transforms/transform_es6.js
@@ -0,0 +1,3 @@
+exports.default = function (css) {
+    return css.replace('.required', '.transformed');
+}
\ No newline at end of file