diff --git a/packages/angular_devkit/build_angular/src/builders/browser/schema.json b/packages/angular_devkit/build_angular/src/builders/browser/schema.json index 54bbdd52bade..e6c61bd864c5 100644 --- a/packages/angular_devkit/build_angular/src/builders/browser/schema.json +++ b/packages/angular_devkit/build_angular/src/builders/browser/schema.json @@ -89,7 +89,7 @@ "inlineCritical": { "type": "boolean", "description": "Extract and inline critical CSS definitions to improve first paint time.", - "default": true + "default": false } }, "additionalProperties": false diff --git a/packages/angular_devkit/build_angular/src/builders/browser/tests/options/inline-critical_spec.ts b/packages/angular_devkit/build_angular/src/builders/browser/tests/options/inline-critical_spec.ts index 99eaade9d0a8..a477297a1d21 100644 --- a/packages/angular_devkit/build_angular/src/builders/browser/tests/options/inline-critical_spec.ts +++ b/packages/angular_devkit/build_angular/src/builders/browser/tests/options/inline-critical_spec.ts @@ -40,7 +40,7 @@ describeBuilder(buildWebpackBrowser, BROWSER_BUILDER_INFO, (harness) => { harness.expectFile('dist/index.html').content.toContain(`body{color:#000;}`); }); - it(`should extract critical css when 'optimization' is unset`, async () => { + it(`should not extract critical css when 'optimization' is unset`, async () => { harness.useTarget('build', { ...BASE_OPTIONS, styles: ['src/styles.css'], @@ -50,15 +50,10 @@ describeBuilder(buildWebpackBrowser, BROWSER_BUILDER_INFO, (harness) => { const { result } = await harness.executeOnce(); expect(result?.success).toBe(true); - harness - .expectFile('dist/index.html') - .content.toContain( - ``, - ); - harness.expectFile('dist/index.html').content.toContain(`body{color:#000;}`); + harness.expectFile('dist/index.html').content.not.toContain(` { + it(`should not extract critical css when 'optimization' is true`, async () => { harness.useTarget('build', { ...BASE_OPTIONS, styles: ['src/styles.css'], @@ -68,12 +63,7 @@ describeBuilder(buildWebpackBrowser, BROWSER_BUILDER_INFO, (harness) => { const { result } = await harness.executeOnce(); expect(result?.success).toBe(true); - harness - .expectFile('dist/index.html') - .content.toContain( - ``, - ); - harness.expectFile('dist/index.html').content.toContain(`body{color:#000;}`); + harness.expectFile('dist/index.html').content.not.toContain(` { diff --git a/packages/angular_devkit/build_angular/src/utils/normalize-optimization.ts b/packages/angular_devkit/build_angular/src/utils/normalize-optimization.ts index 9bbf455b86f5..d270503471d6 100644 --- a/packages/angular_devkit/build_angular/src/utils/normalize-optimization.ts +++ b/packages/angular_devkit/build_angular/src/utils/normalize-optimization.ts @@ -31,7 +31,8 @@ export function normalizeOptimization( ? optimization.styles : { minify: !!optimization.styles, - inlineCritical: !!optimization.styles, + // inlineCritical is always false unless explictly set. + inlineCritical: false, }, fonts: typeof optimization.fonts === 'object' @@ -46,7 +47,8 @@ export function normalizeOptimization( scripts: optimization, styles: { minify: optimization, - inlineCritical: optimization, + // inlineCritical is always false unless explictly set. + inlineCritical: false, }, fonts: { inline: optimization,