67 lines
2.9 KiB
TypeScript
67 lines
2.9 KiB
TypeScript
import { MatIconRegistry } from '@angular/material/icon';
|
|
import { CustomIconRegistry, SvgIconInfo } from './custom-icon-registry';
|
|
|
|
describe('CustomIconRegistry', () => {
|
|
it('should get the SVG element for a preloaded icon from the cache', () => {
|
|
const mockHttp: any = {};
|
|
const mockSanitizer: any = {};
|
|
const mockDocument: any = {};
|
|
const svgSrc = '<svg xmlns="http://www.w3.org/2000/svg" focusable="false" ' +
|
|
'viewBox="0 0 24 24"><path d="M8.59 16.34l4.58-4.59-4.58-4.59L10 5.75l6 6-6 6z"/></svg>';
|
|
const svgIcons: SvgIconInfo[] = [
|
|
{ name: 'test_icon', svgSource: svgSrc }
|
|
];
|
|
const registry = new CustomIconRegistry(mockHttp, mockSanitizer, mockDocument, svgIcons);
|
|
let svgElement: SVGElement|undefined;
|
|
registry.getNamedSvgIcon('test_icon').subscribe(el => svgElement = el);
|
|
expect(svgElement).toEqual(createSvg(svgSrc));
|
|
});
|
|
|
|
it('should support caching icons with a namespace', () => {
|
|
const mockHttp: any = {};
|
|
const mockSanitizer: any = {};
|
|
const mockDocument: any = {};
|
|
|
|
const svgSrc1 = '<svg xmlns="http://www.w3.org/2000/svg"><path d="h100" /></svg>';
|
|
const svgSrc2 = '<svg xmlns="http://www.w3.org/2000/svg"><path d="h200" /></svg>';
|
|
const svgSrc3 = '<svg xmlns="http://www.w3.org/2000/svg"><path d="h300" /></svg>';
|
|
const svgIcons: SvgIconInfo[] = [
|
|
{ name: 'test_icon', svgSource: svgSrc1 },
|
|
{ namespace: 'foo', name: 'test_icon', svgSource: svgSrc2 },
|
|
{ namespace: 'bar', name: 'test_icon', svgSource: svgSrc3 },
|
|
];
|
|
|
|
const registry = new CustomIconRegistry(mockHttp, mockSanitizer, mockDocument, svgIcons);
|
|
let svgElement: SVGElement|undefined;
|
|
registry.getNamedSvgIcon('test_icon', 'foo').subscribe(el => svgElement = el);
|
|
|
|
expect(svgElement).toEqual(createSvg(svgSrc2));
|
|
});
|
|
|
|
it('should call through to the MdIconRegistry if the icon name is not in the preloaded cache', () => {
|
|
const mockHttp: any = {};
|
|
const mockSanitizer: any = {};
|
|
const mockDocument: any = {};
|
|
const svgSrc = '<svg xmlns="http://www.w3.org/2000/svg" focusable="false" ' +
|
|
'viewBox="0 0 24 24"><path d="M8.59 16.34l4.58-4.59-4.58-4.59L10 5.75l6 6-6 6z"/></svg>';
|
|
const svgIcons: SvgIconInfo[] = [
|
|
{ name: 'test_icon', svgSource: svgSrc }
|
|
];
|
|
spyOn(MatIconRegistry.prototype, 'getNamedSvgIcon');
|
|
|
|
const registry = new CustomIconRegistry(mockHttp, mockSanitizer, mockDocument, svgIcons);
|
|
|
|
registry.getNamedSvgIcon('other_icon');
|
|
expect(MatIconRegistry.prototype.getNamedSvgIcon).toHaveBeenCalledWith('other_icon', undefined);
|
|
|
|
registry.getNamedSvgIcon('other_icon', 'foo');
|
|
expect(MatIconRegistry.prototype.getNamedSvgIcon).toHaveBeenCalledWith('other_icon', 'foo');
|
|
});
|
|
});
|
|
|
|
function createSvg(svgSrc: string): SVGElement {
|
|
const div = document.createElement('div');
|
|
div.innerHTML = svgSrc;
|
|
return div.querySelector('svg')!;
|
|
}
|