@angular-devkit/build-angular 15.0.0 → 15.1.0-next.0

package/src/sass/rebasing-importer.js

@@ -15,11 +15,6 @@ const magic_string_1 = __importDefault(require("magic-string"));
 const node_fs_1 = require("node:fs");
 const node_path_1 = require("node:path");
 const node_url_1 = require("node:url");
-/**
- * A Regular expression used to find all `url()` functions within a stylesheet.
- * From packages/angular_devkit/build_angular/src/webpack/plugins/postcss-cli-resources.ts
- */
-const URL_REGEXP = /url(?:\(\s*(['"]?))(.*?)(?:\1\s*\))/g;
 /**
  * A Sass Importer base class that provides the load logic to rebase all `url()` functions
  * within a stylesheet. The rebasing will ensure that the URLs in the output of the Sass compiler
@@ -43,37 +38,36 @@ class UrlRebasingImporter {
     }
     load(canonicalUrl) {
         const stylesheetPath = (0, node_url_1.fileURLToPath)(canonicalUrl);
+        const stylesheetDirectory = (0, node_path_1.dirname)(stylesheetPath);
         let contents = (0, node_fs_1.readFileSync)(stylesheetPath, 'utf-8');
         // Rebase any URLs that are found
-        if (contents.includes('url(')) {
-            const stylesheetDirectory = (0, node_path_1.dirname)(stylesheetPath);
-            let match;
-            URL_REGEXP.lastIndex = 0;
-            let updatedContents;
-            while ((match = URL_REGEXP.exec(contents))) {
-                const originalUrl = match[2];
-                // If root-relative, absolute or protocol relative url, leave as-is
-                if (/^((?:\w+:)?\/\/|data:|chrome:|#|\/)/.test(originalUrl)) {
-                    continue;
-                }
-                const rebasedPath = (0, node_path_1.relative)(this.entryDirectory, (0, node_path_1.join)(stylesheetDirectory, originalUrl));
-                // Normalize path separators and escape characters
-                // https://developer.mozilla.org/en-US/docs/Web/CSS/url#syntax
-                const rebasedUrl = './' + rebasedPath.replace(/\\/g, '/').replace(/[()\s'"]/g, '\\$&');
-                updatedContents !== null && updatedContents !== void 0 ? updatedContents : (updatedContents = new magic_string_1.default(contents));
-                updatedContents.update(match.index, match.index + match[0].length, `url(${rebasedUrl})`);
+        let updatedContents;
+        for (const { start, end, value } of findUrls(contents)) {
+            // Skip if value is empty or a Sass variable
+            if (value.length === 0 || value.startsWith('$')) {
+                continue;
             }
-            if (updatedContents) {
-                contents = updatedContents.toString();
-                if (this.rebaseSourceMaps) {
-                    // Generate an intermediate source map for the rebasing changes
-                    const map = updatedContents.generateMap({
-                        hires: true,
-                        includeContent: true,
-                        source: canonicalUrl.href,
-                    });
-                    this.rebaseSourceMaps.set(canonicalUrl.href, map);
-                }
+            // Skip if root-relative, absolute or protocol relative url
+            if (/^((?:\w+:)?\/\/|data:|chrome:|#|\/)/.test(value)) {
+                continue;
+            }
+            const rebasedPath = (0, node_path_1.relative)(this.entryDirectory, (0, node_path_1.join)(stylesheetDirectory, value));
+            // Normalize path separators and escape characters
+            // https://developer.mozilla.org/en-US/docs/Web/CSS/url#syntax
+            const rebasedUrl = './' + rebasedPath.replace(/\\/g, '/').replace(/[()\s'"]/g, '\\$&');
+            updatedContents !== null && updatedContents !== void 0 ? updatedContents : (updatedContents = new magic_string_1.default(contents));
+            updatedContents.update(start, end, rebasedUrl);
+        }
+        if (updatedContents) {
+            contents = updatedContents.toString();
+            if (this.rebaseSourceMaps) {
+                // Generate an intermediate source map for the rebasing changes
+                const map = updatedContents.generateMap({
+                    hires: true,
+                    includeContent: true,
+                    source: canonicalUrl.href,
+                });
+                this.rebaseSourceMaps.set(canonicalUrl.href, map);
             }
         }
         let syntax;
@@ -95,6 +89,156 @@ class UrlRebasingImporter {
         };
     }
 }
+/**
+ * Determines if a unicode code point is a CSS whitespace character.
+ * @param code The unicode code point to test.
+ * @returns true, if the code point is CSS whitespace; false, otherwise.
+ */
+function isWhitespace(code) {
+    // Based on https://www.w3.org/TR/css-syntax-3/#whitespace
+    switch (code) {
+        case 0x0009: // tab
+        case 0x0020: // space
+        case 0x000a: // line feed
+        case 0x000c: // form feed
+        case 0x000d: // carriage return
+            return true;
+        default:
+            return false;
+    }
+}
+/**
+ * Scans a CSS or Sass file and locates all valid url function values as defined by the CSS
+ * syntax specification.
+ * @param contents A string containing a CSS or Sass file to scan.
+ * @returns An iterable that yields each CSS url function value found.
+ */
+function* findUrls(contents) {
+    let pos = 0;
+    let width = 1;
+    let current = -1;
+    const next = () => {
+        var _a;
+        pos += width;
+        current = (_a = contents.codePointAt(pos)) !== null && _a !== void 0 ? _a : -1;
+        width = current > 0xffff ? 2 : 1;
+        return current;
+    };
+    // Based on https://www.w3.org/TR/css-syntax-3/#consume-ident-like-token
+    while ((pos = contents.indexOf('url(', pos)) !== -1) {
+        // Set to position of the (
+        pos += 3;
+        width = 1;
+        // Consume all leading whitespace
+        while (isWhitespace(next())) {
+            /* empty */
+        }
+        // Initialize URL state
+        const url = { start: pos, end: -1, value: '' };
+        let complete = false;
+        // If " or ', then consume the value as a string
+        if (current === 0x0022 || current === 0x0027) {
+            const ending = current;
+            // Based on https://www.w3.org/TR/css-syntax-3/#consume-string-token
+            while (!complete) {
+                switch (next()) {
+                    case -1: // EOF
+                        return;
+                    case 0x000a: // line feed
+                    case 0x000c: // form feed
+                    case 0x000d: // carriage return
+                        // Invalid
+                        complete = true;
+                        break;
+                    case 0x005c: // \ -- character escape
+                        // If not EOF or newline, add the character after the escape
+                        switch (next()) {
+                            case -1:
+                                return;
+                            case 0x000a: // line feed
+                            case 0x000c: // form feed
+                            case 0x000d: // carriage return
+                                // Skip when inside a string
+                                break;
+                            default:
+                                // TODO: Handle hex escape codes
+                                url.value += String.fromCodePoint(current);
+                                break;
+                        }
+                        break;
+                    case ending:
+                        // Full string position should include the quotes for replacement
+                        url.end = pos + 1;
+                        complete = true;
+                        yield url;
+                        break;
+                    default:
+                        url.value += String.fromCodePoint(current);
+                        break;
+                }
+            }
+            next();
+            continue;
+        }
+        // Based on https://www.w3.org/TR/css-syntax-3/#consume-url-token
+        while (!complete) {
+            switch (current) {
+                case -1: // EOF
+                    return;
+                case 0x0022: // "
+                case 0x0027: // '
+                case 0x0028: // (
+                    // Invalid
+                    complete = true;
+                    break;
+                case 0x0029: // )
+                    // URL is valid and complete
+                    url.end = pos;
+                    complete = true;
+                    break;
+                case 0x005c: // \ -- character escape
+                    // If not EOF or newline, add the character after the escape
+                    switch (next()) {
+                        case -1: // EOF
+                            return;
+                        case 0x000a: // line feed
+                        case 0x000c: // form feed
+                        case 0x000d: // carriage return
+                            // Invalid
+                            complete = true;
+                            break;
+                        default:
+                            // TODO: Handle hex escape codes
+                            url.value += String.fromCodePoint(current);
+                            break;
+                    }
+                    break;
+                default:
+                    if (isWhitespace(current)) {
+                        while (isWhitespace(next())) {
+                            /* empty */
+                        }
+                        // Unescaped whitespace is only valid before the closing )
+                        if (current === 0x0029) {
+                            // URL is valid
+                            url.end = pos;
+                        }
+                        complete = true;
+                    }
+                    else {
+                        // Add the character to the url value
+                        url.value += String.fromCodePoint(current);
+                    }
+                    break;
+            }
+            next();
+        }
+        // An end position indicates a URL was found
+        if (url.end !== -1) {
+            yield url;
+        }
+    }
+}
 /**
  * Provides the Sass importer logic to resolve relative stylesheet imports via both import and use rules
  * and also rebase any `url()` function usage within those stylesheets. The rebasing will ensure that
@@ -131,17 +275,6 @@ class RelativeUrlRebasingImporter extends UrlRebasingImporter {
         const hasStyleExtension = extension === '.scss' || extension === '.sass' || extension === '.css';
         // Remove the style extension if present to allow adding the `.import` suffix
         const filename = (0, node_path_1.basename)(stylesheetPath, hasStyleExtension ? extension : undefined);
-        let entries;
-        try {
-            entries = this.directoryCache.get(directory);
-            if (!entries) {
-                entries = (0, node_fs_1.readdirSync)(directory, { withFileTypes: true });
-                this.directoryCache.set(directory, entries);
-            }
-        }
-        catch {
-            return null;
-        }
         const importPotentials = new Set();
         const defaultPotentials = new Set();
         if (hasStyleExtension) {
@@ -168,37 +301,69 @@ class RelativeUrlRebasingImporter extends UrlRebasingImporter {
             defaultPotentials.add('_' + filename + '.sass');
             defaultPotentials.add('_' + filename + '.css');
         }
-        const foundDefaults = [];
-        const foundImports = [];
+        let foundDefaults;
+        let foundImports;
         let hasPotentialIndex = false;
-        for (const entry of entries) {
-            // Record if the name should be checked as a directory with an index file
-            if (checkDirectory && !hasStyleExtension && entry.name === filename && entry.isDirectory()) {
-                hasPotentialIndex = true;
-            }
-            if (!entry.isFile()) {
-                continue;
+        let cachedEntries = this.directoryCache.get(directory);
+        if (cachedEntries) {
+            // If there is a preprocessed cache of the directory, perform an intersection of the potentials
+            // and the directory files.
+            const { files, directories } = cachedEntries;
+            foundDefaults = [...defaultPotentials].filter((potential) => files.has(potential));
+            foundImports = [...importPotentials].filter((potential) => files.has(potential));
+            hasPotentialIndex = checkDirectory && !hasStyleExtension && directories.has(filename);
+        }
+        else {
+            // If no preprocessed cache exists, get the entries from the file system and, while searching,
+            // generate the cache for later requests.
+            let entries;
+            try {
+                entries = (0, node_fs_1.readdirSync)(directory, { withFileTypes: true });
             }
-            if (importPotentials.has(entry.name)) {
-                foundImports.push((0, node_path_1.join)(directory, entry.name));
+            catch {
+                return null;
             }
-            if (defaultPotentials.has(entry.name)) {
-                foundDefaults.push((0, node_path_1.join)(directory, entry.name));
+            foundDefaults = [];
+            foundImports = [];
+            cachedEntries = { files: new Set(), directories: new Set() };
+            for (const entry of entries) {
+                const isDirectory = entry.isDirectory();
+                if (isDirectory) {
+                    cachedEntries.directories.add(entry.name);
+                }
+                // Record if the name should be checked as a directory with an index file
+                if (checkDirectory && !hasStyleExtension && entry.name === filename && isDirectory) {
+                    hasPotentialIndex = true;
+                }
+                if (!entry.isFile()) {
+                    continue;
+                }
+                cachedEntries.files.add(entry.name);
+                if (importPotentials.has(entry.name)) {
+                    foundImports.push(entry.name);
+                }
+                if (defaultPotentials.has(entry.name)) {
+                    foundDefaults.push(entry.name);
+                }
             }
+            this.directoryCache.set(directory, cachedEntries);
         }
         // `foundImports` will only contain elements if `options.fromImport` is true
         const result = (_a = this.checkFound(foundImports)) !== null && _a !== void 0 ? _a : this.checkFound(foundDefaults);
-        if (result === null && hasPotentialIndex) {
+        if (result !== null) {
+            return (0, node_url_1.pathToFileURL)((0, node_path_1.join)(directory, result));
+        }
+        if (hasPotentialIndex) {
             // Check for index files using filename as a directory
             return this.resolveImport(url + '/index', fromImport, false);
         }
-        return result;
+        return null;
     }
     /**
      * Checks an array of potential stylesheet files to determine if there is a valid
      * stylesheet file. More than one discovered file may indicate an error.
      * @param found An array of discovered stylesheet files.
-     * @returns A fully resolved URL for a stylesheet file or `null` if not found.
+     * @returns A fully resolved path for a stylesheet file or `null` if not found.
      * @throws If there are ambiguous files discovered.
      */
     checkFound(found) {
@@ -217,9 +382,9 @@ class RelativeUrlRebasingImporter extends UrlRebasingImporter {
             }
             // Return the non-CSS file (sass/scss files have priority)
             // https://github.com/sass/dart-sass/blob/44d6bb6ac72fe6b93f5bfec371a1fffb18e6b76d/lib/src/importer/utils.dart#L44-L47
-            return (0, node_url_1.pathToFileURL)(foundWithoutCss[0]);
+            return foundWithoutCss[0];
         }
-        return (0, node_url_1.pathToFileURL)(found[0]);
+        return found[0];
     }
 }
 exports.RelativeUrlRebasingImporter = RelativeUrlRebasingImporter;

package/src/utils/normalize-asset-patterns.js

@@ -78,13 +78,12 @@ function normalizeAssetPatterns(assetPatterns, workspaceRoot, projectRoot, proje
             }
             // Output directory for both is the relative path from source root to input.
             const output = path.relative(resolvedSourceRoot, path.resolve(workspaceRoot, input));
-            // Return the asset pattern in object format.
-            return { glob, input, output };
+            assetPattern = { glob, input, output };
         }
-        else {
-            // It's already an AssetPatternObject, no need to convert.
-            return assetPattern;
+        if (assetPattern.output.startsWith('..')) {
+            throw new Error('An asset cannot be written to a location outside of the output path.');
         }
+        return assetPattern;
     });
 }
 exports.normalizeAssetPatterns = normalizeAssetPatterns;

package/src/webpack/utils/stats.js

@@ -279,7 +279,16 @@ function statsWarningsToString(json, statsConfig) {
             output += yb(`Warning: ${warning}\n\n`);
         }
         else {
-            const file = warning.file || warning.moduleName;
+            let file = warning.file || warning.moduleName;
+            // Clean up warning paths
+            // Ex: ./src/app/styles.scss.webpack[javascript/auto]!=!./node_modules/css-loader/dist/cjs.js....
+            // to ./src/app/styles.scss.webpack
+            if (file && !statsConfig.errorDetails) {
+                const webpackPathIndex = file.indexOf('.webpack[');
+                if (webpackPathIndex !== -1) {
+                    file = file.substring(0, webpackPathIndex);
+                }
+            }
             if (file) {
                 output += c(file);
                 if (warning.loc) {