agerix/iconify
2
0
Fork 0
mirror of https://github.com/iconify/iconify.git synced 2025-01-15 11:17:02 +00:00
Code Issues Releases Activity

Clean up unit tests for browser

Browse Source
This commit is contained in:
Vjacheslav Trushkin 2020-12-16 11:48:50 +02:00
parent 6cb69b558d
commit 3e4e42a723
13 changed files with 43 additions and 40 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
packages/browser-tests/tests/10-fake-api-test.ts
View File

@ -156,7 +156,6 @@ describe('Testing fake API', () => {
resources: ['https://api1.local', 'https://api2.local'],
rotate: 20,
timeout: 100,
limit: 1,
});
setFakeData(provider, prefix, data);

7
packages/browser-tests/tests/10-finder-iconify-test.ts
View File

@ -12,7 +12,7 @@ describe('Testing Iconify finder', () => {
it('Finding nodes and getting node name', () => {
const node = getNode('iconify-finder');
node.innerHTML =
'<div><p>List of <span>icons</span></p><ul>' +
'<div><p>Testing <span>icons</span> placeholders (not replaced with SVG)</p><ul>' +
'<li>Valid icons: <span class="iconify" data-icon="mdi:home"></span><i class="iconify-inline" data-icon="mdi:account"></i></li>' +
'<li>Icon without name: <span class="iconify"></span></li>' +
'<li>Icon with extra classes: <i class="iconify iconify--mdi" data-icon="mdi:home"></i></li>' +
@ -80,7 +80,8 @@ describe('Testing Iconify finder', () => {
it('Transformations and inline/block', () => {
const node = getNode('iconify-finder');
node.innerHTML =
'Block icon:' +
'This test does not render SVG!<br />' +
'Block icons:' +
' <span class="iconify-inline" data-icon="mdi:home" data-inline="false"></span>' +
'Inline rotated icons:' +
' <span class="iconify-inline" data-icon="mdi:account" data-rotate="90deg"></span>' +
@ -189,6 +190,7 @@ describe('Testing Iconify finder', () => {
it('Dimensions', () => {
const node = getNode('iconify-finder');
node.innerHTML =
'This test does not render SVG!<br />' +
'Block icon:' +
' <span class="iconify iconify-inline" data-icon="mdi:home" data-inline="false"></span>' +
'Width and height:' +
@ -273,6 +275,7 @@ describe('Testing Iconify finder', () => {
it('Alignment', () => {
const node = getNode('iconify-finder');
node.innerHTML =
'This test does not render SVG!<br />' +
'Inline icon:' +
' <i class="iconify" data-icon="mdi:home" data-inline="true"></i>' +
'Alignment:' +

2
packages/browser-tests/tests/10-finder-v1-test.ts
View File

@ -21,7 +21,7 @@ describe('Testing legacy finder', () => {
it('Finding nodes', () => {
const node = getNode('finder');
node.innerHTML =
'<div><p>List of <span>icons</span></p><ul>' +
'<div><p>List of <span>icon</span> placeholders (this test does not render SVG)</p><ul>' +
'<li>Valid icons:' +
' <span class="iconify" data-icon="mdi:home"></span>' +
' <i class="iconify" data-icon="mdi:account"></i>' +

2
packages/browser-tests/tests/10-finder-v2-test.ts
View File

@ -21,7 +21,7 @@ describe('Testing finder', () => {
it('Finding nodes', () => {
const node = getNode('finder');
node.innerHTML =
'<div><p>List of <span>icons</span></p><ul>' +
'<div><p>List of <span>icon</span> placeholders (this test does not render SVG)</p><ul>' +
'<li>Valid icons:' +
' <span class="iconify" data-icon="mdi:home"></span>' +
' <i class="iconify" data-icon="mdi:account"></i>' +

12
packages/browser-tests/tests/20-renderer-v1-test.ts
View File

@ -49,7 +49,7 @@ describe('Testing legacy renderer', () => {
it('Convert placeholders to SVG', () => {
const node = getNode('renderer');
node.innerHTML =
'<div><p>Testing renderer v1</p><ul>' +
'<div><p>Testing renderer v1 (should render SVG!)</p><ul>' +
'<li>Inline icons:<br />' +
' Red icon with red border: <span class="iconify" data-icon="mdi:home" style="color: red; border: 1px solid red;"></span><br />' +
' No vertical-align, green border: <i class="iconify test-icon iconify--mdi-account" data-icon="mdi:account" style="vertical-align: 0;" data-flip="horizontal" aria-hidden="false"></i>' +
@ -629,7 +629,7 @@ describe('Testing legacy renderer', () => {
it('Empty icon name', () => {
const node = getNode('renderer');
node.innerHTML =
'<div>Testing empty icon name v1: <span class="iconify" data-icon="mdi:home" data-flip="horizontal" style="color: red; box-shadow: 0 0 2px black;"></span></div>';
'<div>Testing empty icon name v1 (should render SVG!): <span class="iconify" data-icon="mdi:home" data-flip="horizontal" style="color: red; box-shadow: 0 0 2px black;"></span></div>';
// Get items
const items = findPlaceholders(node);
@ -676,7 +676,7 @@ describe('Testing legacy renderer', () => {
it('Change icon name', () => {
const node = getNode('renderer');
node.innerHTML =
'<div>Testing icon name v1: <span class="iconify" data-icon="mdi:home" data-flip="horizontal" style="color: red; box-shadow: 0 0 2px black;"></span></div>';
'<div>Testing icon name v1 (should render SVG!): <span class="iconify" data-icon="mdi:home" data-flip="horizontal" style="color: red; box-shadow: 0 0 2px black;"></span></div>';
// Get items
const items = findPlaceholders(node);
@ -765,7 +765,7 @@ describe('Testing legacy renderer', () => {
it('Rotating icon', () => {
const node = getNode('renderer');
node.innerHTML =
'<div>Testing rotation v1: <span class="iconify-icon" data-icon="mdi:home"></span></div>';
'<div>Testing rotation v1 (should render SVG!): <span class="iconify-icon" data-icon="mdi:home"></span></div>';
// Get items
const items = findPlaceholders(node);
@ -863,7 +863,7 @@ describe('Testing legacy renderer', () => {
it('Changing size', () => {
const node = getNode('renderer');
node.innerHTML =
'<div>Testing size v1: <span class="iconify" data-icon="mdi:home" style="box-shadow: 0 0 2px black;"></span></div>';
'<div>Testing size v1 (should render SVG!): <span class="iconify" data-icon="mdi:home" style="box-shadow: 0 0 2px black;"></span></div>';
// Get items
const items = findPlaceholders(node);
@ -949,7 +949,7 @@ describe('Testing legacy renderer', () => {
it('Changing alignment', () => {
const node = getNode('renderer');
node.innerHTML =
'<div>Testing alignment v1: <span class="iconify" data-icon="mdi:home" data-width="48" data-height="24" style="box-shadow: 0 0 2px black;"></span></div>';
'<div>Testing alignment v1 (should render SVG!): <span class="iconify" data-icon="mdi:home" data-width="48" data-height="24" style="box-shadow: 0 0 2px black;"></span></div>';
// Get items
const items = findPlaceholders(node);

16
packages/browser-tests/tests/20-renderer-v2-test.ts
View File

@ -49,7 +49,7 @@ describe('Testing renderer', () => {
it('Convert placeholders to SVG', () => {
const node = getNode('renderer');
node.innerHTML =
'<div><p>Testing renderer v2</p><ul>' +
'<div><p>Testing renderer v2 (should render SVG!)</p><ul>' +
'<li>Inline icons:<br />' +
' Red icon with red border: <span class="iconify-inline" data-icon="mdi:home" style="color: red; border: 1px solid red;"></span><br />' +
' No vertical-align, green border: <i class="iconify test-icon iconify-inline iconify--mdi-account" data-icon="mdi:account" style="vertical-align: 0;" data-flip="horizontal" aria-hidden="false"></i>' +
@ -370,7 +370,7 @@ describe('Testing renderer', () => {
it('Change attributes', () => {
const node = getNode('renderer');
node.innerHTML =
'<div>Testing attributes v2: <span class="iconify-inline" data-icon="mdi:home" data-flip="horizontal" style="color: red; box-shadow: 0 0 2px black;"></span></div>';
'<div>Testing attributes v2 (should render SVG!): <span class="iconify-inline" data-icon="mdi:home" data-flip="horizontal" style="color: red; box-shadow: 0 0 2px black;"></span></div>';
// Get items
const items = findPlaceholders(node);
@ -584,7 +584,7 @@ describe('Testing renderer', () => {
it('Invalid icon name', () => {
const node = getNode('renderer');
node.innerHTML =
'<div>Testing invalid icon name v2: <span class="iconify-inline" data-icon="mdi:home" data-flip="horizontal" style="color: red; box-shadow: 0 0 2px black;"></span></div>';
'<div>Testing invalid icon name v2 (should render SVG!): <span class="iconify-inline" data-icon="mdi:home" data-flip="horizontal" style="color: red; box-shadow: 0 0 2px black;"></span></div>';
// Get items
const items = findPlaceholders(node);
@ -633,7 +633,7 @@ describe('Testing renderer', () => {
it('Empty icon name', () => {
const node = getNode('renderer');
node.innerHTML =
'<div>Testing empty icon name v2: <span class="iconify" data-icon="mdi:home" data-flip="horizontal" style="color: red; box-shadow: 0 0 2px black;"></span></div>';
'<div>Testing empty icon name v2 (should render SVG!): <span class="iconify" data-icon="mdi:home" data-flip="horizontal" style="color: red; box-shadow: 0 0 2px black;"></span></div>';
// Get items
const items = findPlaceholders(node);
@ -680,7 +680,7 @@ describe('Testing renderer', () => {
it('Change icon name', () => {
const node = getNode('renderer');
node.innerHTML =
'<div>Testing icon name v2: <span class="iconify" data-icon="mdi:home" data-flip="horizontal" style="color: red; box-shadow: 0 0 2px black;"></span></div>';
'<div>Testing icon name v2 (should render SVG!): <span class="iconify" data-icon="mdi:home" data-flip="horizontal" style="color: red; box-shadow: 0 0 2px black;"></span></div>';
// Get items
const items = findPlaceholders(node);
@ -769,7 +769,7 @@ describe('Testing renderer', () => {
it('Rotating icon', () => {
const node = getNode('renderer');
node.innerHTML =
'<div>Testing rotation v2: <span class="iconify-icon" data-icon="mdi:home"></span></div>';
'<div>Testing rotation v2 (should render SVG!): <span class="iconify-icon" data-icon="mdi:home"></span></div>';
// Get items
const items = findPlaceholders(node);
@ -867,7 +867,7 @@ describe('Testing renderer', () => {
it('Changing size', () => {
const node = getNode('renderer');
node.innerHTML =
'<div>Testing size v2: <span class="iconify" data-icon="mdi:home" style="box-shadow: 0 0 2px black;"></span></div>';
'<div>Testing size v2 (should render SVG!): <span class="iconify" data-icon="mdi:home" style="box-shadow: 0 0 2px black;"></span></div>';
// Get items
const items = findPlaceholders(node);
@ -953,7 +953,7 @@ describe('Testing renderer', () => {
it('Changing alignment', () => {
const node = getNode('renderer');
node.innerHTML =
'<div>Testing alignment v2: <span class="iconify" data-icon="mdi:home" data-width="48" data-height="24" style="box-shadow: 0 0 2px black;"></span></div>';
'<div>Testing alignment v2 (should render SVG!): <span class="iconify" data-icon="mdi:home" data-width="48" data-height="24" style="box-shadow: 0 0 2px black;"></span></div>';
// Get items
const items = findPlaceholders(node);

2
packages/browser-tests/tests/20-scan-dom-test.ts
View File

@ -51,7 +51,7 @@ describe('Scanning DOM', () => {
setRoot(node);
node.innerHTML =
'<div><p>Testing scanning DOM</p><ul>' +
'<div><p>Testing scanning DOM (should render SVG!)</p><ul>' +
'<li>Valid icons:' +
' <span class="iconify" data-icon="mdi:home" style="color: red; box-shadow: 0 0 2px black;"></span>' +
' <i class="iconify test-icon iconify--mdi-account" data-icon="mdi:account" style="vertical-align: 0;" data-flip="horizontal" aria-hidden="false"></i>' +

16
packages/browser-tests/tests/21-observe-dom-test.ts
View File

@ -63,7 +63,7 @@ describe('Observe DOM', () => {
// Set HTML
node.innerHTML =
'<p>Testing observing DOM</p>' +
'<p>Testing observing DOM (should render SVG!)</p>' +
'<span class="iconify" data-icon="mdi:home"></span>';
ignoredNode.innerHTML =
'<p>This node should be ignored</p>' +
@ -97,7 +97,7 @@ describe('Observe DOM', () => {
// Set HTML
node.innerHTML =
'<p>Testing observing DOM</p>' +
'<p>Testing observing DOM (should render SVG!)</p>' +
'<span class="iconify" data-icon="mdi:home"></span>';
// Test nodes
@ -153,10 +153,10 @@ describe('Observe DOM', () => {
// Set HTML
baseNode.innerHTML =
'<p>Testing observing 2 nodes (1)</p>' +
'<p>Testing observing 2 nodes (1) (should render SVG!)</p>' +
'<span class="iconify" data-icon="mdi:home"></span>';
node.innerHTML =
'<p>Testing observing 2 nodes (2)</p>' +
'<p>Testing observing 2 nodes (2) (should render SVG!)</p>' +
'<span class="iconify" data-icon="mdi:home"></span>';
// Test nodes
@ -194,10 +194,10 @@ describe('Observe DOM', () => {
// Set HTML
baseNode.innerHTML =
'<p>Testing observing 2 nodes (1)</p>' +
'<p>Testing observing 2 nodes (1) (should render SVG!)</p>' +
'<span class="iconify" data-icon="mdi:home"></span>';
node.innerHTML =
'<p>Testing observing 2 nodes (2)</p>' +
'<p>Testing observing 2 nodes (2) (should render SVG!)</p>' +
'<span class="iconify" data-icon="mdi:home"></span>';
// Observe node: should run scan on next tick
@ -256,10 +256,10 @@ describe('Observe DOM', () => {
// Set HTML
baseNode.innerHTML =
'<p>Testing observing 2 nodes (1)</p>' +
'<p>Testing observing 2 nodes (1) (should NOT render SVG!)</p>' +
'<span class="iconify" data-icon="mdi:home"></span>';
node.innerHTML =
'<p>Testing observing 2 nodes (2)</p>' +
'<p>Testing observing 2 nodes (2) (should render SVG!)</p>' +
'<span class="iconify" data-icon="mdi:home"></span>';
// Test nodes

10
packages/browser-tests/tests/21-scan-dom-api-test.ts
View File

@ -88,7 +88,7 @@ describe('Scanning DOM with API', () => {
const node = getNode('scan-dom');
node.innerHTML =
'<div><p>Testing scanning DOM with API</p><ul>' +
'<div><p>Testing scanning DOM with API (should render SVG!)</p><ul>' +
'<li>Inline icons:' +
' <span class="iconify iconify-inline" data-icon="@' +
provider +
@ -221,7 +221,7 @@ describe('Scanning DOM with API', () => {
const node = getNode('scan-dom');
node.innerHTML =
'<div><p>Testing scanning DOM with API: renamed icon</p><ul>' +
'<div><p>Testing scanning DOM with API: renamed icon (should render SVG!)</p><ul>' +
'<li>Default finder:' +
' <span class="iconify-inline first-icon" data-icon="@' +
provider +
@ -355,8 +355,8 @@ describe('Scanning DOM with API', () => {
const node = getNode('scan-dom');
node.innerHTML =
'<div><p>Testing scanning DOM with API: invalid name</p><ul>' +
'<li>Inline icons:' +
'<div><p>Testing scanning DOM with API: invalid name (should render 3 SVGs!)</p><ul>' +
'<li>Inline icons (2 valid):' +
' <span class="iconify" data-icon="@' +
provider +
':' +
@ -368,7 +368,7 @@ describe('Scanning DOM with API', () => {
prefix2 +
':account" style="vertical-align: 0;" data-flip="horizontal" aria-hidden="false"></i>' +
'</li>' +
'<li>Block icons:' +
'<li>Block icons (1 valid):' +
' <iconify-icon data-icon="@' +
provider +
':' +

2
packages/browser-tests/tests/30-iconify-api-test.ts
View File

@ -19,7 +19,7 @@ const ignoredNode = getNode('iconify-api');
Iconify.observe(observedNode);
observedNode.innerHTML =
'<div><p>Testing Iconify with API</p><ul>' +
'<div><p>Testing Iconify with API (should render SVG!)</p><ul>' +
'<li>Inline icons:' +
' <span class="iconify-inline" data-icon="mdi:home" style="color: red; box-shadow: 0 0 2px black;"></span>' +
' <i class="iconify iconify-inline test-icon iconify--mdi-account" data-icon="mdi:account" style="vertical-align: 0;" data-flip="horizontal" aria-hidden="false"></i>' +

2
packages/browser-tests/tests/30-iconify-basic-test.ts
View File

@ -90,7 +90,7 @@ describe('Testing Iconify object', () => {
it('Rendering icons without API', (done) => {
node1.innerHTML =
'<div><p>Testing Iconify without API</p>' +
'<div><p>Testing Iconify without API (should render SVG!)</p>' +
' <span class="iconify-inline" data-icon="' +
prefix +
':home" style="color: red; box-shadow: 0 0 2px black;"></span>' +

2
packages/browser-tests/tests/30-iconify-without-api-test.ts
View File

@ -80,7 +80,7 @@ describe('Testing Iconify object (without API)', () => {
it('Rendering icons without API', (done) => {
node1.innerHTML =
'<div><p>Testing Iconify without API</p>' +
'<div><p>Testing Iconify without API (should render SVG!)</p>' +
' <span class="iconify-inline" data-icon="' +
prefix +
':home" style="color: red; box-shadow: 0 0 2px black;"></span>' +

9
packages/browser-tests/tests/fake-api.ts
View File

@ -1,4 +1,4 @@
import { RedundancyPendingItem } from '@cyberalien/redundancy';
import { PendingQueryItem } from '@cyberalien/redundancy';
import {
APIQueryParams,
IconifyAPIPrepareQuery,
@ -90,7 +90,7 @@ export const prepareQuery: IconifyAPIPrepareQuery = (
export const sendQuery: IconifyAPISendQuery = (
host: string,
params: APIQueryParams,
status: RedundancyPendingItem
item: PendingQueryItem
): void => {
const provider = params.provider;
const prefix = params.prefix;
@ -101,7 +101,8 @@ export const sendQuery: IconifyAPISendQuery = (
throw new Error('Fake data is missing in query params');
}
if (typeof data.host === 'string' && data.host !== host) {
// Host mismatch - do nothing
// Host mismatch - send error (first parameter = undefined)
item.done();
return;
}
@ -113,7 +114,7 @@ export const sendQuery: IconifyAPISendQuery = (
'", icons:',
icons
);
status.done(data.data);
item.done(data.data);
};
if (!data.delay) {