diff --git a/packages/browser-tests/tests/10-finder-iconify-test.ts b/packages/browser-tests/tests/10-finder-iconify-test.ts
index 67e122a..8c3d1ac 100644
--- a/packages/browser-tests/tests/10-finder-iconify-test.ts
+++ b/packages/browser-tests/tests/10-finder-iconify-test.ts
@@ -4,7 +4,7 @@ import chai from 'chai';
import { getNode } from './node';
import { finder } from '@iconify/iconify/lib/finders/iconify';
import { IconifyElement } from '@iconify/iconify/lib/modules/element';
-import { IconifyIconCustomisations } from '@iconify/core/lib/customisations';
+import { IconifyIconCustomisations } from '@iconify/utils/lib/customisations';
const expect = chai.expect;
diff --git a/packages/browser-tests/tests/10-finder-v1-test.ts b/packages/browser-tests/tests/10-finder-v1-test.ts
index 806d05d..6098fa7 100644
--- a/packages/browser-tests/tests/10-finder-v1-test.ts
+++ b/packages/browser-tests/tests/10-finder-v1-test.ts
@@ -9,7 +9,7 @@ import {
import { IconifyFinder } from '@iconify/iconify/lib/finders/interface';
import { finder as iconifyFinder } from '@iconify/iconify/lib/finders/iconify-v1';
import { finder as iconifyIconFinder } from '@iconify/iconify/lib/finders/iconify-v1-icon';
-import { IconifyIconName } from '@iconify/core/lib/icon/name';
+import { IconifyIconName } from '@iconify/utils/lib/icon/name';
const expect = chai.expect;
diff --git a/packages/browser-tests/tests/10-finder-v2-test.ts b/packages/browser-tests/tests/10-finder-v2-test.ts
index e6e66a5..3198ffa 100644
--- a/packages/browser-tests/tests/10-finder-v2-test.ts
+++ b/packages/browser-tests/tests/10-finder-v2-test.ts
@@ -9,7 +9,7 @@ import {
import { IconifyFinder } from '@iconify/iconify/lib/finders/interface';
import { finder as iconifyFinder } from '@iconify/iconify/lib/finders/iconify';
import { finder as iconifyIconFinder } from '@iconify/iconify/lib/finders/iconify-icon';
-import { IconifyIconName } from '@iconify/core/lib/icon/name';
+import { IconifyIconName } from '@iconify/utils/lib/icon/name';
const expect = chai.expect;
diff --git a/packages/browser-tests/tests/20-renderer-v1-test.ts b/packages/browser-tests/tests/20-renderer-v1-test.ts
index 57bb52b..ec99586 100644
--- a/packages/browser-tests/tests/20-renderer-v1-test.ts
+++ b/packages/browser-tests/tests/20-renderer-v1-test.ts
@@ -14,7 +14,7 @@ import {
getIcon,
} from '@iconify/core/lib/storage/storage';
import { renderIcon } from '@iconify/iconify/lib/modules/render';
-import { stringToIcon } from '@iconify/core/lib/icon/name';
+import { stringToIcon } from '@iconify/utils/lib/icon/name';
import { IconifyElement } from '@iconify/iconify/lib/modules/element';
const expect = chai.expect;
@@ -30,20 +30,16 @@ describe('Testing legacy renderer', () => {
prefix: 'mdi',
icons: {
'account-box': {
- body:
- '',
+ body: '',
},
'account-cash': {
- body:
- '',
+ body: '',
},
'account': {
- body:
- '',
+ body: '',
},
'home': {
- body:
- '',
+ body: '',
},
},
width: 24,
diff --git a/packages/browser-tests/tests/20-renderer-v2-test.ts b/packages/browser-tests/tests/20-renderer-v2-test.ts
index d37bbb1..6f06862 100644
--- a/packages/browser-tests/tests/20-renderer-v2-test.ts
+++ b/packages/browser-tests/tests/20-renderer-v2-test.ts
@@ -14,7 +14,7 @@ import {
getIcon,
} from '@iconify/core/lib/storage/storage';
import { renderIcon } from '@iconify/iconify/lib/modules/render';
-import { stringToIcon } from '@iconify/core/lib/icon/name';
+import { stringToIcon } from '@iconify/utils/lib/icon/name';
import { IconifyElement } from '@iconify/iconify/lib/modules/element';
const expect = chai.expect;
@@ -30,20 +30,16 @@ describe('Testing renderer', () => {
prefix: 'mdi',
icons: {
'account-box': {
- body:
- '',
+ body: '',
},
'account-cash': {
- body:
- '',
+ body: '',
},
'account': {
- body:
- '',
+ body: '',
},
'home': {
- body:
- '',
+ body: '',
},
},
width: 24,
diff --git a/packages/browser-tests/tests/30-iconify-api-test.ts b/packages/browser-tests/tests/30-iconify-api-test.ts
index 0d40301..e84c2c6 100644
--- a/packages/browser-tests/tests/30-iconify-api-test.ts
+++ b/packages/browser-tests/tests/30-iconify-api-test.ts
@@ -10,7 +10,7 @@ const selector =
'span.iconify, i.iconify, span.iconify-inline, i.iconify-inline';
// Do not observe document.body!
-Iconify.stopObserving(document.body);
+Iconify.stopObserving(document.documentElement);
// Create node to observe
const observedNode = getNode('iconify-api');
diff --git a/packages/browser-tests/tests/30-iconify-basic-test.ts b/packages/browser-tests/tests/30-iconify-basic-test.ts
index c59c7a6..99a48a3 100644
--- a/packages/browser-tests/tests/30-iconify-basic-test.ts
+++ b/packages/browser-tests/tests/30-iconify-basic-test.ts
@@ -13,7 +13,7 @@ const node1 = getNode('iconify-basic');
const node2 = getNode('iconify-basic');
// Do not observe document.body!
-Iconify.stopObserving(document.body);
+Iconify.stopObserving(document.documentElement);
// Set root node
Iconify.observe(node1);
@@ -26,20 +26,16 @@ describe('Testing Iconify object', () => {
prefix,
icons: {
'account-box': {
- body:
- '',
+ body: '',
},
'account-cash': {
- body:
- '',
+ body: '',
},
'account': {
- body:
- '',
+ body: '',
},
'home': {
- body:
- '',
+ body: '',
},
},
width: 24,
@@ -48,8 +44,7 @@ describe('Testing Iconify object', () => {
// Add one icon separately
Iconify.addIcon(prefix + ':id-test', {
- body:
- '',
+ body: '',
width: 128,
height: 128,
});
diff --git a/packages/browser-tests/tests/30-iconify-without-api-test.ts b/packages/browser-tests/tests/30-iconify-without-api-test.ts
index da0bf05..86e0ae7 100644
--- a/packages/browser-tests/tests/30-iconify-without-api-test.ts
+++ b/packages/browser-tests/tests/30-iconify-without-api-test.ts
@@ -13,7 +13,7 @@ const node1 = getNode('iconify-basic');
const node2 = getNode('iconify-basic');
// Do not observe document.body!
-Iconify.stopObserving(document.body);
+Iconify.stopObserving(document.documentElement);
// Set root node
Iconify.observe(node1);
@@ -26,20 +26,16 @@ describe('Testing Iconify object (without API)', () => {
prefix,
icons: {
'account-box': {
- body:
- '',
+ body: '',
},
'account-cash': {
- body:
- '',
+ body: '',
},
'account': {
- body:
- '',
+ body: '',
},
'home': {
- body:
- '',
+ body: '',
},
},
width: 24,
@@ -48,8 +44,7 @@ describe('Testing Iconify object (without API)', () => {
// Add one icon separately
Iconify.addIcon(prefix + ':id-test', {
- body:
- '',
+ body: '',
width: 128,
height: 128,
});
diff --git a/packages/iconify/demo/swap-body.html b/packages/iconify/demo/swap-body.html
new file mode 100644
index 0000000..5cc7f0c
--- /dev/null
+++ b/packages/iconify/demo/swap-body.html
@@ -0,0 +1,47 @@
+
+
+
+
+
+ Iconify Demo: Usage
+
+
+
+
+ This is a simple HTML page with few icons.
+
+ Icon that behaves like an image:
+
+
+
+
+
+
diff --git a/packages/iconify/src/modules/root.ts b/packages/iconify/src/modules/root.ts
index f0e2b74..2e7b104 100644
--- a/packages/iconify/src/modules/root.ts
+++ b/packages/iconify/src/modules/root.ts
@@ -48,12 +48,12 @@ export function addRootNode(
* Add document.body node
*/
export function addBodyNode(): ObservedNode {
- if (document.body) {
- return addRootNode(document.body);
+ if (document.documentElement) {
+ return addRootNode(document.documentElement);
}
nodes.push({
node: () => {
- return document.body;
+ return document.documentElement;
},
});
}