import { replaceIDs } from '../lib/svg/id';
describe('Testing replaceIDs', () => {
test('Simple code', () => {
const body =
'';
const expected =
'';
// Using callback
let counter = 0;
expect(
replaceIDs(body, () => 'callback' + (counter++).toString())
).toBe(expected);
});
test('Many IDs', () => {
const body =
'';
// Counter starts with 0, so first id is testID0
expect(replaceIDs(body, 'testID')).toBe(
''
);
// Using callback
let counter = 0;
const replaced = replaceIDs(
body,
() => 'callbackID' + (counter++).toString()
);
expect(replaced).toBe(
body
.replace(/ssvg-id-1st-place-medala/g, 'callbackID0')
.replace(/ssvg-id-1st-place-medalb/g, 'callbackID7')
.replace(/ssvg-id-1st-place-medalc/g, 'callbackID10')
.replace(/ssvg-id-1st-place-medald/g, 'callbackID1')
.replace(/ssvg-id-1st-place-medale/g, 'callbackID11')
.replace(/ssvg-id-1st-place-medalf/g, 'callbackID2')
.replace(/ssvg-id-1st-place-medalg/g, 'callbackID12')
.replace(/ssvg-id-1st-place-medalh/g, 'callbackID3')
.replace(/ssvg-id-1st-place-medali/g, 'callbackID13')
.replace(/ssvg-id-1st-place-medalj/g, 'callbackID4')
.replace(/ssvg-id-1st-place-medalk/g, 'callbackID8')
.replace(/ssvg-id-1st-place-medall/g, 'callbackID14')
.replace(/ssvg-id-1st-place-medalm/g, 'callbackID5')
.replace(/ssvg-id-1st-place-medaln/g, 'callbackID15')
.replace(/ssvg-id-1st-place-medalo/g, 'callbackID9')
.replace(/ssvg-id-1st-place-medalp/g, 'callbackID6')
);
// Replacing it again to test double replacement with overlapping numbers
counter = 10;
expect(
replaceIDs(replaced, () => 'callbackID' + (counter++).toString())
).toBe(
body
.replace(/ssvg-id-1st-place-medala/g, 'callbackID10')
.replace(/ssvg-id-1st-place-medalb/g, 'callbackID17')
.replace(/ssvg-id-1st-place-medalc/g, 'callbackID20')
.replace(/ssvg-id-1st-place-medald/g, 'callbackID11')
.replace(/ssvg-id-1st-place-medale/g, 'callbackID21')
.replace(/ssvg-id-1st-place-medalf/g, 'callbackID12')
.replace(/ssvg-id-1st-place-medalg/g, 'callbackID22')
.replace(/ssvg-id-1st-place-medalh/g, 'callbackID13')
.replace(/ssvg-id-1st-place-medali/g, 'callbackID23')
.replace(/ssvg-id-1st-place-medalj/g, 'callbackID14')
.replace(/ssvg-id-1st-place-medalk/g, 'callbackID18')
.replace(/ssvg-id-1st-place-medall/g, 'callbackID24')
.replace(/ssvg-id-1st-place-medalm/g, 'callbackID15')
.replace(/ssvg-id-1st-place-medaln/g, 'callbackID25')
.replace(/ssvg-id-1st-place-medalo/g, 'callbackID19')
.replace(/ssvg-id-1st-place-medalp/g, 'callbackID16')
);
});
test('Matching parts', () => {
const body =
'';
const expected =
'';
expect(
replaceIDs(body, (id: string) => {
switch (id) {
case 'test1':
return 'callbackID0';
case 'test':
return 'callbackID1';
default:
throw new Error(`Unexpected id "${id}""`);
}
})
).toBe(expected);
});
test('With animation', () => {
const body =
'';
// To avoid messing up counter, using custom callback
let counter = 0;
expect(
replaceIDs(body, () => 'callbackID' + (counter++).toString())
).toBe(
body
.replace(/ssvg-id-compassa/g, 'callbackID2')
.replace(/ssvg-id-compassb/g, 'callbackID0')
.replace(/ssvg-id-compassc/g, 'callbackID1')
);
});
test('Animation with calculations', () => {
const body =
'';
expect(
replaceIDs(body, (id) => id.replace('animation', 'callback'))
).toBe(body.replace(/animation/g, 'callback'));
});
test('Matching parts in attributes, tags and content', () => {
// 'path' matches tag -> callbackID0
// 'M12' matches path value -> callbackID1
// 'd' matches attribute -> callbackID2
const body =
'';
const expected =
'';
// Using custom callback for reliable results
expect(
replaceIDs(body, (id: string) => {
switch (id) {
case 'path':
return 'callbackID0';
case 'M12':
return 'callbackID1';
case 'd':
return 'callbackID2';
default:
throw new Error(`Unexpected id: ${id}`);
}
})
).toBe(expected);
});
test('Replacing complex animation', () => {
const svg =
'';
const replaced = replaceIDs(svg);
expect(replaced.indexOf('spinner_')).toBe(-1);
});
});