diff --git a/ShadowEditor.SVG/test/10 AnchorTest.html b/ShadowEditor.SVG/test/10 AnchorTest.html
new file mode 100644
index 00000000..4d70c1b1
--- /dev/null
+++ b/ShadowEditor.SVG/test/10 AnchorTest.html	
@@ -0,0 +1,53 @@
+<!DOCTYPE html>
+
+<html lang="zh-cn">
+
+<head>
+    <meta charset="utf-8">
+    <title>10 AnchorTest</title>
+    <meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
+</head>
+
+<body>
+    <script src="../dist/ShadowEditor.SVG.js"></script>
+    <script>
+        var dom = Shadow.SVG.create({
+            xtype: 'svg',
+            parent: document.body,
+            attr: {
+                width: 140,
+                height: 30,
+            },
+            children: [{
+                xtype: 'a',
+                attr: {
+                    href: 'https://developer.mozilla.org/en-US/docs/SVG',
+                    target: '_blank',
+                },
+                children: [{
+                    xtype: 'rect',
+                    attr: {
+                        x: 0,
+                        y: 0,
+                        width: 120,
+                        height: 30,
+                        rx: 15
+                    }
+                }, {
+                    xtype: 'text',
+                    attr: {
+                        fill: 'white',
+                        'text-anchor': 'middle',
+                        x: 60,
+                        y: 21,
+                    },
+                    html: 'SVG on MDN'
+                }]
+            }]
+        });
+
+        dom.render();
+    </script>
+</body>
+
+</html>
\ No newline at end of file
diff --git a/ShadowEditor.SVG/test/11 GaussianBlurTest.html b/ShadowEditor.SVG/test/11 GaussianBlurTest.html
new file mode 100644
index 00000000..8de8c4b4
--- /dev/null
+++ b/ShadowEditor.SVG/test/11 GaussianBlurTest.html	
@@ -0,0 +1,57 @@
+<!DOCTYPE html>
+
+<html lang="zh-cn">
+
+<head>
+    <meta charset="utf-8">
+    <title>11 GaussianBlurTest</title>
+    <meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
+</head>
+
+<body>
+    <script src="../dist/ShadowEditor.SVG.js"></script>
+    <script>
+        var dom = Shadow.SVG.create({
+            xtype: 'svg',
+            parent: document.body,
+            attr: {
+                width: 230,
+                height: 120,
+            },
+            children: [{
+                xtype: 'filter',
+                attr: {
+                    id: 'blurMe'
+                },
+                children: [{
+                    xtype: 'fegaussianblur',
+                    attr: {
+                        in: 'SourceGraphic',
+                        stdDeviation: 5
+                    }
+                }]
+            }, {
+                xtype: 'circle',
+                attr: {
+                    cx: 60,
+                    cy: 60,
+                    r: 50,
+                    fill: 'green'
+                }
+            }, {
+                xtype: 'circle',
+                attr: {
+                    cx: 170,
+                    cy: 60,
+                    r: 50,
+                    fill: 'green',
+                    filter: 'url(#blurMe)'
+                }
+            }]
+        });
+
+        dom.render();
+    </script>
+</body>
+
+</html>
\ No newline at end of file
diff --git a/ShadowEditor.SVG/test/12 OffsetBlurTest.html b/ShadowEditor.SVG/test/12 OffsetBlurTest.html
new file mode 100644
index 00000000..459f94f1
--- /dev/null
+++ b/ShadowEditor.SVG/test/12 OffsetBlurTest.html	
@@ -0,0 +1,67 @@
+<!DOCTYPE html>
+
+<html lang="zh-cn">
+
+<head>
+    <meta charset="utf-8">
+    <title>12 OffsetBlurTest</title>
+    <meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
+</head>
+
+<body>
+    <script src="../dist/ShadowEditor.SVG.js"></script>
+    <script>
+        var dom = Shadow.SVG.create({
+            xtype: 'svg',
+            parent: document.body,
+            attr: {
+                width: 200,
+                height: 200,
+            },
+            children: [{
+                xtype: 'defs',
+                children: [{
+                    xtype: 'filter',
+                    attr: {
+                        id: 'offset',
+                        width: 180,
+                        height: 180,
+                    },
+                    children: [{
+                        xtype: 'feoffset',
+                        attr: {
+                            in: 'SourceGraphic',
+                            dx: 60,
+                            dy: 60
+                        }
+                    }]
+                }]
+            }, {
+                xtype: 'rect',
+                attr: {
+                    x: 0,
+                    y: 0,
+                    width: 100,
+                    height: 100,
+                    stroke: 'black',
+                    fill: 'green',
+                }
+            }, {
+                xtype: 'rect',
+                attr: {
+                    x: 0,
+                    y: 0,
+                    width: 100,
+                    height: 100,
+                    stroke: 'black',
+                    fill: 'green',
+                    filter: 'url(#offset)'
+                }
+            }]
+        });
+
+        dom.render();
+    </script>
+</body>
+
+</html>
\ No newline at end of file
diff --git a/ShadowEditor.SVG/test2/14 SvgColorMatrixTest.html b/ShadowEditor.SVG/test/13 ColorMatrixTest.html
similarity index 83%
rename from ShadowEditor.SVG/test2/14 SvgColorMatrixTest.html
rename to ShadowEditor.SVG/test/13 ColorMatrixTest.html
index 15afd7d8..6c5a9565 100644
--- a/ShadowEditor.SVG/test2/14 SvgColorMatrixTest.html	
+++ b/ShadowEditor.SVG/test/13 ColorMatrixTest.html	
@@ -4,25 +4,24 @@
 
 <head>
     <meta charset="utf-8">
-    <title>14 SvgColorMatrixTest</title>
+    <title>13 ColorMatrixTest</title>
     <meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
 </head>
 
 <body>
     <script src="../dist/ShadowEditor.SVG.js"></script>
     <script>
-        var dom = UI.create({
-            xtype: 'svgdom',
-            id: 'dom1',
+        var dom = Shadow.SVG.create({
+            xtype: 'svg',
             parent: document.body,
             attr: {
                 width: 800,
                 height: 600,
             },
             children: [{
-                xtype: 'svgdefs',
+                xtype: 'defs',
                 children: [{
-                    xtype: 'svgfilter',
+                    xtype: 'filter',
                     attr: {
                         id: 'filter1',
                         x: 0,
@@ -31,7 +30,7 @@
                         height: '200%'
                     },
                     children: [{
-                        xtype: 'svgfeoffset',
+                        xtype: 'feoffset',
                         attr: {
                             result: 'offOut',
                             in: 'SourceGraphic',
@@ -39,7 +38,7 @@
                             dy: 20
                         }
                     }, {
-                        xtype: 'svgfecolormatrix',
+                        xtype: 'fecolormatrix',
                         attr: {
                             result: 'matrixOut',
                             in: 'offOut',
@@ -47,14 +46,14 @@
                             values: '0.2 0 0 0 0 0 0.2 0 0 0 0 0 0.2 0 0 0 0 0 1 0'
                         }
                     }, {
-                        xtype: 'svgfegaussianblur',
+                        xtype: 'fegaussianblur',
                         attr: {
                             result: 'blurOut',
                             in: 'matrixOut',
                             stdDeviation: 10
                         }
                     }, {
-                        xtype: 'svgfeblend',
+                        xtype: 'feblend',
                         attr: {
                             in: 'SourceGraphic',
                             in2: 'blurOut',
@@ -63,7 +62,7 @@
                     }]
                 }]
             }, {
-                xtype: 'svgrect',
+                xtype: 'rect',
                 attr: {
                     x: 10,
                     y: 10,
diff --git a/ShadowEditor.SVG/test2/15 SvgGroupTest.html b/ShadowEditor.SVG/test/14 GroupTest.html
similarity index 79%
rename from ShadowEditor.SVG/test2/15 SvgGroupTest.html
rename to ShadowEditor.SVG/test/14 GroupTest.html
index c39fe9b5..097601a6 100644
--- a/ShadowEditor.SVG/test2/15 SvgGroupTest.html	
+++ b/ShadowEditor.SVG/test/14 GroupTest.html	
@@ -4,36 +4,37 @@
 
 <head>
     <meta charset="utf-8">
-    <title>15 SvgGroupTest</title>
+    <title>14 GroupTest</title>
     <meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
 </head>
 
 <body>
     <script src="../dist/ShadowEditor.SVG.js"></script>
     <script>
-        var dom = UI.create({
-            xtype: 'svgdom',
-            id: 'dom1',
+        var dom = Shadow.SVG.create({
+            xtype: 'svg',
             parent: document.body,
             attr: {
+                width: 400,
+                height: 400,
                 viewBox: '0 0 100 100'
             },
             children: [{
-                xtype: 'svggroup',
+                xtype: 'g',
                 attr: {
                     fill: 'white',
                     stroke: 'green',
                     strokeWidth: 5
                 },
                 children: [{
-                    xtype: 'svgcircle',
+                    xtype: 'circle',
                     attr: {
                         cx: 40,
                         cy: 40,
                         r: 25
                     }
                 }, {
-                    xtype: 'svgcircle',
+                    xtype: 'circle',
                     attr: {
                         cx: 60,
                         cy: 60,
diff --git a/ShadowEditor.SVG/test2/10 SvgATest.html b/ShadowEditor.SVG/test2/10 SvgATest.html
deleted file mode 100644
index d96d4be3..00000000
--- a/ShadowEditor.SVG/test2/10 SvgATest.html	
+++ /dev/null
@@ -1,45 +0,0 @@
-<!DOCTYPE html>
-
-<html lang="zh-cn">
-
-<head>
-    <meta charset="utf-8">
-    <title>09 SvgTextTest</title>
-    <meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
-</head>
-
-<body>
-    <script src="../dist/ShadowEditor.SVG.js"></script>
-    <script>
-        var dom = UI.create({
-            xtype: 'svgdom',
-            id: 'dom1',
-            parent: document.body,
-            attr: {
-                width: 800,
-                height: 600,
-            },
-            children: [{
-                xtype: 'svga',
-                attr: {
-                    href: 'http://www.baidu.com',
-                    target: '_blank',
-                },
-                children: [{
-                    xtype: 'svgrect',
-                    attr: {
-                        x: 30,
-                        y: 30,
-                        width: 100,
-                        height: 80,
-                        fill: '#f00'
-                    }
-                }]
-            }]
-        });
-
-        dom.render();
-    </script>
-</body>
-
-</html>
\ No newline at end of file
diff --git a/ShadowEditor.SVG/test2/11 SvgPathTest.html b/ShadowEditor.SVG/test2/11 SvgPathTest.html
deleted file mode 100644
index 94ff92a2..00000000
--- a/ShadowEditor.SVG/test2/11 SvgPathTest.html	
+++ /dev/null
@@ -1,64 +0,0 @@
-<!DOCTYPE html>
-
-<html lang="zh-cn">
-
-<head>
-    <meta charset="utf-8">
-    <title>11 SvgPathTest</title>
-    <meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
-</head>
-
-<body>
-    <script src="../dist/ShadowEditor.SVG.js"></script>
-    <script>
-        var dom = UI.create({
-            xtype: 'svgdom',
-            id: 'dom1',
-            parent: document.body,
-            attr: {
-                width: 800,
-                height: 600,
-            },
-            children: [{
-                xtype: 'svgdefs',
-                children: [{
-                    xtype: 'svgpath',
-                    attr: {
-                        id: 'path1',
-                        d: 'M75,20 a1,1 0 0,0 100,0',
-                        fill: 'none'
-                    }
-                }]
-            }, {
-                xtype: 'svguse',
-                attr: {
-                    'xlink:href': '#path1',
-                    stroke: '#f00'
-                }
-            }, {
-                xtype: 'svgtext',
-                attr: {
-                    x: 10,
-                    y: 100,
-                    fill: '#f00'
-                },
-                children: [{
-                    xtype: 'svgtextpath',
-                    html: 'I Love SVG. I Love SVG.',
-                    attr: {
-                        'xlink:href': '#path1'
-                    }
-                }],
-                listeners: {
-                    click: () => {
-                        alert('You clicked!');
-                    }
-                }
-            }]
-        });
-
-        dom.render();
-    </script>
-</body>
-
-</html>
\ No newline at end of file
diff --git a/ShadowEditor.SVG/test2/12 SvgGaussianBlurTest.html b/ShadowEditor.SVG/test2/12 SvgGaussianBlurTest.html
deleted file mode 100644
index 63e086d7..00000000
--- a/ShadowEditor.SVG/test2/12 SvgGaussianBlurTest.html	
+++ /dev/null
@@ -1,56 +0,0 @@
-<!DOCTYPE html>
-
-<html lang="zh-cn">
-
-<head>
-    <meta charset="utf-8">
-    <title>12 SvgGaussianBlurTest</title>
-    <meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
-</head>
-
-<body>
-    <script src="../dist/ShadowEditor.SVG.js"></script>
-    <script>
-        var dom = UI.create({
-            xtype: 'svgdom',
-            id: 'dom1',
-            parent: document.body,
-            attr: {
-                width: 800,
-                height: 600,
-            },
-            children: [{
-                xtype: 'svgdefs',
-                children: [{
-                    xtype: 'svgfilter',
-                    attr: {
-                        id: 'filter1'
-                    },
-                    children: [{
-                        xtype: 'svgfegaussianblur',
-                        attr: {
-                            in: 'SourceGraphic',
-                            stdDeviation: 20
-                        }
-                    }]
-                }]
-            }, {
-                xtype: 'svgrect',
-                attr: {
-                    x: 10,
-                    y: 10,
-                    width: 100,
-                    height: 80,
-                    fill: '#f00',
-                    stroke: '#0f0',
-                    'stroke-width': 2,
-                    filter: 'url(#filter1)'
-                }
-            }]
-        });
-
-        dom.render();
-    </script>
-</body>
-
-</html>
\ No newline at end of file
diff --git a/ShadowEditor.SVG/test2/13 SvgOffsetBlurTest.html b/ShadowEditor.SVG/test2/13 SvgOffsetBlurTest.html
deleted file mode 100644
index 3439993a..00000000
--- a/ShadowEditor.SVG/test2/13 SvgOffsetBlurTest.html	
+++ /dev/null
@@ -1,69 +0,0 @@
-<!DOCTYPE html>
-
-<html lang="zh-cn">
-
-<head>
-    <meta charset="utf-8">
-    <title>13 SvgOffsetBlurTest</title>
-    <meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
-</head>
-
-<body>
-    <script src="../dist/ShadowEditor.SVG.js"></script>
-    <script>
-        var dom = UI.create({
-            xtype: 'svgdom',
-            id: 'dom1',
-            parent: document.body,
-            attr: {
-                width: 800,
-                height: 600,
-            },
-            children: [{
-                xtype: 'svgdefs',
-                children: [{
-                    xtype: 'svgfilter',
-                    attr: {
-                        id: 'filter1',
-                        x: 0,
-                        y: 0,
-                        width: '200%',
-                        height: '200%'
-                    },
-                    children: [{
-                        xtype: 'svgfeoffset',
-                        attr: {
-                            result: 'offOut',
-                            in: 'SourceGraphic',
-                            dx: 20,
-                            dy: 20
-                        }
-                    }, {
-                        xtype: 'svgfeblend',
-                        attr: {
-                            in: 'SourceGraphic',
-                            in2: 'offOut',
-                            mode: 'normal'
-                        }
-                    }]
-                }]
-            }, {
-                xtype: 'svgrect',
-                attr: {
-                    x: 10,
-                    y: 10,
-                    width: 100,
-                    height: 80,
-                    fill: '#f00',
-                    stroke: '#0f0',
-                    'stroke-width': 2,
-                    filter: 'url(#filter1)'
-                }
-            }]
-        });
-
-        dom.render();
-    </script>
-</body>
-
-</html>
\ No newline at end of file
