@angular-devkit/build-angular 18.0.0-next.3 → 18.0.0-next.5

package/src/utils/index-file/inline-critical-css.js

@@ -1,179 +0,0 @@
-"use strict";
-/**
- * @license
- * Copyright Google LLC All Rights Reserved.
- *
- * Use of this source code is governed by an MIT-style license that can be
- * found in the LICENSE file at https://angular.io/license
- */
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.InlineCriticalCssProcessor = void 0;
-const critters_1 = __importDefault(require("critters"));
-const promises_1 = require("node:fs/promises");
-/**
- * Pattern used to extract the media query set by Critters in an `onload` handler.
- */
-const MEDIA_SET_HANDLER_PATTERN = /^this\.media=["'](.*)["'];?$/;
-/**
- * Name of the attribute used to save the Critters media query so it can be re-assigned on load.
- */
-const CSP_MEDIA_ATTR = 'ngCspMedia';
-/**
- * Script text used to change the media value of the link tags.
- *
- * NOTE:
- * We do not use `document.querySelectorAll('link').forEach((s) => s.addEventListener('load', ...)`
- * because this does not always fire on Chome.
- * See: https://github.com/angular/angular-cli/issues/26932 and https://crbug.com/1521256
- */
-const LINK_LOAD_SCRIPT_CONTENT = [
-    '(() => {',
-    `  const CSP_MEDIA_ATTR = '${CSP_MEDIA_ATTR}';`,
-    '  const documentElement = document.documentElement;',
-    '  const listener = (e) => {',
-    '    const target = e.target;',
-    `    if (!target || target.tagName !== 'LINK' || !target.hasAttribute(CSP_MEDIA_ATTR)) {`,
-    '     return;',
-    '    }',
-    '    target.media = target.getAttribute(CSP_MEDIA_ATTR);',
-    '    target.removeAttribute(CSP_MEDIA_ATTR);',
-    // Remove onload listener when there are no longer styles that need to be loaded.
-    '    if (!document.head.querySelector(`link[${CSP_MEDIA_ATTR}]`)) {',
-    `      documentElement.removeEventListener('load', listener);`,
-    '    }',
-    '  };',
-    //  We use an event with capturing (the true parameter) because load events don't bubble.
-    `  documentElement.addEventListener('load', listener, true);`,
-    '})();',
-].join('\n');
-class CrittersExtended extends critters_1.default {
-    optionsExtended;
-    warnings = [];
-    errors = [];
-    initialEmbedLinkedStylesheet;
-    addedCspScriptsDocuments = new WeakSet();
-    documentNonces = new WeakMap();
-    constructor(optionsExtended) {
-        super({
-            logger: {
-                warn: (s) => this.warnings.push(s),
-                error: (s) => this.errors.push(s),
-                info: () => { },
-            },
-            logLevel: 'warn',
-            path: optionsExtended.outputPath,
-            publicPath: optionsExtended.deployUrl,
-            compress: !!optionsExtended.minify,
-            pruneSource: false,
-            reduceInlineStyles: false,
-            mergeStylesheets: false,
-            // Note: if `preload` changes to anything other than `media`, the logic in
-            // `embedLinkedStylesheetOverride` will have to be updated.
-            preload: 'media',
-            noscriptFallback: true,
-            inlineFonts: true,
-        });
-        this.optionsExtended = optionsExtended;
-        // We can't use inheritance to override `embedLinkedStylesheet`, because it's not declared in
-        // the `Critters` .d.ts which means that we can't call the `super` implementation. TS doesn't
-        // allow for `super` to be cast to a different type.
-        this.initialEmbedLinkedStylesheet = this.embedLinkedStylesheet;
-        this.embedLinkedStylesheet = this.embedLinkedStylesheetOverride;
-    }
-    readFile(path) {
-        const readAsset = this.optionsExtended.readAsset;
-        return readAsset ? readAsset(path) : (0, promises_1.readFile)(path, 'utf-8');
-    }
-    /**
-     * Override of the Critters `embedLinkedStylesheet` method
-     * that makes it work with Angular's CSP APIs.
-     */
-    embedLinkedStylesheetOverride = async (link, document) => {
-        if (link.getAttribute('media') === 'print' && link.next?.name === 'noscript') {
-            // Workaround for https://github.com/GoogleChromeLabs/critters/issues/64
-            // NB: this is only needed for the webpack based builders.
-            const media = link.getAttribute('onload')?.match(MEDIA_SET_HANDLER_PATTERN);
-            if (media) {
-                link.removeAttribute('onload');
-                link.setAttribute('media', media[1]);
-                link?.next?.remove();
-            }
-        }
-        const returnValue = await this.initialEmbedLinkedStylesheet(link, document);
-        const cspNonce = this.findCspNonce(document);
-        if (cspNonce) {
-            const crittersMedia = link.getAttribute('onload')?.match(MEDIA_SET_HANDLER_PATTERN);
-            if (crittersMedia) {
-                // If there's a Critters-generated `onload` handler and the file has an Angular CSP nonce,
-                // we have to remove the handler, because it's incompatible with CSP. We save the value
-                // in a different attribute and we generate a script tag with the nonce that uses
-                // `addEventListener` to apply the media query instead.
-                link.removeAttribute('onload');
-                link.setAttribute(CSP_MEDIA_ATTR, crittersMedia[1]);
-                this.conditionallyInsertCspLoadingScript(document, cspNonce, link);
-            }
-            // Ideally we would hook in at the time Critters inserts the `style` tags, but there isn't
-            // a way of doing that at the moment so we fall back to doing it any time a `link` tag is
-            // inserted. We mitigate it by only iterating the direct children of the `<head>` which
-            // should be pretty shallow.
-            document.head.children.forEach((child) => {
-                if (child.tagName === 'style' && !child.hasAttribute('nonce')) {
-                    child.setAttribute('nonce', cspNonce);
-                }
-            });
-        }
-        return returnValue;
-    };
-    /**
-     * Finds the CSP nonce for a specific document.
-     */
-    findCspNonce(document) {
-        if (this.documentNonces.has(document)) {
-            // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
-            return this.documentNonces.get(document);
-        }
-        // HTML attribute are case-insensitive, but the parser used by Critters is case-sensitive.
-        const nonceElement = document.querySelector('[ngCspNonce], [ngcspnonce]');
-        const cspNonce = nonceElement?.getAttribute('ngCspNonce') || nonceElement?.getAttribute('ngcspnonce') || null;
-        this.documentNonces.set(document, cspNonce);
-        return cspNonce;
-    }
-    /**
-     * Inserts the `script` tag that swaps the critical CSS at runtime,
-     * if one hasn't been inserted into the document already.
-     */
-    conditionallyInsertCspLoadingScript(document, nonce, link) {
-        if (this.addedCspScriptsDocuments.has(document)) {
-            return;
-        }
-        const script = document.createElement('script');
-        script.setAttribute('nonce', nonce);
-        script.textContent = LINK_LOAD_SCRIPT_CONTENT;
-        // Prepend the script to the head since it needs to
-        // run as early as possible, before the `link` tags.
-        document.head.insertBefore(script, link);
-        this.addedCspScriptsDocuments.add(document);
-    }
-}
-class InlineCriticalCssProcessor {
-    options;
-    constructor(options) {
-        this.options = options;
-    }
-    async process(html, options) {
-        const critters = new CrittersExtended({ ...this.options, ...options });
-        const content = await critters.process(html);
-        return {
-            // Clean up value from value less attributes.
-            // This is caused because parse5 always requires attributes to have a string value.
-            // nomodule="" defer="" -> nomodule defer.
-            content: content.replace(/(\s(?:defer|nomodule))=""/g, '$1'),
-            errors: critters.errors,
-            warnings: critters.warnings,
-        };
-    }
-}
-exports.InlineCriticalCssProcessor = InlineCriticalCssProcessor;

package/src/utils/index-file/inline-fonts.d.ts

@@ -1,23 +0,0 @@
-/**
- * @license
- * Copyright Google LLC All Rights Reserved.
- *
- * Use of this source code is governed by an MIT-style license that can be
- * found in the LICENSE file at https://angular.io/license
- */
-import { NormalizedCachedOptions } from '../normalize-cache';
-export interface InlineFontsOptions {
-    minify?: boolean;
-    cache?: NormalizedCachedOptions;
-}
-export declare class InlineFontsProcessor {
-    private options;
-    private readonly cachePath;
-    constructor(options: InlineFontsOptions);
-    process(content: string): Promise<string>;
-    private getResponse;
-    processURL(url: string | URL): Promise<string | undefined>;
-    canInlineRequest(url: string): boolean;
-    private getFontProviderDetails;
-    private createNormalizedUrl;
-}

package/src/utils/index-file/inline-fonts.js

@@ -1,267 +0,0 @@
-"use strict";
-/**
- * @license
- * Copyright Google LLC All Rights Reserved.
- *
- * Use of this source code is governed by an MIT-style license that can be
- * found in the LICENSE file at https://angular.io/license
- */
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.InlineFontsProcessor = void 0;
-const https_proxy_agent_1 = require("https-proxy-agent");
-const node_crypto_1 = require("node:crypto");
-const promises_1 = require("node:fs/promises");
-const https = __importStar(require("node:https"));
-const node_path_1 = require("node:path");
-const html_rewriting_stream_1 = require("./html-rewriting-stream");
-const SUPPORTED_PROVIDERS = {
-    'fonts.googleapis.com': {
-        preconnectUrl: 'https://fonts.gstatic.com',
-    },
-    'use.typekit.net': {
-        preconnectUrl: 'https://use.typekit.net',
-    },
-};
-/**
- * Hash algorithm used for cached files.
- */
-const CONTENT_HASH_ALGORITHM = 'sha256';
-/**
- * String length of the SHA-256 content hash stored in cached files.
- */
-const CONTENT_HASH_LENGTH = 64;
-class InlineFontsProcessor {
-    options;
-    cachePath;
-    constructor(options) {
-        this.options = options;
-        const { path: cacheDirectory, enabled } = this.options.cache || {};
-        if (cacheDirectory && enabled) {
-            this.cachePath = (0, node_path_1.join)(cacheDirectory, 'angular-build-fonts');
-        }
-    }
-    async process(content) {
-        const hrefList = [];
-        const existingPreconnect = new Set();
-        // Collector link tags with href
-        const { rewriter: collectorStream, transformedContent: initCollectorStream } = await (0, html_rewriting_stream_1.htmlRewritingStream)(content);
-        collectorStream.on('startTag', (tag) => {
-            const { tagName, attrs } = tag;
-            if (tagName !== 'link') {
-                return;
-            }
-            let hrefValue;
-            let relValue;
-            for (const { name, value } of attrs) {
-                switch (name) {
-                    case 'rel':
-                        relValue = value;
-                        break;
-                    case 'href':
-                        hrefValue = value;
-                        break;
-                }
-                if (hrefValue && relValue) {
-                    switch (relValue) {
-                        case 'stylesheet':
-                            // <link rel="stylesheet" href="https://example.com/main.css">
-                            hrefList.push(hrefValue);
-                            break;
-                        case 'preconnect':
-                            // <link rel="preconnect" href="https://example.com">
-                            existingPreconnect.add(hrefValue.replace(/\/$/, ''));
-                            break;
-                    }
-                    return;
-                }
-            }
-        });
-        initCollectorStream().catch(() => {
-            // We don't really care about any errors here because it just initializes
-            // the rewriting stream, as we are waiting for `finish` below.
-        });
-        await new Promise((resolve) => collectorStream.on('finish', resolve));
-        // Download stylesheets
-        const hrefsContent = new Map();
-        const newPreconnectUrls = new Set();
-        for (const hrefItem of hrefList) {
-            const url = this.createNormalizedUrl(hrefItem);
-            if (!url) {
-                continue;
-            }
-            const content = await this.processURL(url);
-            if (content === undefined) {
-                continue;
-            }
-            hrefsContent.set(hrefItem, content);
-            // Add preconnect
-            const preconnectUrl = this.getFontProviderDetails(url)?.preconnectUrl;
-            if (preconnectUrl && !existingPreconnect.has(preconnectUrl)) {
-                newPreconnectUrls.add(preconnectUrl);
-            }
-        }
-        if (hrefsContent.size === 0) {
-            return content;
-        }
-        // Replace link with style tag.
-        const { rewriter, transformedContent } = await (0, html_rewriting_stream_1.htmlRewritingStream)(content);
-        rewriter.on('startTag', (tag) => {
-            const { tagName, attrs } = tag;
-            switch (tagName) {
-                case 'head':
-                    rewriter.emitStartTag(tag);
-                    for (const url of newPreconnectUrls) {
-                        rewriter.emitRaw(`<link rel="preconnect" href="${url}" crossorigin>`);
-                    }
-                    break;
-                case 'link':
-                    const hrefAttr = attrs.some(({ name, value }) => name === 'rel' && value === 'stylesheet') &&
-                        attrs.find(({ name, value }) => name === 'href' && hrefsContent.has(value));
-                    if (hrefAttr) {
-                        const href = hrefAttr.value;
-                        const cssContent = hrefsContent.get(href);
-                        rewriter.emitRaw(`<style>${cssContent}</style>`);
-                    }
-                    else {
-                        rewriter.emitStartTag(tag);
-                    }
-                    break;
-                default:
-                    rewriter.emitStartTag(tag);
-                    break;
-            }
-        });
-        return transformedContent();
-    }
-    async getResponse(url) {
-        let cacheFile;
-        if (this.cachePath) {
-            const key = (0, node_crypto_1.createHash)(CONTENT_HASH_ALGORITHM).update(`${url}`).digest('hex');
-            cacheFile = (0, node_path_1.join)(this.cachePath, key);
-        }
-        if (cacheFile) {
-            try {
-                const data = await (0, promises_1.readFile)(cacheFile, 'utf8');
-                // Check for valid content via stored hash
-                if (data.length > CONTENT_HASH_LENGTH) {
-                    const storedHash = data.slice(0, CONTENT_HASH_LENGTH);
-                    const content = data.slice(CONTENT_HASH_LENGTH);
-                    const contentHash = (0, node_crypto_1.createHash)(CONTENT_HASH_ALGORITHM).update(content).digest('base64');
-                    if (storedHash === contentHash) {
-                        // Return valid content
-                        return content;
-                    }
-                    else {
-                        // Delete corrupted cache content
-                        await (0, promises_1.rm)(cacheFile);
-                    }
-                }
-            }
-            catch { }
-        }
-        let agent;
-        const httpsProxy = process.env.HTTPS_PROXY ?? process.env.https_proxy;
-        if (httpsProxy) {
-            agent = new https_proxy_agent_1.HttpsProxyAgent(httpsProxy);
-        }
-        const data = await new Promise((resolve, reject) => {
-            let rawResponse = '';
-            https
-                .get(url, {
-                agent,
-                headers: {
-                    /**
-                     * Always use a Windows UA. This is because Google fonts will including hinting in fonts for Windows.
-                     * Hinting is a technique used with Windows files to improve appearance however
-                     * results in 20-50% larger file sizes.
-                     *
-                     * @see http://google3/java/com/google/fonts/css/OpenSansWebFontsCssBuilder.java?l=22
-                     * @see https://fonts.google.com/knowledge/glossary/hinting (short)
-                     * @see https://glyphsapp.com/learn/hinting-manual-truetype-hinting (deep dive)
-                     */
-                    'user-agent': 'Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/120.0.0.0 Safari/537.36',
-                },
-            }, (res) => {
-                if (res.statusCode !== 200) {
-                    reject(new Error(`Inlining of fonts failed. ${url} returned status code: ${res.statusCode}.`));
-                    return;
-                }
-                res.on('data', (chunk) => (rawResponse += chunk)).on('end', () => resolve(rawResponse));
-            })
-                .on('error', (e) => reject(new Error(`Inlining of fonts failed. An error has occurred while retrieving ${url} over the internet.\n` +
-                e.message)));
-        });
-        if (cacheFile) {
-            try {
-                const dataHash = (0, node_crypto_1.createHash)(CONTENT_HASH_ALGORITHM).update(data).digest('hex');
-                await (0, promises_1.writeFile)(cacheFile, dataHash + data);
-            }
-            catch { }
-        }
-        return data;
-    }
-    async processURL(url) {
-        const normalizedURL = url instanceof URL ? url : this.createNormalizedUrl(url);
-        if (!normalizedURL) {
-            return;
-        }
-        const provider = this.getFontProviderDetails(normalizedURL);
-        if (!provider) {
-            return undefined;
-        }
-        let cssContent = await this.getResponse(normalizedURL);
-        if (this.options.minify) {
-            cssContent = cssContent
-                // Comments.
-                .replace(/\/\*([\s\S]*?)\*\//g, '')
-                // New lines.
-                .replace(/\n/g, '')
-                // Safe spaces.
-                .replace(/\s?[{:;]\s+/g, (s) => s.trim());
-        }
-        return cssContent;
-    }
-    canInlineRequest(url) {
-        const normalizedUrl = this.createNormalizedUrl(url);
-        return normalizedUrl ? !!this.getFontProviderDetails(normalizedUrl) : false;
-    }
-    getFontProviderDetails(url) {
-        return SUPPORTED_PROVIDERS[url.hostname];
-    }
-    createNormalizedUrl(value) {
-        // Need to convert '//' to 'https://' because the URL parser will fail with '//'.
-        const url = new URL(value.startsWith('//') ? `https:${value}` : value, 'resolve://');
-        switch (url.protocol) {
-            case 'http:':
-            case 'https:':
-                url.protocol = 'https:';
-                return url;
-            default:
-                return undefined;
-        }
-    }
-}
-exports.InlineFontsProcessor = InlineFontsProcessor;

package/src/utils/index-file/nonce.d.ts

@@ -1,12 +0,0 @@
-/**
- * @license
- * Copyright Google LLC All Rights Reserved.
- *
- * Use of this source code is governed by an MIT-style license that can be
- * found in the LICENSE file at https://angular.io/license
- */
-/**
- * Finds the `ngCspNonce` value and copies it to all inline `<style>` and `<script> `tags.
- * @param html Markup that should be processed.
- */
-export declare function addNonce(html: string): Promise<string>;

package/src/utils/index-file/nonce.js

@@ -1,55 +0,0 @@
-"use strict";
-/**
- * @license
- * Copyright Google LLC All Rights Reserved.
- *
- * Use of this source code is governed by an MIT-style license that can be
- * found in the LICENSE file at https://angular.io/license
- */
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.addNonce = void 0;
-const html_rewriting_stream_1 = require("./html-rewriting-stream");
-/**
- * Pattern matching the name of the Angular nonce attribute. Note that this is
- * case-insensitive, because HTML attribute names are case-insensitive as well.
- */
-const NONCE_ATTR_PATTERN = /ngCspNonce/i;
-/**
- * Finds the `ngCspNonce` value and copies it to all inline `<style>` and `<script> `tags.
- * @param html Markup that should be processed.
- */
-async function addNonce(html) {
-    const nonce = await findNonce(html);
-    if (!nonce) {
-        return html;
-    }
-    const { rewriter, transformedContent } = await (0, html_rewriting_stream_1.htmlRewritingStream)(html);
-    rewriter.on('startTag', (tag) => {
-        if ((tag.tagName === 'style' ||
-            (tag.tagName === 'script' && !tag.attrs.some((attr) => attr.name === 'src'))) &&
-            !tag.attrs.some((attr) => attr.name === 'nonce')) {
-            tag.attrs.push({ name: 'nonce', value: nonce });
-        }
-        rewriter.emitStartTag(tag);
-    });
-    return transformedContent();
-}
-exports.addNonce = addNonce;
-/** Finds the Angular nonce in an HTML string. */
-async function findNonce(html) {
-    // Inexpensive check to avoid parsing the HTML when we're sure there's no nonce.
-    if (!NONCE_ATTR_PATTERN.test(html)) {
-        return null;
-    }
-    const { rewriter, transformedContent } = await (0, html_rewriting_stream_1.htmlRewritingStream)(html);
-    let nonce = null;
-    rewriter.on('startTag', (tag) => {
-        const nonceAttr = tag.attrs.find((attr) => NONCE_ATTR_PATTERN.test(attr.name));
-        if (nonceAttr?.value) {
-            nonce = nonceAttr.value;
-            rewriter.stop(); // Stop parsing since we've found the nonce.
-        }
-    });
-    await transformedContent();
-    return nonce;
-}

package/src/utils/load-proxy-config.d.ts

@@ -1,8 +0,0 @@
-/**
- * @license
- * Copyright Google LLC All Rights Reserved.
- *
- * Use of this source code is governed by an MIT-style license that can be
- * found in the LICENSE file at https://angular.io/license
- */
-export declare function loadProxyConfiguration(root: string, proxyConfig: string | undefined): Promise<Record<string, object> | undefined>;