Graham/angular-cli
1
0
Fork 0
mirror of https://github.com/angular/angular-cli.git synced 2025-05-17 19:13:34 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix(@angular-devkit/build-angular): bring back style tags in browser builder

Browse Source
This commit is contained in:
Jan Krems 2024-11-15 14:03:18 -08:00 committed by Jan Olaf Martin
parent 2e43ec6654
commit d746de59f3
3 changed files with 87 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

55
packages/angular/build/src/builders/application/tests/behavior/stylesheet_autoprefixer_spec.ts
View File

@ -200,5 +200,60 @@ describeBuilder(buildApplication, APPLICATION_BUILDER_INFO, (harness) => {
harness.expectFile('dist/browser/main.js').content.toMatch(/{\\n\s*hyphens:\s*none;\\n\s*}/);
});
it('should add prefixes for listed browsers in inline template styles', async () => {
await harness.writeFile(
'.browserslistrc',
`
Safari 15.4
Edge 104
Firefox 91
`,
);
await harness.modifyFile('src/app/app.component.ts', (content) => {
return content.replace('styleUrls', 'styles').replace('./app.component.css', '');
});
await harness.modifyFile('src/app/app.component.html', (content) => {
return `<style>aside { hyphens: none; }</style>\n${content}`;
});
harness.useTarget('build', {
...BASE_OPTIONS,
});
const { result } = await harness.executeOnce();
expect(result?.success).toBeTrue();
harness
.expectFile('dist/browser/main.js')
// div[_ngcontent-%COMP%] {\n -webkit-hyphens: none;\n hyphens: none;\n}\n
.content.toMatch(/{\\n\s*-webkit-hyphens:\s*none;\\n\s*hyphens:\s*none;\\n\s*}/);
});
it('should not add prefixes if not required by browsers in inline template styles', async () => {
await harness.writeFile(
'.browserslistrc',
`
Edge 110
`,
);
await harness.modifyFile('src/app/app.component.ts', (content) => {
return content.replace('styleUrls', 'styles').replace('./app.component.css', '');
});
await harness.modifyFile('src/app/app.component.html', (content) => {
return `<style>aside { hyphens: none; }</style>\n${content}`;
});
harness.useTarget('build', {
...BASE_OPTIONS,
});
const { result } = await harness.executeOnce();
expect(result?.success).toBeTrue();
harness.expectFile('dist/browser/main.js').content.toMatch(/{\\n\s*hyphens:\s*none;\\n\s*}/);
});
});
});

31
packages/angular_devkit/build_angular/src/builders/browser/specs/styles_spec.ts
View File

@ -140,6 +140,37 @@ describe('Browser Builder styles', () => {
expect(await files['main.js']).toContain('-webkit-mask-composite');
});
it('supports autoprefixer with inline template styles in AOT mode', async () => {
host.writeMultipleFiles({
'./src/app/app.component.html': `
<style>div { mask-composite: add; }</style>
<div>{{ title }}</div>
`,
'./src/app/app.component.ts': `
import { Component } from '@angular/core';
@Component({
selector: 'app-root',
standalone: false,
templateUrl: './app.component.html',
styles: 'div { font-weight: 500; }',
})
export class AppComponent {
title = 'app';
}
`,
'.browserslistrc': `
Safari 15.4
Edge 104
Firefox 91
`,
});
const { files } = await browserBuild(architect, host, target, { aot: true });
expect(await files['main.js']).toContain('-webkit-mask-composite');
});
extensionsWithImportSupport.forEach((ext) => {
it(`supports imports in ${ext} files`, async () => {
host.writeMultipleFiles({

2
packages/ngtools/webpack/src/ivy/host.ts
View File

@ -38,7 +38,7 @@ export function augmentHostWithResources(
resourceLoader.setAffectedResources(filePath, [filePath]);
return content;
return Promise.resolve(content);
} else {
return resourceLoader.get(filePath);
}