agerix/iconify
2
0
Fork 0
mirror of https://github.com/iconify/iconify.git synced 2024-12-12 21:57:50 +00:00
Code Issues Releases Activity

Add annotations, clean up getCustomIcon and test loading bad icon

Browse Source
This commit is contained in:
Vjacheslav Trushkin 2022-01-09 23:23:02 +02:00
parent ba633df0c8
commit 30c4ddf3f1
4 changed files with 38 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -4,6 +4,9 @@ import type { CustomIconLoader, InlineCollection } from './types';
const debug = createDebugger('@iconify-loader:custom');
/**
* Get custom icon from inline collection or using loader
*/
export async function getCustomIcon(
custom: CustomIconLoader | InlineCollection,
collection: string,

11
packages/utils/src/loader/types.ts
View File

@ -1,10 +1,21 @@
import type { Awaitable } from '@antfu/utils';
/**
* Custom icon loader, used by getCustomIcon()
*/
export type CustomIconLoader = (name: string) => Awaitable<string | undefined>;
/**
* List of icons as object. Key is icon name, value is icon data or callback (can be async) to get icon data
*/
export type InlineCollection = Record<
string,
string | (() => Awaitable<string | undefined>)
>;
/**
* Collection of custom icons. Key is collection name, value is loader or InlineCollection object
*/
export type CustomCollections = Record<
string,
CustomIconLoader | InlineCollection

1
packages/utils/tests/fixtures/1f3eb.svg vendored Normal file
View File

@ -0,0 +1 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?><svg xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:cc="http://creativecommons.org/ns#" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns:svg="http://www.w3.org/2000/svg" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 47.5 47.5" style="enable-background:new 0 0 47.5 47.5;" xml:space="preserve" version="1.1" id="svg2"><metadata id="metadata8"><rdf:RDF><cc:Work rdf:about=""><dc:format>image/svg+xml</dc:format><dc:type rdf:resource="http://purl.org/dc/dcmitype/StillImage"/></cc:Work></rdf:RDF></metadata><defs id="defs6"><clipPath id="clipPath16" clipPathUnits="userSpaceOnUse"><path id="path18" d="M 0,38 38,38 38,0 0,0 0,38 Z"/></clipPath></defs><g transform="matrix(1.25,0,0,-1.25,0,47.5)" id="g10"><g id="g12"><g clip-path="url(#clipPath16)" id="g14"><g transform="translate(37,3)" id="g20"><path id="path22" style="fill:#ffcc4d;fill-opacity:1;fill-rule:nonzero;stroke:none" d="m 0,0 c 0,-1.104 -0.896,-2 -2,-2 l -32,0 c -1.104,0 -2,0.896 -2,2 l 0,19 c 0,1.104 0.896,2 2,2 l 32,0 c 1.104,0 2,-0.896 2,-2 L 0,0 Z"/></g><g transform="translate(35,24)" id="g24"><path id="path26" style="fill:#6d6e71;fill-opacity:1;fill-rule:nonzero;stroke:none" d="m 0,0 -32,0 c -1.104,0 -2,-0.896 -2,-2 L 2,-2 C 2,-0.896 1.104,0 0,0"/></g><path id="path28" style="fill:#3b88c3;fill-opacity:1;fill-rule:nonzero;stroke:none" d="M 35,9 3,9 3,13 35,13 35,9 Z"/><path id="path30" style="fill:#3b88c3;fill-opacity:1;fill-rule:nonzero;stroke:none" d="m 35,15 -32,0 0,4 32,0 0,-4 z"/><path id="path32" style="fill:#3b88c3;fill-opacity:1;fill-rule:nonzero;stroke:none" d="M 35,3 3,3 3,7 35,7 35,3 Z"/><path id="path34" style="fill:#ffcc4d;fill-opacity:1;fill-rule:nonzero;stroke:none" d="m 31,2 -2,0 0,18 2,0 0,-18 z"/><g transform="translate(23,37)" id="g36"><path id="path38" style="fill:#ffe8b6;fill-opacity:1;fill-rule:nonzero;stroke:none" d="m 0,0 -16,0 c -1.104,0 -2,-0.896 -2,-2 l 0,-34 20,0 0,34 C 2,-0.896 1.104,0 0,0"/></g><g transform="translate(23,37)" id="g40"><path id="path42" style="fill:#808285;fill-opacity:1;fill-rule:nonzero;stroke:none" d="m 0,0 -16,0 c -1.104,0 -2,-0.896 -2,-2 L 2,-2 C 2,-0.896 1.104,0 0,0"/></g><path id="path44" style="fill:#55acee;fill-opacity:1;fill-rule:nonzero;stroke:none" d="m 23,15 -16,0 0,4 16,0 0,-4 z"/><path id="path46" style="fill:#55acee;fill-opacity:1;fill-rule:nonzero;stroke:none" d="M 23,9 7,9 7,13 23,13 23,9 Z"/><path id="path48" style="fill:#55acee;fill-opacity:1;fill-rule:nonzero;stroke:none" d="M 23,3 7,3 7,7 23,7 23,3 Z"/><path id="path50" style="fill:#ffe8b6;fill-opacity:1;fill-rule:nonzero;stroke:none" d="m 13,1 -2,0 0,29 2,0 0,-29 z"/><path id="path52" style="fill:#ffe8b6;fill-opacity:1;fill-rule:nonzero;stroke:none" d="m 19,1 -2,0 0,29 2,0 0,-29 z"/><path id="path54" style="fill:#226699;fill-opacity:1;fill-rule:nonzero;stroke:none" d="m 17,1 -4,0 0,6 4,0 0,-6 z"/><g transform="translate(21,28)" id="g56"><path id="path58" style="fill:#a7a9ac;fill-opacity:1;fill-rule:nonzero;stroke:none" d="m 0,0 c 0,-3.313 -2.687,-6 -6,-6 -3.313,0 -6,2.687 -6,6 0,3.313 2.687,6 6,6 3.313,0 6,-2.687 6,-6"/></g><g transform="translate(19,28)" id="g60"><path id="path62" style="fill:#e6e7e8;fill-opacity:1;fill-rule:nonzero;stroke:none" d="m 0,0 c 0,-2.209 -1.791,-4 -4,-4 -2.209,0 -4,1.791 -4,4 0,2.209 1.791,4 4,4 2.209,0 4,-1.791 4,-4"/></g><g transform="translate(18,27)" id="g64"><path id="path66" style="fill:#a0041e;fill-opacity:1;fill-rule:nonzero;stroke:none" d="m 0,0 -3,0 c -0.552,0 -1,0.448 -1,1 l 0,5 c 0,0.552 0.448,1 1,1 0.552,0 1,-0.448 1,-1 L -2,2 0,2 C 0.552,2 1,1.552 1,1 1,0.448 0.552,0 0,0"/></g></g></g></g></svg>
Side by Side

After

Width:  |  Height:  |  Size: 3.6 KiB

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

@ -1,15 +1,17 @@
import { promises as fs } from 'fs';
import { getCustomIcon } from '../lib';
const svg =
'<svg viewBox="0 0 120 120" xmlns="http://www.w3.org/2000/svg"><circle cx="60" cy="60" r="50"/></svg>';
const fixturesDir = __dirname + '/fixtures';
describe('Testing getCustomIcon', () => {
test('CustomIconLoader', async () => {
const svg = await fs.readFile(fixturesDir + '/circle.svg', 'utf8');
const result = await getCustomIcon(() => svg, 'a', 'b');
expect(svg).toEqual(result);
});
test('CustomIconLoader with transform', async () => {
const svg = await fs.readFile(fixturesDir + '/circle.svg', 'utf8');
const result = await getCustomIcon(
() => svg,
'a',
@ -21,4 +23,23 @@ describe('Testing getCustomIcon', () => {
expect(result && result.indexOf('width="1em"') > -1).toBeTruthy();
expect(result && result.indexOf('height="1em"') > -1).toBeTruthy();
});
test('Icon with XML heading', async () => {
// Intercept console.warn
let warned = false;
const warn = console.warn;
console.warn = (/*...args*/) => {
// warn.apply(this, args);
warned = true;
};
const svg = await fs.readFile(fixturesDir + '/1f3eb.svg', 'utf8');
const result = await getCustomIcon(() => svg, 'a', 'b');
// Restore console.warn
console.warn = warn;
expect(svg).toEqual(result);
expect(warned).toEqual(true);
});
});