less 3.10.0-beta.2 → 3.10.3

package/lib/less-browser/image-size.js

@@ -0,0 +1,28 @@
+
+import functionRegistry from './../less/functions/function-registry';
+
+export default () => {
+    function imageSize() {
+        throw {
+            type: 'Runtime',
+            message: 'Image size functions are not supported in browser version of less'
+        };
+    }
+
+    const imageFunctions = {
+        'image-size': function(filePathNode) {
+            imageSize(this, filePathNode);
+            return -1;
+        },
+        'image-width': function(filePathNode) {
+            imageSize(this, filePathNode);
+            return -1;
+        },
+        'image-height': function(filePathNode) {
+            imageSize(this, filePathNode);
+            return -1;
+        }
+    };
+
+    functionRegistry.addMultiple(imageFunctions);
+};

package/lib/less-browser/index.js

@@ -0,0 +1,285 @@
+//
+// index.js
+// Should expose the additional browser functions on to the less object
+//
+import {addDataAttr} from './utils';
+import lessRoot from '../less';
+import browser from './browser';
+import FM from './file-manager';
+import PluginLoader from './plugin-loader';
+import LogListener from './log-listener';
+import ErrorReporting from './error-reporting';
+import Cache from './cache';
+import ImageSize from './image-size';
+
+export default (window, options) => {
+    const document = window.document;
+    const less = lessRoot();
+
+    less.options = options;
+    const environment = less.environment;
+    const FileManager = FM(options, less.logger);
+    const fileManager = new FileManager();
+    environment.addFileManager(fileManager);
+    less.FileManager = FileManager;
+    less.PluginLoader = PluginLoader;
+
+    LogListener(less, options);
+    const errors = ErrorReporting(window, less, options);
+    const cache = less.cache = options.cache || Cache(window, options, less.logger);
+    ImageSize(less.environment);
+
+    // Setup user functions - Deprecate?
+    if (options.functions) {
+        less.functions.functionRegistry.addMultiple(options.functions);
+    }
+
+    const typePattern = /^text\/(x-)?less$/;
+
+    function clone(obj) {
+        const cloned = {};
+        for (const prop in obj) {
+            if (obj.hasOwnProperty(prop)) {
+                cloned[prop] = obj[prop];
+            }
+        }
+        return cloned;
+    }
+
+    // only really needed for phantom
+    function bind(func, thisArg) {
+        const curryArgs = Array.prototype.slice.call(arguments, 2);
+        return function() {
+            const args = curryArgs.concat(Array.prototype.slice.call(arguments, 0));
+            return func.apply(thisArg, args);
+        };
+    }
+
+    function loadStyles(modifyVars) {
+        const styles = document.getElementsByTagName('style');
+        let style;
+
+        for (let i = 0; i < styles.length; i++) {
+            style = styles[i];
+            if (style.type.match(typePattern)) {
+                const instanceOptions = clone(options);
+                instanceOptions.modifyVars = modifyVars;
+                const lessText = style.innerHTML || '';
+                instanceOptions.filename = document.location.href.replace(/#.*$/, '');
+
+                /* jshint loopfunc:true */
+                // use closure to store current style
+                less.render(lessText, instanceOptions,
+                    bind((style, e, result) => {
+                        if (e) {
+                            errors.add(e, 'inline');
+                        } else {
+                            style.type = 'text/css';
+                            if (style.styleSheet) {
+                                style.styleSheet.cssText = result.css;
+                            } else {
+                                style.innerHTML = result.css;
+                            }
+                        }
+                    }, null, style));
+            }
+        }
+    }
+
+    function loadStyleSheet(sheet, callback, reload, remaining, modifyVars) {
+
+        const instanceOptions = clone(options);
+        addDataAttr(instanceOptions, sheet);
+        instanceOptions.mime = sheet.type;
+
+        if (modifyVars) {
+            instanceOptions.modifyVars = modifyVars;
+        }
+
+        function loadInitialFileCallback(loadedFile) {
+            const data = loadedFile.contents;
+            const path = loadedFile.filename;
+            const webInfo = loadedFile.webInfo;
+
+            const newFileInfo = {
+                currentDirectory: fileManager.getPath(path),
+                filename: path,
+                rootFilename: path,
+                rewriteUrls: instanceOptions.rewriteUrls
+            };
+
+            newFileInfo.entryPath = newFileInfo.currentDirectory;
+            newFileInfo.rootpath = instanceOptions.rootpath || newFileInfo.currentDirectory;
+
+            if (webInfo) {
+                webInfo.remaining = remaining;
+
+                const css = cache.getCSS(path, webInfo, instanceOptions.modifyVars);
+                if (!reload && css) {
+                    webInfo.local = true;
+                    callback(null, css, data, sheet, webInfo, path);
+                    return;
+                }
+
+            }
+
+            // TODO add tests around how this behaves when reloading
+            errors.remove(path);
+
+            instanceOptions.rootFileInfo = newFileInfo;
+            less.render(data, instanceOptions, (e, result) => {
+                if (e) {
+                    e.href = path;
+                    callback(e);
+                } else {
+                    cache.setCSS(sheet.href, webInfo.lastModified, instanceOptions.modifyVars, result.css);
+                    callback(null, result.css, data, sheet, webInfo, path);
+                }
+            });
+        }
+
+        fileManager.loadFile(sheet.href, null, instanceOptions, environment)
+            .then(loadedFile => {
+                loadInitialFileCallback(loadedFile);
+            }).catch(err => {
+                console.log(err);
+                callback(err);
+            });
+
+    }
+
+    function loadStyleSheets(callback, reload, modifyVars) {
+        for (let i = 0; i < less.sheets.length; i++) {
+            loadStyleSheet(less.sheets[i], callback, reload, less.sheets.length - (i + 1), modifyVars);
+        }
+    }
+
+    function initRunningMode() {
+        if (less.env === 'development') {
+            less.watchTimer = setInterval(() => {
+                if (less.watchMode) {
+                    fileManager.clearFileCache();
+                    loadStyleSheets((e, css, _, sheet, webInfo) => {
+                        if (e) {
+                            errors.add(e, e.href || sheet.href);
+                        } else if (css) {
+                            browser.createCSS(window.document, css, sheet);
+                        }
+                    });
+                }
+            }, options.poll);
+        }
+    }
+
+    //
+    // Watch mode
+    //
+    less.watch   = function () {
+        if (!less.watchMode ) {
+            less.env = 'development';
+            initRunningMode();
+        }
+        this.watchMode = true;
+        return true;
+    };
+
+    less.unwatch = function () {clearInterval(less.watchTimer); this.watchMode = false; return false; };
+
+    //
+    // Synchronously get all <link> tags with the 'rel' attribute set to
+    // "stylesheet/less".
+    //
+    less.registerStylesheetsImmediately = () => {
+        const links = document.getElementsByTagName('link');
+        less.sheets = [];
+
+        for (let i = 0; i < links.length; i++) {
+            if (links[i].rel === 'stylesheet/less' || (links[i].rel.match(/stylesheet/) &&
+                (links[i].type.match(typePattern)))) {
+                less.sheets.push(links[i]);
+            }
+        }
+    };
+
+    //
+    // Asynchronously get all <link> tags with the 'rel' attribute set to
+    // "stylesheet/less", returning a Promise.
+    //
+    less.registerStylesheets = () => new Promise((resolve, reject) => {
+        less.registerStylesheetsImmediately();
+        resolve();
+    });
+
+    //
+    // With this function, it's possible to alter variables and re-render
+    // CSS without reloading less-files
+    //
+    less.modifyVars = record => less.refresh(true, record, false);
+
+    less.refresh = (reload, modifyVars, clearFileCache) => {
+        if ((reload || clearFileCache) && clearFileCache !== false) {
+            fileManager.clearFileCache();
+        }
+        return new Promise((resolve, reject) => {
+            let startTime;
+            let endTime;
+            let totalMilliseconds;
+            let remainingSheets;
+            startTime = endTime = new Date();
+
+            // Set counter for remaining unprocessed sheets
+            remainingSheets = less.sheets.length;
+
+            if (remainingSheets === 0) {
+
+                endTime = new Date();
+                totalMilliseconds = endTime - startTime;
+                less.logger.info('Less has finished and no sheets were loaded.');
+                resolve({
+                    startTime,
+                    endTime,
+                    totalMilliseconds,
+                    sheets: less.sheets.length
+                });
+
+            } else {
+                // Relies on less.sheets array, callback seems to be guaranteed to be called for every element of the array
+                loadStyleSheets((e, css, _, sheet, webInfo) => {
+                    if (e) {
+                        errors.add(e, e.href || sheet.href);
+                        reject(e);
+                        return;
+                    }
+                    if (webInfo.local) {
+                        less.logger.info(`Loading ${sheet.href} from cache.`);
+                    } else {
+                        less.logger.info(`Rendered ${sheet.href} successfully.`);
+                    }
+                    browser.createCSS(window.document, css, sheet);
+                    less.logger.info(`CSS for ${sheet.href} generated in ${new Date() - endTime}ms`);
+
+                    // Count completed sheet
+                    remainingSheets--;
+
+                    // Check if the last remaining sheet was processed and then call the promise
+                    if (remainingSheets === 0) {
+                        totalMilliseconds = new Date() - startTime;
+                        less.logger.info(`Less has finished. CSS generated in ${totalMilliseconds}ms`);
+                        resolve({
+                            startTime,
+                            endTime,
+                            totalMilliseconds,
+                            sheets: less.sheets.length
+                        });
+                    }
+                    endTime = new Date();
+                }, reload, modifyVars);
+            }
+
+            loadStyles(modifyVars);
+        });
+    };
+
+    less.refreshStyles = loadStyles;
+    return less;
+};

package/lib/less-browser/log-listener.js

@@ -0,0 +1,42 @@
+export default (less, options) => {
+    const logLevel_debug = 4;
+    const logLevel_info = 3;
+    const logLevel_warn = 2;
+    const logLevel_error = 1;
+
+    // The amount of logging in the javascript console.
+    // 3 - Debug, information and errors
+    // 2 - Information and errors
+    // 1 - Errors
+    // 0 - None
+    // Defaults to 2
+    options.logLevel = typeof options.logLevel !== 'undefined' ? options.logLevel : (options.env === 'development' ?  logLevel_info : logLevel_error);
+
+    if (!options.loggers) {
+        options.loggers = [{
+            debug: function(msg) {
+                if (options.logLevel >= logLevel_debug) {
+                    console.log(msg);
+                }
+            },
+            info: function(msg) {
+                if (options.logLevel >= logLevel_info) {
+                    console.log(msg);
+                }
+            },
+            warn: function(msg) {
+                if (options.logLevel >= logLevel_warn) {
+                    console.warn(msg);
+                }
+            },
+            error: function(msg) {
+                if (options.logLevel >= logLevel_error) {
+                    console.error(msg);
+                }
+            }
+        }];
+    }
+    for (let i = 0; i < options.loggers.length; i++) {
+        less.logger.addListener(options.loggers[i]);
+    }
+};

package/lib/less-browser/plugin-loader.js

@@ -0,0 +1,26 @@
+// TODO: Add tests for browser @plugin
+/* global window */
+
+import AbstractPluginLoader from '../less/environment/abstract-plugin-loader.js';
+
+/**
+ * Browser Plugin Loader
+ */
+class PluginLoader extends AbstractPluginLoader {
+    constructor(less) {
+        super();
+
+        this.less = less;
+        // Should we shim this.require for browser? Probably not?
+    }
+
+    loadPlugin(filename, basePath, context, environment, fileManager) {
+        return new Promise((fulfill, reject) => {
+            fileManager.loadFile(filename, basePath, context, environment)
+                .then(fulfill).catch(reject);
+        });
+    }
+}
+
+export default PluginLoader;
+

package/lib/less-browser/utils.js

@@ -0,0 +1,24 @@
+
+export function extractId(href) {
+    return href.replace(/^[a-z-]+:\/+?[^\/]+/, '')  // Remove protocol & domain
+        .replace(/[\?\&]livereload=\w+/, '')        // Remove LiveReload cachebuster
+        .replace(/^\//, '')                         // Remove root /
+        .replace(/\.[a-zA-Z]+$/, '')                // Remove simple extension
+        .replace(/[^\.\w-]+/g, '-')                 // Replace illegal characters
+        .replace(/\./g, ':');                       // Replace dots with colons(for valid id)
+}
+
+export function addDataAttr(options, tag) {
+    for (const opt in tag.dataset) {
+        if (tag.dataset.hasOwnProperty(opt)) {
+            if (opt === 'env' || opt === 'dumpLineNumbers' || opt === 'rootpath' || opt === 'errorReporting') {
+                options[opt] = tag.dataset[opt];
+            } else {
+                try {
+                    options[opt] = JSON.parse(tag.dataset[opt]);
+                }
+                catch (_) {}
+            }
+        }
+    }
+}

package/lib/less-node/environment.js

@@ -0,0 +1,16 @@
+export default {
+    encodeBase64: function encodeBase64(str) {
+        // Avoid Buffer constructor on newer versions of Node.js.
+        const buffer = (Buffer.from ? Buffer.from(str) : (new Buffer(str)));
+        return buffer.toString('base64');
+    },
+    mimeLookup: function (filename) {
+        return require('mime').lookup(filename);
+    },
+    charsetLookup: function (mime) {
+        return require('mime').charsets.lookup(mime);
+    },
+    getSourceMapGenerator: function getSourceMapGenerator() {
+        return require('source-map').SourceMapGenerator;
+    }
+};

package/lib/less-node/file-manager.js

@@ -0,0 +1,177 @@
+import path from 'path';
+import fs from './fs';
+import AbstractFileManager from '../less/environment/abstract-file-manager.js';
+
+class FileManager extends AbstractFileManager {
+    constructor() {
+        super();
+
+        this.contents = {};
+    }
+
+    supports(filename, currentDirectory, options, environment) {
+        return true;
+    }
+
+    supportsSync(filename, currentDirectory, options, environment) {
+        return true;
+    }
+
+    loadFile(filename, currentDirectory, options, environment, callback) {
+        let fullFilename;
+        const isAbsoluteFilename = this.isPathAbsolute(filename);
+        const filenamesTried = [];
+        const self = this;
+        const prefix = filename.slice(0, 1);
+        const explicit = prefix === '.' || prefix === '/';
+        let result = null;
+        let isNodeModule = false;
+        const npmPrefix = 'npm://';
+
+        options = options || {};
+
+        const paths = isAbsoluteFilename ? [''] : [currentDirectory];
+
+        if (options.paths) { paths.push(...options.paths); }
+
+        if (!isAbsoluteFilename && paths.indexOf('.') === -1) { paths.push('.'); }
+
+        const prefixes = options.prefixes || [''];
+        const fileParts = this.extractUrlParts(filename);
+
+        if (options.syncImport) {
+            getFileData(returnData, returnData);
+            if (callback) {
+                callback(result.error, result);
+            }
+            else {
+                return result;
+            }
+        }
+        else {
+            // promise is guaranteed to be asyncronous
+            // which helps as it allows the file handle
+            // to be closed before it continues with the next file
+            return new Promise(getFileData);
+        }
+
+        function returnData(data) {
+            if (!data.filename) {
+                result = { error: data };
+            }
+            else {
+                result = data;
+            }
+        }
+
+        function getFileData(fulfill, reject) {
+            (function tryPathIndex(i) {
+                if (i < paths.length) {
+                    (function tryPrefix(j) {
+                        if (j < prefixes.length) {
+                            isNodeModule = false;
+                            fullFilename = fileParts.rawPath + prefixes[j] + fileParts.filename;
+
+                            if (paths[i]) {
+                                fullFilename = path.join(paths[i], fullFilename);
+                            }
+
+                            if (!explicit && paths[i] === '.') {
+                                try {
+                                    fullFilename = require.resolve(fullFilename);
+                                    isNodeModule = true;
+                                }
+                                catch (e) {
+                                    filenamesTried.push(npmPrefix + fullFilename);
+                                    tryWithExtension();
+                                }
+                            }
+                            else {
+                                tryWithExtension();
+                            }
+
+                            function tryWithExtension() {
+                                const extFilename = options.ext ? self.tryAppendExtension(fullFilename, options.ext) : fullFilename;
+
+                                if (extFilename !== fullFilename && !explicit && paths[i] === '.') {
+                                    try {
+                                        fullFilename = require.resolve(extFilename);
+                                        isNodeModule = true;
+                                    }
+                                    catch (e) {
+                                        filenamesTried.push(npmPrefix + extFilename);
+                                        fullFilename = extFilename;
+                                    }
+                                }
+                                else {
+                                    fullFilename = extFilename;
+                                }
+                            }
+
+                            let modified = false;
+
+                            if (self.contents[fullFilename]) {
+                                try {
+                                    var stat = fs.statSync.apply(this, [fullFilename]);
+                                    if (stat.mtime.getTime() === self.contents[fullFilename].mtime.getTime()) {
+                                        fulfill({ contents: self.contents[fullFilename].data, filename: fullFilename});
+                                    }
+                                    else {
+                                        modified = true;
+                                    }
+                                }
+                                catch (e) {
+                                    modified = true;
+                                }
+                            }
+                            if (modified || !self.contents[fullFilename]) {
+                                const readFileArgs = [fullFilename];
+                                if (!options.rawBuffer) {
+                                    readFileArgs.push('utf-8');
+                                }
+                                if (options.syncImport) {
+                                    try {
+                                        const data = fs.readFileSync.apply(this, readFileArgs);
+                                        var stat = fs.statSync.apply(this, [fullFilename]);
+                                        self.contents[fullFilename] = { data, mtime: stat.mtime };
+                                        fulfill({ contents: data, filename: fullFilename});
+                                    }
+                                    catch (e) {
+                                        filenamesTried.push(isNodeModule ? npmPrefix + fullFilename : fullFilename);
+                                        return tryPrefix(j + 1);
+                                    }
+                                }
+                                else {
+                                    readFileArgs.push(function(e, data) {
+                                        if (e) {
+                                            filenamesTried.push(isNodeModule ? npmPrefix + fullFilename : fullFilename);
+                                            return tryPrefix(j + 1);
+                                        }
+                                        const stat = fs.statSync.apply(this, [fullFilename]);
+                                        self.contents[fullFilename] = { data, mtime: stat.mtime };      
+                                        fulfill({ contents: data, filename: fullFilename});
+                                    });
+                                    fs.readFile.apply(this, readFileArgs);
+                                }
+
+                            }
+
+                        }
+                        else {
+                            tryPathIndex(i + 1);
+                        }
+                    })(0);
+                } else {
+                    reject({ type: 'File', message: `'${filename}' wasn't found. Tried - ${filenamesTried.join(',')}` });
+                }
+            }(0));
+        }
+    }
+
+    loadFileSync(filename, currentDirectory, options, environment) {
+        options.syncImport = true;
+        return this.loadFile(filename, currentDirectory, options, environment);
+    }
+}
+
+export default FileManager;

package/lib/less-node/fs.js

@@ -0,0 +1,10 @@
+let fs;
+try
+{
+    fs = require('graceful-fs');
+}
+catch (e)
+{
+    fs = require('fs');
+}
+export default fs;

package/lib/less-node/image-size.js

@@ -0,0 +1,58 @@
+import Dimension from '../less/tree/dimension';
+import Expression from '../less/tree/expression';
+import functionRegistry from './../less/functions/function-registry';
+
+export default environment => {
+
+    function imageSize(functionContext, filePathNode) {
+        let filePath = filePathNode.value;
+        const currentFileInfo = functionContext.currentFileInfo;
+        const currentDirectory = currentFileInfo.rewriteUrls ?
+            currentFileInfo.currentDirectory : currentFileInfo.entryPath;
+
+        const fragmentStart = filePath.indexOf('#');
+        let fragment = '';
+        if (fragmentStart !== -1) {
+            fragment = filePath.slice(fragmentStart);
+            filePath = filePath.slice(0, fragmentStart);
+        }
+
+        const fileManager = environment.getFileManager(filePath, currentDirectory, functionContext.context, environment, true);
+
+        if (!fileManager) {
+            throw {
+                type: 'File',
+                message: `Can not set up FileManager for ${filePathNode}`
+            };
+        }
+
+        const fileSync = fileManager.loadFileSync(filePath, currentDirectory, functionContext.context, environment);
+
+        if (fileSync.error) {
+            throw fileSync.error;
+        }
+
+        const sizeOf = require('image-size');
+        return sizeOf(fileSync.filename);
+    }
+
+    const imageFunctions = {
+        'image-size': function(filePathNode) {
+            const size = imageSize(this, filePathNode);
+            return new Expression([
+                new Dimension(size.width, 'px'),
+                new Dimension(size.height, 'px')
+            ]);
+        },
+        'image-width': function(filePathNode) {
+            const size = imageSize(this, filePathNode);
+            return new Dimension(size.width, 'px');
+        },
+        'image-height': function(filePathNode) {
+            const size = imageSize(this, filePathNode);
+            return new Dimension(size.height, 'px');
+        }
+    };
+
+    functionRegistry.addMultiple(imageFunctions);
+};