Skip to content

Commit

Permalink
fix(@angular-devkit/build-angular): correctly handle data URIs with e…
Browse files Browse the repository at this point in the history
…scaped quotes in stylesheets

Previously, the RegExp didn't correctly handle cases where data URIs had escaped quotes like the below

```css
url("data:image/svg+xml;charset=utf-8,<svg width=/"16/" height=/"15/"></svg>")
```

Closes #23680
  • Loading branch information
alan-agius4 authored and dgp1130 committed Aug 4, 2022
1 parent 88c3b71 commit 70bc354
Show file tree
Hide file tree
Showing 2 changed files with 15 additions and 2 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -693,4 +693,17 @@ describe('Browser Builder styles', () => {

await browserBuild(architect, host, target, { styles: ['src/styles.css'] });
});

it('works when Data URI has escaped quote', async () => {
const svgData = `"data:image/svg+xml;charset=utf-8,<svg width=/"16/" height=/"15/"></svg>"`;

host.writeMultipleFiles({
'src/styles.css': `
div { background: url(${svgData}) }
`,
});

const result = await browserBuild(architect, host, target, { styles: ['src/styles.css'] });
expect(await result.files['styles.css']).toContain(svgData);
});
});
Original file line number Diff line number Diff line change
Expand Up @@ -155,7 +155,7 @@ export default function (options?: PostcssCliResourcesOptions): Plugin {
}

const value = decl.value;
const urlRegex = /url\(\s*(?:"([^"]+)"|'([^']+)'|(.+?))\s*\)/g;
const urlRegex = /url(?:\(\s*['"]?)(.*?)(?:['"]?\s*\))/g;
const segments: string[] = [];

let match;
Expand All @@ -168,7 +168,7 @@ export default function (options?: PostcssCliResourcesOptions): Plugin {

// eslint-disable-next-line no-cond-assign
while ((match = urlRegex.exec(value))) {
const originalUrl = match[1] || match[2] || match[3];
const originalUrl = match[1];
let processedUrl;
try {
processedUrl = await process(originalUrl, context, resourceCache);
Expand Down

3 comments on commit 70bc354

@Bykiev
Copy link

@Bykiev Bykiev commented on 70bc354 Aug 11, 2022

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Hi, thank you for the fix, but can you please cherry-pick changes to v13 branch and release update?

@alan-agius4
Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@Bykiev, that is not possible as v13 is in LTS.

For more information about LTS fixes see: https://angular.io/guide/releases#lts-fixes

@Bykiev
Copy link

@Bykiev Bykiev commented on 70bc354 Aug 11, 2022

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thank you, didn't know v13 is in LTS

Please sign in to comment.