v1.0.6

NikolayMakhonin · Mar 10, 2019 · 1291730 · 1291730
1 parent 710ae05
commit 1291730
Show file tree

Hide file tree

Showing 8 changed files with 153 additions and 15 deletions.
diff --git a/HISTORY.md b/HISTORY.md
@@ -1,3 +1,8 @@
+1.0.6 / 2019-03-09
+===================
+
+  * Change ReadMe
+
 1.0.5 / 2019-03-09
 ===================
 

diff --git a/README.md b/README.md
@@ -19,6 +19,10 @@ When I have such a powerful tool at hand as JavaScript - it would not be wise no
 
 Styles written in JavaScript are not so convenient, but when extending even a small project, the power of the JavaScript language fully compensated for this drawback.
 
+# Demo
+
+[Converter](https://nikolaymakhonin.github.io/postcss-js-syntax-editor/) between [Postcss-Js-Syntax](https://github.com/NikolayMakhonin/postcss-js-syntax) and CSS
+
 # Description
 
 You can use your JS modules for compile CSS files.

diff --git a/dist/js/main/parse.js b/dist/js/main/parse.js
@@ -12,14 +12,27 @@ var _convertPostcssJs = require("./helpers/convert/convertPostcssJs");
 
 /* eslint-disable global-require */
 function parse(jsContent, options) {
-  // eslint-disable-next-line global-require
-  let jsModule = options.requireFromString ? options.requireFromString(jsContent, options.from) : require(options.from);
+  const jsModuleOrPromise = options.requireFromString ? options.requireFromString(jsContent, options.from) : require(options.from);
+  return promiseThenSync(jsModuleOrPromise, jsModule => {
+    if (jsModule.__esModule === true && typeof jsModule.default !== 'undefined') {
+      return jsModule.default;
+    }
 
-  if (jsModule.__esModule === true && typeof jsModule.default !== 'undefined') {
-    jsModule = jsModule.default;
+    return jsModule;
+  }, jsModule => (0, _convertPostcssJs.jsToPostcss)(jsModule, _parseNode.parseNode));
+}
+
+function promiseThenSync(promise, ...next) {
+  if (promise instanceof Promise) {
+    return promise.then(o => promiseThenSync(o, ...next));
+  }
+
+  if (next.length) {
+    promise = next.shift()(promise);
+    return promiseThenSync(promise, ...next);
   }
 
-  return (0, _convertPostcssJs.jsToPostcss)(jsModule, _parseNode.parseNode);
+  return promise;
 }
 
 var _default = parse;

diff --git a/dist/js/test/tests/main/main.js b/dist/js/test/tests/main/main.js
@@ -6,13 +6,30 @@ var _parse = require("../../../main/parse");
 
 var _postcss = _interopRequireDefault(require("postcss"));
 
-var _parse2 = _interopRequireDefault(require("postcss/lib/parse"));
-
 describe('main > main', function () {
   const postcssInstance = (0, _postcss.default)();
   it('postcss', function () {
     postcssInstance.process();
   });
+  xit('postcss async require', async function () {
+    const result = await postcssInstance.process('var color = \'red\'; {x: { color: color }}', {
+      parser: _parse.parse,
+      from: 'file.js',
+
+      async requireFromString() {
+        await new Promise(resolve => {
+          setTimeout(resolve, 10000);
+        });
+        return {
+          x: {
+            color: 'blue'
+          }
+        };
+      }
+
+    });
+    console.log(result.css);
+  });
   it('base', function () {// const node = {
     // 	nodes : [],
     // 	type  : 'root',

diff --git a/dist/mjs/main/parse.js b/dist/mjs/main/parse.js
@@ -2,13 +2,35 @@
 import { parseNode } from './helpers/convert/parseNode';
 import { jsToPostcss } from './helpers/convert/convertPostcssJs';
 export function parse(jsContent, options) {
-  // eslint-disable-next-line global-require
-  var jsModule = options.requireFromString ? options.requireFromString(jsContent, options.from) : require(options.from);
+  var jsModuleOrPromise = options.requireFromString ? options.requireFromString(jsContent, options.from) : require(options.from);
+  return promiseThenSync(jsModuleOrPromise, function (jsModule) {
+    if (jsModule.__esModule === true && typeof jsModule.default !== 'undefined') {
+      return jsModule.default;
+    }
 
-  if (jsModule.__esModule === true && typeof jsModule.default !== 'undefined') {
-    jsModule = jsModule.default;
+    return jsModule;
+  }, function (jsModule) {
+    return jsToPostcss(jsModule, parseNode);
+  });
+}
+
+function promiseThenSync(promise) {
+  for (var _len = arguments.length, next = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
+    next[_key - 1] = arguments[_key];
+  }
+
+  if (promise instanceof Promise) {
+    return promise.then(function (o) {
+      return promiseThenSync.apply(void 0, [o].concat(next));
+    });
   }
 
-  return jsToPostcss(jsModule, parseNode);
+  if (next.length) {
+    promise = next.shift()(promise);
+    return promiseThenSync.apply(void 0, [promise].concat(next));
+  }
+
+  return promise;
 }
+
 export default parse;
diff --git a/dist/mjs/test/tests/main/main.js b/dist/mjs/test/tests/main/main.js
@@ -1,11 +1,73 @@
+import _regeneratorRuntime from "@babel/runtime/regenerator";
+import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
 import { parse } from '../../../main/parse';
 import postcss from 'postcss';
-import postcssParse from 'postcss/lib/parse';
 describe('main > main', function () {
   var postcssInstance = postcss();
   it('postcss', function () {
     postcssInstance.process();
   });
+  xit('postcss async require',
+  /*#__PURE__*/
+  _asyncToGenerator(
+  /*#__PURE__*/
+  _regeneratorRuntime.mark(function _callee2() {
+    var result;
+    return _regeneratorRuntime.wrap(function _callee2$(_context2) {
+      while (1) {
+        switch (_context2.prev = _context2.next) {
+          case 0:
+            _context2.next = 2;
+            return postcssInstance.process('var color = \'red\'; {x: { color: color }}', {
+              parser: parse,
+              from: 'file.js',
+              requireFromString: function () {
+                var _requireFromString = _asyncToGenerator(
+                /*#__PURE__*/
+                _regeneratorRuntime.mark(function _callee() {
+                  return _regeneratorRuntime.wrap(function _callee$(_context) {
+                    while (1) {
+                      switch (_context.prev = _context.next) {
+                        case 0:
+                          _context.next = 2;
+                          return new Promise(function (resolve) {
+                            setTimeout(resolve, 10000);
+                          });
+
+                        case 2:
+                          return _context.abrupt("return", {
+                            x: {
+                              color: 'blue'
+                            }
+                          });
+
+                        case 3:
+                        case "end":
+                          return _context.stop();
+                      }
+                    }
+                  }, _callee);
+                }));
+
+                function requireFromString() {
+                  return _requireFromString.apply(this, arguments);
+                }
+
+                return requireFromString;
+              }()
+            });
+
+          case 2:
+            result = _context2.sent;
+            console.log(result.css);
+
+          case 4:
+          case "end":
+            return _context2.stop();
+        }
+      }
+    }, _callee2);
+  })));
   it('base', function () {// const node = {
     // 	nodes : [],
     // 	type  : 'root',

diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "postcss-js-syntax",
-  "version": "1.0.5",
+  "version": "1.0.6",
   "description": "For use powerful JavaScript syntax for compile CSS instead legacy preprocessors: SASS, LESS, Stylus, etc.",
   "author": "Nikolay Makhonin",
   "homepage": "https://github.com/NikolayMakhonin/postcss-js-syntax",

diff --git a/src/test/tests/main/main.js b/src/test/tests/main/main.js
@@ -1,6 +1,5 @@
 import {parse} from '../../../main/parse'
 import postcss from 'postcss'
-import postcssParse from 'postcss/lib/parse'
 
 describe('main > main', function () {
 	const postcssInstance = postcss()
@@ -9,6 +8,22 @@ describe('main > main', function () {
 		postcssInstance.process()
 	})
 
+	xit('postcss async require', async function () {
+		const result = await postcssInstance.process('var color = \'red\'; {x: { color: color }}', {
+			parser: parse,
+			from  : 'file.js',
+			async requireFromString() {
+				await new Promise(resolve => {
+					setTimeout(resolve, 10000)
+				})
+
+				return {x: {color: 'blue'}}
+			}
+		})
+
+		console.log(result.css)
+	})
+
 	it('base', function () {
 		// const node = {
 		// 	nodes : [],