@angular/build 18.0.0-next.3

package/src/utils/index-file/augment-index-html.js

@@ -0,0 +1,239 @@
+"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.augmentIndexHtml = void 0;
+const node_crypto_1 = require("node:crypto");
+const node_path_1 = require("node:path");
+const load_esm_1 = require("../load-esm");
+const html_rewriting_stream_1 = require("./html-rewriting-stream");
+/*
+ * Helper function used by the IndexHtmlWebpackPlugin.
+ * Can also be directly used by builder, e. g. in order to generate an index.html
+ * after processing several configurations in order to build different sets of
+ * bundles for differential serving.
+ */
+// eslint-disable-next-line max-lines-per-function
+async function augmentIndexHtml(params) {
+    const { loadOutputFile, files, entrypoints, sri, deployUrl = '', lang, baseHref, html, imageDomains, } = params;
+    const warnings = [];
+    const errors = [];
+    let { crossOrigin = 'none' } = params;
+    if (sri && crossOrigin === 'none') {
+        crossOrigin = 'anonymous';
+    }
+    const stylesheets = new Set();
+    const scripts = new Map();
+    // Sort files in the order we want to insert them by entrypoint
+    for (const [entrypoint, isModule] of entrypoints) {
+        for (const { extension, file, name } of files) {
+            if (name !== entrypoint || scripts.has(file) || stylesheets.has(file)) {
+                continue;
+            }
+            switch (extension) {
+                case '.js':
+                    // Also, non entrypoints need to be loaded as no module as they can contain problematic code.
+                    scripts.set(file, isModule);
+                    break;
+                case '.mjs':
+                    if (!isModule) {
+                        // It would be very confusing to link an `*.mjs` file in a non-module script context,
+                        // so we disallow it entirely.
+                        throw new Error('`.mjs` files *must* set `isModule` to `true`.');
+                    }
+                    scripts.set(file, true /* isModule */);
+                    break;
+                case '.css':
+                    stylesheets.add(file);
+                    break;
+            }
+        }
+    }
+    let scriptTags = [];
+    for (const [src, isModule] of scripts) {
+        const attrs = [`src="${deployUrl}${src}"`];
+        // This is also need for non entry-points as they may contain problematic code.
+        if (isModule) {
+            attrs.push('type="module"');
+        }
+        else {
+            attrs.push('defer');
+        }
+        if (crossOrigin !== 'none') {
+            attrs.push(`crossorigin="${crossOrigin}"`);
+        }
+        if (sri) {
+            const content = await loadOutputFile(src);
+            attrs.push(generateSriAttributes(content));
+        }
+        scriptTags.push(`<script ${attrs.join(' ')}></script>`);
+    }
+    let linkTags = [];
+    for (const src of stylesheets) {
+        const attrs = [`rel="stylesheet"`, `href="${deployUrl}${src}"`];
+        if (crossOrigin !== 'none') {
+            attrs.push(`crossorigin="${crossOrigin}"`);
+        }
+        if (sri) {
+            const content = await loadOutputFile(src);
+            attrs.push(generateSriAttributes(content));
+        }
+        linkTags.push(`<link ${attrs.join(' ')}>`);
+    }
+    if (params.hints?.length) {
+        for (const hint of params.hints) {
+            const attrs = [`rel="${hint.mode}"`, `href="${deployUrl}${hint.url}"`];
+            if (hint.mode !== 'modulepreload' && crossOrigin !== 'none') {
+                // Value is considered anonymous by the browser when not present or empty
+                attrs.push(crossOrigin === 'anonymous' ? 'crossorigin' : `crossorigin="${crossOrigin}"`);
+            }
+            if (hint.mode === 'preload' || hint.mode === 'prefetch') {
+                switch ((0, node_path_1.extname)(hint.url)) {
+                    case '.js':
+                        attrs.push('as="script"');
+                        break;
+                    case '.css':
+                        attrs.push('as="style"');
+                        break;
+                    default:
+                        if (hint.as) {
+                            attrs.push(`as="${hint.as}"`);
+                        }
+                        break;
+                }
+            }
+            if (sri &&
+                (hint.mode === 'preload' || hint.mode === 'prefetch' || hint.mode === 'modulepreload')) {
+                const content = await loadOutputFile(hint.url);
+                attrs.push(generateSriAttributes(content));
+            }
+            linkTags.push(`<link ${attrs.join(' ')}>`);
+        }
+    }
+    const dir = lang ? await getLanguageDirection(lang, warnings) : undefined;
+    const { rewriter, transformedContent } = await (0, html_rewriting_stream_1.htmlRewritingStream)(html);
+    const baseTagExists = html.includes('<base');
+    const foundPreconnects = new Set();
+    rewriter
+        .on('startTag', (tag) => {
+        switch (tag.tagName) {
+            case 'html':
+                // Adjust document locale if specified
+                if (isString(lang)) {
+                    updateAttribute(tag, 'lang', lang);
+                }
+                if (dir) {
+                    updateAttribute(tag, 'dir', dir);
+                }
+                break;
+            case 'head':
+                // Base href should be added before any link, meta tags
+                if (!baseTagExists && isString(baseHref)) {
+                    rewriter.emitStartTag(tag);
+                    rewriter.emitRaw(`<base href="${baseHref}">`);
+                    return;
+                }
+                break;
+            case 'base':
+                // Adjust base href if specified
+                if (isString(baseHref)) {
+                    updateAttribute(tag, 'href', baseHref);
+                }
+                break;
+            case 'link':
+                if (readAttribute(tag, 'rel') === 'preconnect') {
+                    const href = readAttribute(tag, 'href');
+                    if (href) {
+                        foundPreconnects.add(href);
+                    }
+                }
+                break;
+        }
+        rewriter.emitStartTag(tag);
+    })
+        .on('endTag', (tag) => {
+        switch (tag.tagName) {
+            case 'head':
+                for (const linkTag of linkTags) {
+                    rewriter.emitRaw(linkTag);
+                }
+                if (imageDomains) {
+                    for (const imageDomain of imageDomains) {
+                        if (!foundPreconnects.has(imageDomain)) {
+                            rewriter.emitRaw(`<link rel="preconnect" href="${imageDomain}" data-ngimg>`);
+                        }
+                    }
+                }
+                linkTags = [];
+                break;
+            case 'body':
+                // Add script tags
+                for (const scriptTag of scriptTags) {
+                    rewriter.emitRaw(scriptTag);
+                }
+                scriptTags = [];
+                break;
+        }
+        rewriter.emitEndTag(tag);
+    });
+    const content = await transformedContent();
+    return {
+        content: linkTags.length || scriptTags.length
+            ? // In case no body/head tags are not present (dotnet partial templates)
+                linkTags.join('') + scriptTags.join('') + content
+            : content,
+        warnings,
+        errors,
+    };
+}
+exports.augmentIndexHtml = augmentIndexHtml;
+function generateSriAttributes(content) {
+    const algo = 'sha384';
+    const hash = (0, node_crypto_1.createHash)(algo).update(content, 'utf8').digest('base64');
+    return `integrity="${algo}-${hash}"`;
+}
+function updateAttribute(tag, name, value) {
+    const index = tag.attrs.findIndex((a) => a.name === name);
+    const newValue = { name, value };
+    if (index === -1) {
+        tag.attrs.push(newValue);
+    }
+    else {
+        tag.attrs[index] = newValue;
+    }
+}
+function readAttribute(tag, name) {
+    const targetAttr = tag.attrs.find((attr) => attr.name === name);
+    return targetAttr ? targetAttr.value : undefined;
+}
+function isString(value) {
+    return typeof value === 'string';
+}
+async function getLanguageDirection(locale, warnings) {
+    const dir = await getLanguageDirectionFromLocales(locale);
+    if (!dir) {
+        warnings.push(`Locale data for '${locale}' cannot be found. 'dir' attribute will not be set for this locale.`);
+    }
+    return dir;
+}
+async function getLanguageDirectionFromLocales(locale) {
+    try {
+        const localeData = (await (0, load_esm_1.loadEsmModule)(`@angular/common/locales/${locale}`)).default;
+        const dir = localeData[localeData.length - 2];
+        return isString(dir) ? dir : undefined;
+    }
+    catch {
+        // In some cases certain locales might map to files which are named only with language id.
+        // Example: `en-US` -> `en`.
+        const [languageId] = locale.split('-', 1);
+        if (languageId !== locale) {
+            return getLanguageDirectionFromLocales(languageId);
+        }
+    }
+    return undefined;
+}

package/src/utils/index-file/html-rewriting-stream.d.ts

@@ -0,0 +1,11 @@
+/**
+ * @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 htmlRewritingStream(content: string): Promise<{
+    rewriter: import('parse5-html-rewriting-stream').RewritingStream;
+    transformedContent: () => Promise<string>;
+}>;

package/src/utils/index-file/html-rewriting-stream.js

@@ -0,0 +1,28 @@
+"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.htmlRewritingStream = void 0;
+const node_stream_1 = require("node:stream");
+const promises_1 = require("node:stream/promises");
+const load_esm_1 = require("../load-esm");
+async function htmlRewritingStream(content) {
+    const { RewritingStream } = await (0, load_esm_1.loadEsmModule)('parse5-html-rewriting-stream');
+    const rewriter = new RewritingStream();
+    return {
+        rewriter,
+        transformedContent: () => (0, promises_1.pipeline)(node_stream_1.Readable.from(content), rewriter, async function (source) {
+            const chunks = [];
+            for await (const chunk of source) {
+                chunks.push(Buffer.from(chunk));
+            }
+            return Buffer.concat(chunks).toString('utf-8');
+        }),
+    };
+}
+exports.htmlRewritingStream = htmlRewritingStream;

package/src/utils/index-file/index-html-generator.d.ts

@@ -0,0 +1,57 @@
+/**
+ * @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';
+import { NormalizedOptimizationOptions } from '../normalize-optimization';
+import { CrossOriginValue, Entrypoint, FileInfo } from './augment-index-html';
+export type HintMode = 'prefetch' | 'preload' | 'modulepreload' | 'preconnect' | 'dns-prefetch';
+export interface IndexHtmlGeneratorProcessOptions {
+    lang: string | undefined;
+    baseHref: string | undefined;
+    outputPath: string;
+    files: FileInfo[];
+    hints?: {
+        url: string;
+        mode: HintMode;
+        as?: string;
+    }[];
+}
+export interface IndexHtmlGeneratorOptions {
+    indexPath: string;
+    deployUrl?: string;
+    sri?: boolean;
+    entrypoints: Entrypoint[];
+    postTransform?: IndexHtmlTransform;
+    crossOrigin?: CrossOriginValue;
+    optimization?: NormalizedOptimizationOptions;
+    cache?: NormalizedCachedOptions;
+    imageDomains?: string[];
+    generateDedicatedSSRContent?: boolean;
+}
+export type IndexHtmlTransform = (content: string) => Promise<string>;
+export interface IndexHtmlPluginTransformResult {
+    content: string;
+    warnings: string[];
+    errors: string[];
+}
+export interface IndexHtmlProcessResult {
+    csrContent: string;
+    ssrContent?: string;
+    warnings: string[];
+    errors: string[];
+}
+export declare class IndexHtmlGenerator {
+    readonly options: IndexHtmlGeneratorOptions;
+    private readonly plugins;
+    private readonly csrPlugins;
+    private readonly ssrPlugins;
+    constructor(options: IndexHtmlGeneratorOptions);
+    process(options: IndexHtmlGeneratorProcessOptions): Promise<IndexHtmlProcessResult>;
+    private runPlugins;
+    readAsset(path: string): Promise<string>;
+    protected readIndex(path: string): Promise<string>;
+}

package/src/utils/index-file/index-html-generator.js

@@ -0,0 +1,135 @@
+"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.IndexHtmlGenerator = void 0;
+const promises_1 = require("node:fs/promises");
+const node_path_1 = require("node:path");
+const add_event_dispatch_contract_1 = require("./add-event-dispatch-contract");
+const augment_index_html_1 = require("./augment-index-html");
+const inline_critical_css_1 = require("./inline-critical-css");
+const inline_fonts_1 = require("./inline-fonts");
+const nonce_1 = require("./nonce");
+class IndexHtmlGenerator {
+    options;
+    plugins;
+    csrPlugins = [];
+    ssrPlugins = [];
+    constructor(options) {
+        this.options = options;
+        const extraCommonPlugins = [];
+        if (options?.optimization?.fonts.inline) {
+            extraCommonPlugins.push(inlineFontsPlugin(this), nonce_1.addNonce);
+        }
+        // Common plugins
+        this.plugins = [augmentIndexHtmlPlugin(this), ...extraCommonPlugins, postTransformPlugin(this)];
+        // CSR plugins
+        if (options?.optimization?.styles?.inlineCritical) {
+            this.csrPlugins.push(inlineCriticalCssPlugin(this));
+        }
+        // SSR plugins
+        if (options.generateDedicatedSSRContent) {
+            this.ssrPlugins.push(addEventDispatchContractPlugin(), addNoncePlugin());
+        }
+    }
+    async process(options) {
+        let content = await this.readIndex(this.options.indexPath);
+        const warnings = [];
+        const errors = [];
+        content = await this.runPlugins(content, this.plugins, options, warnings, errors);
+        const [csrContent, ssrContent] = await Promise.all([
+            this.runPlugins(content, this.csrPlugins, options, warnings, errors),
+            this.ssrPlugins.length
+                ? this.runPlugins(content, this.ssrPlugins, options, warnings, errors)
+                : undefined,
+        ]);
+        return {
+            ssrContent,
+            csrContent,
+            warnings,
+            errors,
+        };
+    }
+    async runPlugins(content, plugins, options, warnings, errors) {
+        for (const plugin of plugins) {
+            const result = await plugin(content, options);
+            if (typeof result === 'string') {
+                content = result;
+            }
+            else {
+                content = result.content;
+                if (result.warnings.length) {
+                    warnings.push(...result.warnings);
+                }
+                if (result.errors.length) {
+                    errors.push(...result.errors);
+                }
+            }
+        }
+        return content;
+    }
+    async readAsset(path) {
+        try {
+            return await (0, promises_1.readFile)(path, 'utf-8');
+        }
+        catch {
+            throw new Error(`Failed to read asset "${path}".`);
+        }
+    }
+    async readIndex(path) {
+        try {
+            return new TextDecoder('utf-8').decode(await (0, promises_1.readFile)(path));
+        }
+        catch (cause) {
+            throw new Error(`Failed to read index HTML file "${path}".`, { cause });
+        }
+    }
+}
+exports.IndexHtmlGenerator = IndexHtmlGenerator;
+function augmentIndexHtmlPlugin(generator) {
+    const { deployUrl, crossOrigin, sri = false, entrypoints, imageDomains } = generator.options;
+    return async (html, options) => {
+        const { lang, baseHref, outputPath = '', files, hints } = options;
+        return (0, augment_index_html_1.augmentIndexHtml)({
+            html,
+            baseHref,
+            deployUrl,
+            crossOrigin,
+            sri,
+            lang,
+            entrypoints,
+            loadOutputFile: (filePath) => generator.readAsset((0, node_path_1.join)(outputPath, filePath)),
+            imageDomains,
+            files,
+            hints,
+        });
+    };
+}
+function inlineFontsPlugin({ options }) {
+    const inlineFontsProcessor = new inline_fonts_1.InlineFontsProcessor({
+        minify: options.optimization?.styles.minify,
+    });
+    return async (html) => inlineFontsProcessor.process(html);
+}
+function inlineCriticalCssPlugin(generator) {
+    const inlineCriticalCssProcessor = new inline_critical_css_1.InlineCriticalCssProcessor({
+        minify: generator.options.optimization?.styles.minify,
+        deployUrl: generator.options.deployUrl,
+        readAsset: (filePath) => generator.readAsset(filePath),
+    });
+    return async (html, options) => inlineCriticalCssProcessor.process(html, { outputPath: options.outputPath });
+}
+function addNoncePlugin() {
+    return (html) => (0, nonce_1.addNonce)(html);
+}
+function postTransformPlugin({ options }) {
+    return async (html) => (options.postTransform ? options.postTransform(html) : html);
+}
+function addEventDispatchContractPlugin() {
+    return (html) => (0, add_event_dispatch_contract_1.addEventDispatchContract)(html);
+}

package/src/utils/index-file/inline-critical-css.d.ts

@@ -0,0 +1,24 @@
+/**
+ * @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 interface InlineCriticalCssProcessOptions {
+    outputPath: string;
+}
+export interface InlineCriticalCssProcessorOptions {
+    minify?: boolean;
+    deployUrl?: string;
+    readAsset?: (path: string) => Promise<string>;
+}
+export declare class InlineCriticalCssProcessor {
+    protected readonly options: InlineCriticalCssProcessorOptions;
+    constructor(options: InlineCriticalCssProcessorOptions);
+    process(html: string, options: InlineCriticalCssProcessOptions): Promise<{
+        content: string;
+        warnings: string[];
+        errors: string[];
+    }>;
+}

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

@@ -0,0 +1,179 @@
+"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;