agerix/iconify
2
0
Fork 0
mirror of https://github.com/iconify/iconify.git synced 2024-11-09 14:50:56 +00:00
Code Issues Releases Activity

feat: automatic xml preface cleanup

Browse Source
This commit is contained in:
Joaquín Sánchez Jiménez 2022-06-17 22:10:54 +02:00
parent 5ab275c091
commit 107b28bdf1
9 changed files with 64 additions and 31 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
demo/browser-tests/package-lock.json generated
View File

@ -1,12 +1,12 @@
{
"name": "@iconify-demo/browser-tests",
"version": "2.2.0",
"version": "2.2.1",
"lockfileVersion": 2,
"requires": true,
"packages": {
"": {
"name": "@iconify-demo/browser-tests",
"version": "2.2.0",
"version": "2.2.1",
"license": "(Apache-2.0 OR GPL-2.0)",
"devDependencies": {
"@iconify/iconify": "^2.2.1",

2
packages/api-redundancy/package-lock.json generated
View File

@ -7,7 +7,7 @@
"": {
"name": "@iconify/api-redundancy",
"version": "1.1.0",
"license": "(Apache-2.0 OR GPL-2.0)",
"license": "MIT",
"devDependencies": {
"@types/jest": "^27.4.1",
"@types/node": "^17.0.22",

14
packages/utils/src/loader/custom.ts
View File

@ -30,17 +30,21 @@ export async function getCustomIcon(
}
if (result) {
const cleanupIdx = result.indexOf('<svg');
if (cleanupIdx > 0) result = result.slice(cleanupIdx);
const { transform } = options?.customizations ?? {};
result =
typeof transform === 'function'
? await transform(result, collection, icon)
: result;
if (!result.startsWith('<svg')) {
console.warn(
`Custom icon "${icon}" in "${collection}" is not a valid SVG`
);
return result;
}
const { transform } = options?.customizations ?? {};
result =
typeof transform === 'function'
? await transform(result, collection, icon)
: result;
return await mergeIconProps(
options?.customizations?.trimCustomSvg === true
? trimSVG(result)

4
packages/utils/src/loader/node-loaders.ts
View File

@ -25,7 +25,9 @@ export function FileSystemIconLoader(
continue;
}
if (stat.isFile()) {
const svg = await fs.readFile(path, 'utf-8');
let svg = await fs.readFile(path, 'utf-8');
const cleanupIdx = svg.indexOf('<svg');
if (cleanupIdx > 0) svg = svg.slice(cleanupIdx);
return typeof transform === 'function'
? await transform(svg)
: svg;

8
packages/utils/tests/file-system-icon-test.ts
View File

@ -8,6 +8,14 @@ describe('Testing FileSystemIconLoader', () => {
expect(result && result.indexOf('svg') > -1).toBeTruthy();
});
test('FileSystemIconLoader cleanups svg preface', async () => {
const result = await FileSystemIconLoader(fixturesDir)(
'circle-xml-preface'
);
console.log(result);
expect(result && result.indexOf('<svg') === 0).toBeTruthy();
});
test('FileSystemIconLoader with transform', async () => {
const result = await FileSystemIconLoader(fixturesDir, (icon) => {
return icon.replace('<svg ', '<svg width="1em" height="1em" ');

3
packages/utils/tests/fixtures/circle-xml-preface.svg vendored Normal file
View File

@ -0,0 +1,3 @@
<?xml version="1.0" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg viewBox="0 0 120 120" xmlns="http://www.w3.org/2000/svg"><circle cx="60" cy="60" r="50"/></svg>
Side by Side

After

Width:  |  Height:  |  Size: 238 B

17
packages/utils/tests/get-custom-icon-test.ts
View File

@ -35,6 +35,21 @@ describe('Testing getCustomIcon', () => {
);
});
test('CustomIconLoader cleanups svg preface', async () => {
const svg = `<?xml version="1.0" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 120 120">
<circle cx="60" cy="60" r="50"/>
</svg>
`;
const result = await getCustomIcon(() => svg, 'a', 'b', {
customizations: { trimCustomSvg: true },
});
expect(result).toEqual(
'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 120 120"><circle cx="60" cy="60" r="50"/></svg>'
);
});
test("CustomIconLoader with transform: scale/width/height shouldn't take effect", async () => {
const svg = await fs.readFile(fixturesDir + '/circle.svg', 'utf8');
const options: IconifyLoaderOptions = {
@ -66,7 +81,7 @@ describe('Testing getCustomIcon', () => {
expect(usedProps.height).toEqual('4em');
});
test('Icon with XML heading', async () => {
test.skip('Icon with XML heading', async () => {
// Intercept console.warn
let warned = false;
const warn = console.warn;

3
packages/utils/tests/load-icon-test.ts
View File

@ -24,6 +24,7 @@ describe('Testing loadIcon', () => {
});
test('CustomCollection using dynamic import', async () => {
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
// @ts-ignore
const result = await loadIcon('flat-color-icons', 'up-right', {
customCollections: {
@ -61,7 +62,7 @@ describe('Testing loadIcon', () => {
expect(result && result.indexOf('height="1em"') > -1).toBeTruthy();
});
test('CustomCollection Icon with XML heading', async () => {
test.skip('CustomCollection Icon with XML heading', async () => {
const svg = await loader('1f3eb');
expect(svg).toBeTruthy();
// Intercept console.warn