1 |
|
2 |
|
3 |
|
4 | const K = require('kcore')
|
5 |
|
6 |
|
7 | const JSDOM = require('jsdom').JSDOM
|
8 | const dom = new JSDOM('')
|
9 | const window = dom.window
|
10 | const document = window.document
|
11 |
|
12 | global.window = window
|
13 | global.document = document
|
14 |
|
15 | window.K = K
|
16 |
|
17 | require('../src/KNateSvgStatic')
|
18 | require('../src/KNateAbstractDom')
|
19 | require('../src/KNateSvgDom')
|
20 | require('../src/KNateHtmlDom')
|
21 | require('../src/KNateHtmlStatic')
|
22 | require('should')
|
23 |
|
24 |
|
25 | K.Elem = {
|
26 | isElem: function (o)
|
27 | {
|
28 | if (o.elem) {
|
29 |
|
30 | return false;
|
31 | } else {
|
32 |
|
33 | return true;
|
34 | }
|
35 | },
|
36 |
|
37 | isText: function (o)
|
38 | {
|
39 | return false;
|
40 | }
|
41 | }
|
42 |
|
43 |
|
44 | K.updateProperty = function (o, key, newContent) {
|
45 | if (o[key] != newContent) {
|
46 | o[key] = newContent
|
47 | }
|
48 | }
|
49 |
|
50 | function TestNateSvg(domMode) {
|
51 | let nRoot = null
|
52 | let nSvg = null
|
53 | let title = null
|
54 | let titlePrefix = null
|
55 |
|
56 | if (domMode) {
|
57 |
|
58 | title = 'NateSvgDom'
|
59 | nRoot = K.NateHtmlDom(document.body)
|
60 | titlePrefix = 'DOM: '
|
61 | } else {
|
62 |
|
63 | title = 'NateSvgStatic'
|
64 | titlePrefix = 'Static: '
|
65 | }
|
66 |
|
67 | const _suite = (title, cb) => {
|
68 | suite(titlePrefix + title, cb)
|
69 | }
|
70 |
|
71 | const _reset = () => {
|
72 | if (domMode) {
|
73 |
|
74 | nRoot.deleteAllChildren()
|
75 | nSvg = nRoot.newSvgNate()
|
76 | } else {
|
77 |
|
78 | nSvg = K.NateSvgElem()
|
79 | }
|
80 | }
|
81 |
|
82 | const _verifyResultHtml = (expectedHtml) => {
|
83 | if (domMode) {
|
84 | nSvg.elem.innerHTML.should.be.eql(expectedHtml)
|
85 | } else {
|
86 | nSvg.render().should.be.eql(expectedHtml)
|
87 | }
|
88 | }
|
89 |
|
90 | const _createOneTagTest = (func, expectedHtmlStatic, expectedHtmlDom) => {
|
91 | test(func, () => {
|
92 | _reset()
|
93 | nSvg[func]()
|
94 | if (domMode) {
|
95 |
|
96 | _verifyResultHtml(expectedHtmlDom || expectedHtmlStatic)
|
97 | } else {
|
98 |
|
99 | _verifyResultHtml(expectedHtmlStatic)
|
100 | }
|
101 | })
|
102 | }
|
103 |
|
104 | _suite(title, () => {
|
105 | _suite('Single tags (close-at-once)', () => {
|
106 |
|
107 | _createOneTagTest('newAnimate' , '<animate/>' , '<animate></animate>')
|
108 | _createOneTagTest('newAnimateColor' , '<animateColor/>' , '<animateColor></animateColor>')
|
109 | _createOneTagTest('newAnimateTransform' , '<animateTransform/>' , '<animateTransform></animateTransform>')
|
110 | _createOneTagTest('newCircle' , '<circle/>' , '<circle></circle>')
|
111 | _createOneTagTest('newEllipse' , '<ellipse/>' , '<ellipse></ellipse>')
|
112 | _createOneTagTest('newFeBlend' , '<feBlend/>' , '<feBlend></feBlend>')
|
113 | _createOneTagTest('newFeColorMatrix' , '<feColorMatrix/>' , '<feColorMatrix></feColorMatrix>')
|
114 | _createOneTagTest('newFeComponentTransfer' , '<feComponentTransfer/>' , '<feComponentTransfer></feComponentTransfer>')
|
115 | _createOneTagTest('newFeComposite' , '<feComposite/>' , '<feComposite></feComposite>')
|
116 | _createOneTagTest('newFeConvolveMatrix' , '<feConvolveMatrix/>' , '<feConvolveMatrix></feConvolveMatrix>')
|
117 | _createOneTagTest('newFeDiffuseLighting' , '<feDiffuseLighting/>' , '<feDiffuseLighting></feDiffuseLighting>')
|
118 | _createOneTagTest('newFeDisplacementMap' , '<feDisplacementMap/>' , '<feDisplacementMap></feDisplacementMap>')
|
119 | _createOneTagTest('newFeDistantLight' , '<feDistantLight/>' , '<feDistantLight></feDistantLight>')
|
120 | _createOneTagTest('newFeDropShadow' , '<feDropShadow/>' , '<feDropShadow></feDropShadow>')
|
121 | _createOneTagTest('newFeFlood' , '<feFlood/>' , '<feFlood></feFlood>')
|
122 | _createOneTagTest('newFeFuncA' , '<feFuncA/>' , '<feFuncA></feFuncA>')
|
123 | _createOneTagTest('newFeFuncB' , '<feFuncB/>' , '<feFuncB></feFuncB>')
|
124 | _createOneTagTest('newFeFuncG' , '<feFuncG/>' , '<feFuncG></feFuncG>')
|
125 | _createOneTagTest('newFeFuncR' , '<feFuncR/>' , '<feFuncR></feFuncR>')
|
126 | _createOneTagTest('newFeGaussianBlur' , '<feGaussianBlur/>' , '<feGaussianBlur></feGaussianBlur>')
|
127 | _createOneTagTest('newFeImage' , '<feImage/>' , '<feImage></feImage>')
|
128 | _createOneTagTest('newFeMerge' , '<feMerge/>' , '<feMerge></feMerge>')
|
129 | _createOneTagTest('newFeMergeNode' , '<feMergeNode/>' , '<feMergeNode></feMergeNode>')
|
130 | _createOneTagTest('newFeMorphology' , '<feMorphology/>' , '<feMorphology></feMorphology>')
|
131 | _createOneTagTest('newFeOffset' , '<feOffset/>' , '<feOffset></feOffset>')
|
132 | _createOneTagTest('newFePointLight' , '<fePointLight/>' , '<fePointLight></fePointLight>')
|
133 | _createOneTagTest('newFeSpecularLighting' , '<feSpecularLighting/>' , '<feSpecularLighting></feSpecularLighting>')
|
134 | _createOneTagTest('newFeSpotLight' , '<feSpotLight/>' , '<feSpotLight></feSpotLight>')
|
135 | _createOneTagTest('newFeTile' , '<feTile/>' , '<feTile></feTile>')
|
136 | _createOneTagTest('newFeTurbulence' , '<feTurbulence/>' , '<feTurbulence></feTurbulence>')
|
137 | _createOneTagTest('newHatchpath' , '<hatchpath/>' , '<hatchpath></hatchpath>')
|
138 | _createOneTagTest('newImage' , '<image/>' , '<image></image>')
|
139 | _createOneTagTest('newLine' , '<line/>' , '<line></line>')
|
140 | _createOneTagTest('newPath' , '<path/>' , '<path></path>')
|
141 | _createOneTagTest('newPolygon' , '<polygon/>' , '<polygon></polygon>')
|
142 | _createOneTagTest('newPolyline' , '<polyline/>' , '<polyline></polyline>')
|
143 | _createOneTagTest('newRect' , '<rect/>' , '<rect></rect>')
|
144 | _createOneTagTest('newSolidcolor' , '<solidcolor/>' , '<solidcolor></solidcolor>')
|
145 | _createOneTagTest('newStop' , '<stop/>' , '<stop></stop>')
|
146 | _createOneTagTest('newUse' , '<use/>' , '<use></use>')
|
147 | _createOneTagTest('newView' , '<view/>' , '<view></view>')
|
148 | })
|
149 |
|
150 | _suite('Single tags', () => {
|
151 |
|
152 | _createOneTagTest('newA' , '<a></a>')
|
153 | _createOneTagTest('newAnimateMotion' , '<animateMotion></animateMotion>')
|
154 | _createOneTagTest('newClipPath' , '<clipPath></clipPath>')
|
155 | _createOneTagTest('newColor-profile' , '<color-profile></color-profile>')
|
156 | _createOneTagTest('newDefs' , '<defs></defs>')
|
157 | _createOneTagTest('newDesc' , '<desc></desc>')
|
158 | _createOneTagTest('newDiscard' , '<discard></discard>')
|
159 | _createOneTagTest('newFilter' , '<filter></filter>')
|
160 | _createOneTagTest('newForeignObject' , '<foreignObject></foreignObject>')
|
161 | _createOneTagTest('newG' , '<g></g>')
|
162 | _createOneTagTest('newHatch' , '<hatch></hatch>')
|
163 | _createOneTagTest('newLinearGradient' , '<linearGradient></linearGradient>')
|
164 | _createOneTagTest('newMarker' , '<marker></marker>')
|
165 | _createOneTagTest('newMask' , '<mask></mask>')
|
166 | _createOneTagTest('newMesh' , '<mesh></mesh>')
|
167 | _createOneTagTest('newMeshgradient' , '<meshgradient></meshgradient>')
|
168 | _createOneTagTest('newMeshpatch' , '<meshpatch></meshpatch>')
|
169 | _createOneTagTest('newMeshrow' , '<meshrow></meshrow>')
|
170 | _createOneTagTest('newMetadata' , '<metadata></metadata>')
|
171 | _createOneTagTest('newMpath' , '<mpath></mpath>')
|
172 | _createOneTagTest('newPattern' , '<pattern></pattern>')
|
173 | _createOneTagTest('newRadialGradient' , '<radialGradient></radialGradient>')
|
174 | _createOneTagTest('newScript' , '<script></script>')
|
175 | _createOneTagTest('newSet' , '<set></set>')
|
176 | _createOneTagTest('newStyle' , '<style></style>')
|
177 | _createOneTagTest('newSvg' , '<svg></svg>')
|
178 | _createOneTagTest('newSwitch' , '<switch></switch>')
|
179 | _createOneTagTest('newSymbol' , '<symbol></symbol>')
|
180 | _createOneTagTest('newText' , '<text></text>')
|
181 | _createOneTagTest('newTextPath' , '<textPath></textPath>')
|
182 | _createOneTagTest('newTitle' , '<title></title>')
|
183 | _createOneTagTest('newTspan' , '<tspan></tspan>')
|
184 | })
|
185 |
|
186 | _suite('single attributes', () => {
|
187 | const _createOneAttributeTest = (holderTagName, key, value, expectedHtml) => {
|
188 | test(key, () => {
|
189 | _reset()
|
190 | nSvg.newNate(holderTagName).set(key, value)
|
191 | _verifyResultHtml(expectedHtml)
|
192 | })
|
193 | }
|
194 |
|
195 | _createOneAttributeTest('g', 'id' , 'test-id-value' , '<g id="test-id-value"></g>')
|
196 | _createOneAttributeTest('g', 'lang' , 'test-lang-value' , '<g lang="test-lang-value"></g>')
|
197 | _createOneAttributeTest('g', 'tabindex' , 'test-tabindex-value' , '<g tabindex="test-tabindex-value"></g>')
|
198 | _createOneAttributeTest('g', 'xml:base' , 'test-xml:base-value' , '<g xml:base="test-xml:base-value"></g>')
|
199 | _createOneAttributeTest('g', 'xml:lang' , 'test-xml:lang-value' , '<g xml:lang="test-xml:lang-value"></g>')
|
200 | _createOneAttributeTest('g', 'xml:space' , 'test-xml:space-value' , '<g xml:space="test-xml:space-value"></g>')
|
201 | _createOneAttributeTest('g', 'class' , 'test-class-value' , '<g class="test-class-value"></g>')
|
202 | _createOneAttributeTest('g', 'style' , 'test-style-value' , '<g style="test-style-value"></g>')
|
203 | _createOneAttributeTest('g', 'externalResourcesRequired' , 'test-externalResourcesRequired-value' , '<g externalResourcesRequired="test-externalResourcesRequired-value"></g>')
|
204 | _createOneAttributeTest('g', 'requiredExtensions' , 'test-requiredExtensions-value' , '<g requiredExtensions="test-requiredExtensions-value"></g>')
|
205 | _createOneAttributeTest('g', 'requiredFeatures' , 'test-requiredFeatures-value' , '<g requiredFeatures="test-requiredFeatures-value"></g>')
|
206 | _createOneAttributeTest('g', 'systemLanguage' , 'test-systemLanguage-value' , '<g systemLanguage="test-systemLanguage-value"></g>')
|
207 |
|
208 | _createOneAttributeTest('g', 'alignment-baselin' , 'test-alignment-baselin-value' , '<g alignment-baselin="test-alignment-baselin-value"></g>')
|
209 | _createOneAttributeTest('g', 'baseline-shift' , 'test-baseline-shift-value' , '<g baseline-shift="test-baseline-shift-value"></g>')
|
210 | _createOneAttributeTest('g', 'clip' , 'test-clip-value' , '<g clip="test-clip-value"></g>')
|
211 | _createOneAttributeTest('g', 'clip-path' , 'test-clip-path-value' , '<g clip-path="test-clip-path-value"></g>')
|
212 | _createOneAttributeTest('g', 'clip-rule' , 'test-clip-rule-value' , '<g clip-rule="test-clip-rule-value"></g>')
|
213 | _createOneAttributeTest('g', 'color' , 'test-color-value' , '<g color="test-color-value"></g>')
|
214 | _createOneAttributeTest('g', 'color-interpolation' , 'test-color-interpolation-value' , '<g color-interpolation="test-color-interpolation-value"></g>')
|
215 | _createOneAttributeTest('g', 'color-interpolation-filters' , 'test-color-interpolation-filters-value' , '<g color-interpolation-filters="test-color-interpolation-filters-value"></g>')
|
216 | _createOneAttributeTest('g', 'color-profile' , 'test-color-profile-value' , '<g color-profile="test-color-profile-value"></g>')
|
217 | _createOneAttributeTest('g', 'color-rendering' , 'test-color-rendering-value' , '<g color-rendering="test-color-rendering-value"></g>')
|
218 | _createOneAttributeTest('g', 'cursor' , 'test-cursor-value' , '<g cursor="test-cursor-value"></g>')
|
219 | _createOneAttributeTest('g', 'direction' , 'test-direction-value' , '<g direction="test-direction-value"></g>')
|
220 | _createOneAttributeTest('g', 'display' , 'test-display-value' , '<g display="test-display-value"></g>')
|
221 | _createOneAttributeTest('g', 'dominant-baseline' , 'test-dominant-baseline-value' , '<g dominant-baseline="test-dominant-baseline-value"></g>')
|
222 | _createOneAttributeTest('g', 'enable-background' , 'test-enable-background-value' , '<g enable-background="test-enable-background-value"></g>')
|
223 | _createOneAttributeTest('g', 'fill' , 'test-fill-value' , '<g fill="test-fill-value"></g>')
|
224 | _createOneAttributeTest('g', 'fill-opacity' , 'test-fill-opacity-value' , '<g fill-opacity="test-fill-opacity-value"></g>')
|
225 | _createOneAttributeTest('g', 'fill-rule' , 'test-fill-rule-value' , '<g fill-rule="test-fill-rule-value"></g>')
|
226 | _createOneAttributeTest('g', 'filter' , 'test-filter-value' , '<g filter="test-filter-value"></g>')
|
227 | _createOneAttributeTest('g', 'flood-color' , 'test-flood-color-value' , '<g flood-color="test-flood-color-value"></g>')
|
228 | _createOneAttributeTest('g', 'flood-opacity' , 'test-flood-opacity-value' , '<g flood-opacity="test-flood-opacity-value"></g>')
|
229 | _createOneAttributeTest('g', 'font-family' , 'test-font-family-value' , '<g font-family="test-font-family-value"></g>')
|
230 | _createOneAttributeTest('g', 'font-size' , 'test-font-size-value' , '<g font-size="test-font-size-value"></g>')
|
231 | _createOneAttributeTest('g', 'font-size-adjust' , 'test-font-size-adjust-value' , '<g font-size-adjust="test-font-size-adjust-value"></g>')
|
232 | _createOneAttributeTest('g', 'font-stretch' , 'test-font-stretch-value' , '<g font-stretch="test-font-stretch-value"></g>')
|
233 | _createOneAttributeTest('g', 'font-style' , 'test-font-style-value' , '<g font-style="test-font-style-value"></g>')
|
234 | _createOneAttributeTest('g', 'font-variant' , 'test-font-variant-value' , '<g font-variant="test-font-variant-value"></g>')
|
235 | _createOneAttributeTest('g', 'font-weight' , 'test-font-weight-value' , '<g font-weight="test-font-weight-value"></g>')
|
236 | _createOneAttributeTest('g', 'glyph-orientation-horizontal' , 'test-glyph-orientation-horizontal-value' , '<g glyph-orientation-horizontal="test-glyph-orientation-horizontal-value"></g>')
|
237 | _createOneAttributeTest('g', 'glyph-orientation-vertical' , 'test-glyph-orientation-vertical-value' , '<g glyph-orientation-vertical="test-glyph-orientation-vertical-value"></g>')
|
238 | _createOneAttributeTest('g', 'image-rendering' , 'test-image-rendering-value' , '<g image-rendering="test-image-rendering-value"></g>')
|
239 | _createOneAttributeTest('g', 'kerning' , 'test-kerning-value' , '<g kerning="test-kerning-value"></g>')
|
240 | _createOneAttributeTest('g', 'letter-spacing' , 'test-letter-spacing-value' , '<g letter-spacing="test-letter-spacing-value"></g>')
|
241 | _createOneAttributeTest('g', 'lighting-color' , 'test-lighting-color-value' , '<g lighting-color="test-lighting-color-value"></g>')
|
242 | _createOneAttributeTest('g', 'marker-end' , 'test-marker-end-value' , '<g marker-end="test-marker-end-value"></g>')
|
243 | _createOneAttributeTest('g', 'marker-mid' , 'test-marker-mid-value' , '<g marker-mid="test-marker-mid-value"></g>')
|
244 | _createOneAttributeTest('g', 'marker-start' , 'test-marker-start-value' , '<g marker-start="test-marker-start-value"></g>')
|
245 | _createOneAttributeTest('g', 'mask' , 'test-mask-value' , '<g mask="test-mask-value"></g>')
|
246 | _createOneAttributeTest('g', 'opacity' , 'test-opacity-value' , '<g opacity="test-opacity-value"></g>')
|
247 | _createOneAttributeTest('g', 'overflow' , 'test-overflow-value' , '<g overflow="test-overflow-value"></g>')
|
248 | _createOneAttributeTest('g', 'pointer-events' , 'test-pointer-events-value' , '<g pointer-events="test-pointer-events-value"></g>')
|
249 | _createOneAttributeTest('g', 'shape-rendering' , 'test-shape-rendering-value' , '<g shape-rendering="test-shape-rendering-value"></g>')
|
250 | _createOneAttributeTest('g', 'stop-color' , 'test-stop-color-value' , '<g stop-color="test-stop-color-value"></g>')
|
251 | _createOneAttributeTest('g', 'stop-opacity' , 'test-stop-opacity-value' , '<g stop-opacity="test-stop-opacity-value"></g>')
|
252 | _createOneAttributeTest('g', 'stroke' , 'test-stroke-value' , '<g stroke="test-stroke-value"></g>')
|
253 | _createOneAttributeTest('g', 'stroke-dasharray' , 'test-stroke-dasharray-value' , '<g stroke-dasharray="test-stroke-dasharray-value"></g>')
|
254 | _createOneAttributeTest('g', 'stroke-dashoffset' , 'test-stroke-dashoffset-value' , '<g stroke-dashoffset="test-stroke-dashoffset-value"></g>')
|
255 | _createOneAttributeTest('g', 'stroke-linecap' , 'test-stroke-linecap-value' , '<g stroke-linecap="test-stroke-linecap-value"></g>')
|
256 | _createOneAttributeTest('g', 'stroke-linejoin' , 'test-stroke-linejoin-value' , '<g stroke-linejoin="test-stroke-linejoin-value"></g>')
|
257 | _createOneAttributeTest('g', 'stroke-miterlimit' , 'test-stroke-miterlimit-value' , '<g stroke-miterlimit="test-stroke-miterlimit-value"></g>')
|
258 | _createOneAttributeTest('g', 'stroke-opacity' , 'test-stroke-opacity-value' , '<g stroke-opacity="test-stroke-opacity-value"></g>')
|
259 | _createOneAttributeTest('g', 'stroke-width' , 'test-stroke-width-value' , '<g stroke-width="test-stroke-width-value"></g>')
|
260 | _createOneAttributeTest('g', 'text-anchor' , 'test-text-anchor-value' , '<g text-anchor="test-text-anchor-value"></g>')
|
261 | _createOneAttributeTest('g', 'transform' , 'test-transform-value' , '<g transform="test-transform-value"></g>')
|
262 | _createOneAttributeTest('g', 'text-decoration' , 'test-text-decoration-value' , '<g text-decoration="test-text-decoration-value"></g>')
|
263 | _createOneAttributeTest('g', 'text-rendering' , 'test-text-rendering-value' , '<g text-rendering="test-text-rendering-value"></g>')
|
264 | _createOneAttributeTest('g', 'unicode-bidi' , 'test-unicode-bidi-value' , '<g unicode-bidi="test-unicode-bidi-value"></g>')
|
265 | _createOneAttributeTest('g', 'vector-effect' , 'test-vector-effect-value' , '<g vector-effect="test-vector-effect-value"></g>')
|
266 | _createOneAttributeTest('g', 'visibility' , 'test-visibility-value' , '<g visibility="test-visibility-value"></g>')
|
267 | _createOneAttributeTest('g', 'word-spacing' , 'test-word-spacing-value' , '<g word-spacing="test-word-spacing-value"></g>')
|
268 | _createOneAttributeTest('g', 'writing-mode' , 'test-writing-mode-value' , '<g writing-mode="test-writing-mode-value"></g>')
|
269 | _createOneAttributeTest('g', 'height' , 'test-height-value' , '<g height="test-height-value"></g>')
|
270 | _createOneAttributeTest('g', 'result' , 'test-result-value' , '<g result="test-result-value"></g>')
|
271 | _createOneAttributeTest('g', 'width' , 'test-width-value' , '<g width="test-width-value"></g>')
|
272 | _createOneAttributeTest('g', 'x' , 'test-x-value' , '<g x="test-x-value"></g>')
|
273 | _createOneAttributeTest('g', 'y' , 'test-y-value' , '<g y="test-y-value"></g>')
|
274 | _createOneAttributeTest('g', 'type' , 'test-type-value' , '<g type="test-type-value"></g>')
|
275 | _createOneAttributeTest('g', 'tableValues' , 'test-tableValues-value' , '<g tableValues="test-tableValues-value"></g>')
|
276 | _createOneAttributeTest('g', 'slope' , 'test-slope-value' , '<g slope="test-slope-value"></g>')
|
277 | _createOneAttributeTest('g', 'intercept' , 'test-intercept-value' , '<g intercept="test-intercept-value"></g>')
|
278 | _createOneAttributeTest('g', 'amplitude' , 'test-amplitude-value' , '<g amplitude="test-amplitude-value"></g>')
|
279 | _createOneAttributeTest('g', 'exponent' , 'test-exponent-value' , '<g exponent="test-exponent-value"></g>')
|
280 | _createOneAttributeTest('g', 'offset' , 'test-offset-value' , '<g offset="test-offset-value"></g>')
|
281 | _createOneAttributeTest('g', 'attributeType' , 'test-attributeType-value' , '<g attributeType="test-attributeType-value"></g>')
|
282 | _createOneAttributeTest('g', 'attributeName' , 'test-attributeName-value' , '<g attributeName="test-attributeName-value"></g>')
|
283 | _createOneAttributeTest('g', 'begin' , 'test-begin-value' , '<g begin="test-begin-value"></g>')
|
284 | _createOneAttributeTest('g', 'dur' , 'test-dur-value' , '<g dur="test-dur-value"></g>')
|
285 | _createOneAttributeTest('g', 'end' , 'test-end-value' , '<g end="test-end-value"></g>')
|
286 | _createOneAttributeTest('g', 'min' , 'test-min-value' , '<g min="test-min-value"></g>')
|
287 | _createOneAttributeTest('g', 'max' , 'test-max-value' , '<g max="test-max-value"></g>')
|
288 | _createOneAttributeTest('g', 'restart' , 'test-restart-value' , '<g restart="test-restart-value"></g>')
|
289 | _createOneAttributeTest('g', 'repeatCount' , 'test-repeatCount-value' , '<g repeatCount="test-repeatCount-value"></g>')
|
290 | _createOneAttributeTest('g', 'repeatDur' , 'test-repeatDur-value' , '<g repeatDur="test-repeatDur-value"></g>')
|
291 | _createOneAttributeTest('g', 'fill' , 'test-fill-value' , '<g fill="test-fill-value"></g>')
|
292 | _createOneAttributeTest('g', 'calcMode' , 'test-calcMode-value' , '<g calcMode="test-calcMode-value"></g>')
|
293 | _createOneAttributeTest('g', 'values' , 'test-values-value' , '<g values="test-values-value"></g>')
|
294 | _createOneAttributeTest('g', 'keyTimes' , 'test-keyTimes-value' , '<g keyTimes="test-keyTimes-value"></g>')
|
295 | _createOneAttributeTest('g', 'keySplines' , 'test-keySplines-value' , '<g keySplines="test-keySplines-value"></g>')
|
296 | _createOneAttributeTest('g', 'from' , 'test-from-value' , '<g from="test-from-value"></g>')
|
297 | _createOneAttributeTest('g', 'to' , 'test-to-value' , '<g to="test-to-value"></g>')
|
298 | _createOneAttributeTest('g', 'by' , 'test-by-value' , '<g by="test-by-value"></g>')
|
299 | _createOneAttributeTest('g', 'autoReverse' , 'test-autoReverse-value' , '<g autoReverse="test-autoReverse-value"></g>')
|
300 | _createOneAttributeTest('g', 'accelerate' , 'test-accelerate-value' , '<g accelerate="test-accelerate-value"></g>')
|
301 | _createOneAttributeTest('g', 'decelerate' , 'test-decelerate-value' , '<g decelerate="test-decelerate-value"></g>')
|
302 | _createOneAttributeTest('g', 'additive' , 'test-additive-value' , '<g additive="test-additive-value"></g>')
|
303 | _createOneAttributeTest('g', 'accumulate' , 'test-accumulate-value' , '<g accumulate="test-accumulate-value"></g>')
|
304 | _createOneAttributeTest('g', 'onbegin' , 'test-onbegin-value' , '<g onbegin="test-onbegin-value"></g>')
|
305 | _createOneAttributeTest('g', 'onend' , 'test-onend-value' , '<g onend="test-onend-value"></g>')
|
306 | _createOneAttributeTest('g', 'onrepeat' , 'test-onrepeat-value' , '<g onrepeat="test-onrepeat-value"></g>')
|
307 | _createOneAttributeTest('g', 'onabort' , 'test-onabort-value' , '<g onabort="test-onabort-value"></g>')
|
308 | _createOneAttributeTest('g', 'onerror' , 'test-onerror-value' , '<g onerror="test-onerror-value"></g>')
|
309 | _createOneAttributeTest('g', 'onresize' , 'test-onresize-value' , '<g onresize="test-onresize-value"></g>')
|
310 | _createOneAttributeTest('g', 'onscroll' , 'test-onscroll-value' , '<g onscroll="test-onscroll-value"></g>')
|
311 | _createOneAttributeTest('g', 'onunload' , 'test-onunload-value' , '<g onunload="test-onunload-value"></g>')
|
312 | _createOneAttributeTest('g', 'oncancel' , 'test-oncancel-value' , '<g oncancel="test-oncancel-value"></g>')
|
313 | _createOneAttributeTest('g', 'oncanplay' , 'test-oncanplay-value' , '<g oncanplay="test-oncanplay-value"></g>')
|
314 | _createOneAttributeTest('g', 'oncanplaythrough' , 'test-oncanplaythrough-value' , '<g oncanplaythrough="test-oncanplaythrough-value"></g>')
|
315 | _createOneAttributeTest('g', 'onchange' , 'test-onchange-value' , '<g onchange="test-onchange-value"></g>')
|
316 | _createOneAttributeTest('g', 'onclick' , 'test-onclick-value' , '<g onclick="test-onclick-value"></g>')
|
317 | _createOneAttributeTest('g', 'onclose' , 'test-onclose-value' , '<g onclose="test-onclose-value"></g>')
|
318 | _createOneAttributeTest('g', 'oncuechange' , 'test-oncuechange-value' , '<g oncuechange="test-oncuechange-value"></g>')
|
319 | _createOneAttributeTest('g', 'ondblclick' , 'test-ondblclick-value' , '<g ondblclick="test-ondblclick-value"></g>')
|
320 | _createOneAttributeTest('g', 'ondrag' , 'test-ondrag-value' , '<g ondrag="test-ondrag-value"></g>')
|
321 | _createOneAttributeTest('g', 'ondragend' , 'test-ondragend-value' , '<g ondragend="test-ondragend-value"></g>')
|
322 | _createOneAttributeTest('g', 'ondragenter' , 'test-ondragenter-value' , '<g ondragenter="test-ondragenter-value"></g>')
|
323 | _createOneAttributeTest('g', 'ondragexit' , 'test-ondragexit-value' , '<g ondragexit="test-ondragexit-value"></g>')
|
324 | _createOneAttributeTest('g', 'ondragleave' , 'test-ondragleave-value' , '<g ondragleave="test-ondragleave-value"></g>')
|
325 | _createOneAttributeTest('g', 'ondragover' , 'test-ondragover-value' , '<g ondragover="test-ondragover-value"></g>')
|
326 | _createOneAttributeTest('g', 'ondragstart' , 'test-ondragstart-value' , '<g ondragstart="test-ondragstart-value"></g>')
|
327 | _createOneAttributeTest('g', 'ondrop' , 'test-ondrop-value' , '<g ondrop="test-ondrop-value"></g>')
|
328 | _createOneAttributeTest('g', 'ondurationchange' , 'test-ondurationchange-value' , '<g ondurationchange="test-ondurationchange-value"></g>')
|
329 | _createOneAttributeTest('g', 'onemptied' , 'test-onemptied-value' , '<g onemptied="test-onemptied-value"></g>')
|
330 | _createOneAttributeTest('g', 'onended' , 'test-onended-value' , '<g onended="test-onended-value"></g>')
|
331 | _createOneAttributeTest('g', 'onerror' , 'test-onerror-value' , '<g onerror="test-onerror-value"></g>')
|
332 | _createOneAttributeTest('g', 'onfocus' , 'test-onfocus-value' , '<g onfocus="test-onfocus-value"></g>')
|
333 | _createOneAttributeTest('g', 'oninput' , 'test-oninput-value' , '<g oninput="test-oninput-value"></g>')
|
334 | _createOneAttributeTest('g', 'oninvalid' , 'test-oninvalid-value' , '<g oninvalid="test-oninvalid-value"></g>')
|
335 | _createOneAttributeTest('g', 'onkeydown' , 'test-onkeydown-value' , '<g onkeydown="test-onkeydown-value"></g>')
|
336 | _createOneAttributeTest('g', 'onkeypress' , 'test-onkeypress-value' , '<g onkeypress="test-onkeypress-value"></g>')
|
337 | _createOneAttributeTest('g', 'onkeyup' , 'test-onkeyup-value' , '<g onkeyup="test-onkeyup-value"></g>')
|
338 | _createOneAttributeTest('g', 'onload' , 'test-onload-value' , '<g onload="test-onload-value"></g>')
|
339 | _createOneAttributeTest('g', 'onloadeddata' , 'test-onloadeddata-value' , '<g onloadeddata="test-onloadeddata-value"></g>')
|
340 | _createOneAttributeTest('g', 'onloadedmetadata' , 'test-onloadedmetadata-value' , '<g onloadedmetadata="test-onloadedmetadata-value"></g>')
|
341 | _createOneAttributeTest('g', 'onloadstart' , 'test-onloadstart-value' , '<g onloadstart="test-onloadstart-value"></g>')
|
342 | _createOneAttributeTest('g', 'onmousedown' , 'test-onmousedown-value' , '<g onmousedown="test-onmousedown-value"></g>')
|
343 | _createOneAttributeTest('g', 'onmouseenter' , 'test-onmouseenter-value' , '<g onmouseenter="test-onmouseenter-value"></g>')
|
344 | _createOneAttributeTest('g', 'onmouseleave' , 'test-onmouseleave-value' , '<g onmouseleave="test-onmouseleave-value"></g>')
|
345 | _createOneAttributeTest('g', 'onmousemove' , 'test-onmousemove-value' , '<g onmousemove="test-onmousemove-value"></g>')
|
346 | _createOneAttributeTest('g', 'onmouseout' , 'test-onmouseout-value' , '<g onmouseout="test-onmouseout-value"></g>')
|
347 | _createOneAttributeTest('g', 'onmouseover' , 'test-onmouseover-value' , '<g onmouseover="test-onmouseover-value"></g>')
|
348 | _createOneAttributeTest('g', 'onmouseup' , 'test-onmouseup-value' , '<g onmouseup="test-onmouseup-value"></g>')
|
349 | _createOneAttributeTest('g', 'onmousewheel' , 'test-onmousewheel-value' , '<g onmousewheel="test-onmousewheel-value"></g>')
|
350 | _createOneAttributeTest('g', 'onpause' , 'test-onpause-value' , '<g onpause="test-onpause-value"></g>')
|
351 | _createOneAttributeTest('g', 'onplay' , 'test-onplay-value' , '<g onplay="test-onplay-value"></g>')
|
352 | _createOneAttributeTest('g', 'onplaying' , 'test-onplaying-value' , '<g onplaying="test-onplaying-value"></g>')
|
353 | _createOneAttributeTest('g', 'onprogress' , 'test-onprogress-value' , '<g onprogress="test-onprogress-value"></g>')
|
354 | _createOneAttributeTest('g', 'onratechange' , 'test-onratechange-value' , '<g onratechange="test-onratechange-value"></g>')
|
355 | _createOneAttributeTest('g', 'onreset' , 'test-onreset-value' , '<g onreset="test-onreset-value"></g>')
|
356 | _createOneAttributeTest('g', 'onresize' , 'test-onresize-value' , '<g onresize="test-onresize-value"></g>')
|
357 | _createOneAttributeTest('g', 'onscroll' , 'test-onscroll-value' , '<g onscroll="test-onscroll-value"></g>')
|
358 | _createOneAttributeTest('g', 'onseeked' , 'test-onseeked-value' , '<g onseeked="test-onseeked-value"></g>')
|
359 | _createOneAttributeTest('g', 'onseeking' , 'test-onseeking-value' , '<g onseeking="test-onseeking-value"></g>')
|
360 | _createOneAttributeTest('g', 'onselect' , 'test-onselect-value' , '<g onselect="test-onselect-value"></g>')
|
361 | _createOneAttributeTest('g', 'onshow' , 'test-onshow-value' , '<g onshow="test-onshow-value"></g>')
|
362 | _createOneAttributeTest('g', 'onstalled' , 'test-onstalled-value' , '<g onstalled="test-onstalled-value"></g>')
|
363 | _createOneAttributeTest('g', 'onsubmit' , 'test-onsubmit-value' , '<g onsubmit="test-onsubmit-value"></g>')
|
364 | _createOneAttributeTest('g', 'onsuspend' , 'test-onsuspend-value' , '<g onsuspend="test-onsuspend-value"></g>')
|
365 | _createOneAttributeTest('g', 'ontimeupdate' , 'test-ontimeupdate-value' , '<g ontimeupdate="test-ontimeupdate-value"></g>')
|
366 | _createOneAttributeTest('g', 'ontoggle' , 'test-ontoggle-value' , '<g ontoggle="test-ontoggle-value"></g>')
|
367 | _createOneAttributeTest('g', 'onvolumechange' , 'test-onvolumechange-value' , '<g onvolumechange="test-onvolumechange-value"></g>')
|
368 | _createOneAttributeTest('g', 'onwaiting' , 'test-onwaiting-value' , '<g onwaiting="test-onwaiting-value"></g>')
|
369 | _createOneAttributeTest('g', 'onactivate' , 'test-onactivate-value' , '<g onactivate="test-onactivate-value"></g>')
|
370 | _createOneAttributeTest('g', 'onfocusin' , 'test-onfocusin-value' , '<g onfocusin="test-onfocusin-value"></g>')
|
371 | _createOneAttributeTest('g', 'onfocusout' , 'test-onfocusout-value' , '<g onfocusout="test-onfocusout-value"></g>')
|
372 | _createOneAttributeTest('g', 'cx' , 'test-cx-value' , '<g cx="test-cx-value"></g>')
|
373 | _createOneAttributeTest('g', 'cy' , 'test-cy-value' , '<g cy="test-cy-value"></g>')
|
374 | _createOneAttributeTest('g', 'd' , 'test-d-value' , '<g d="test-d-value"></g>')
|
375 | _createOneAttributeTest('g', 'dx' , 'test-dx-value' , '<g dx="test-dx-value"></g>')
|
376 | _createOneAttributeTest('g', 'dy' , 'test-dy-value' , '<g dy="test-dy-value"></g>')
|
377 | _createOneAttributeTest('g', 'fr' , 'test-fr-value' , '<g fr="test-fr-value"></g>')
|
378 | _createOneAttributeTest('g', 'fx' , 'test-fx-value' , '<g fx="test-fx-value"></g>')
|
379 | _createOneAttributeTest('g', 'fy' , 'test-fy-value' , '<g fy="test-fy-value"></g>')
|
380 | _createOneAttributeTest('g', 'g1' , 'test-g1-value' , '<g g1="test-g1-value"></g>')
|
381 | _createOneAttributeTest('g', 'g2' , 'test-g2-value' , '<g g2="test-g2-value"></g>')
|
382 | _createOneAttributeTest('g', 'in' , 'test-in-value' , '<g in="test-in-value"></g>')
|
383 | _createOneAttributeTest('g', 'in2' , 'test-in2-value' , '<g in2="test-in2-value"></g>')
|
384 | _createOneAttributeTest('g', 'k' , 'test-k-value' , '<g k="test-k-value"></g>')
|
385 | _createOneAttributeTest('g', 'k1' , 'test-k1-value' , '<g k1="test-k1-value"></g>')
|
386 | _createOneAttributeTest('g', 'k2' , 'test-k2-value' , '<g k2="test-k2-value"></g>')
|
387 | _createOneAttributeTest('g', 'k3' , 'test-k3-value' , '<g k3="test-k3-value"></g>')
|
388 | _createOneAttributeTest('g', 'k3' , 'test-k3-value' , '<g k3="test-k3-value"></g>')
|
389 | _createOneAttributeTest('g', 'k4' , 'test-k4-value' , '<g k4="test-k4-value"></g>')
|
390 | _createOneAttributeTest('g', 'points' , 'test-points-value' , '<g points="test-points-value"></g>')
|
391 | _createOneAttributeTest('g', 'r' , 'test-r-value' , '<g r="test-r-value"></g>')
|
392 | _createOneAttributeTest('g', 'refX' , 'test-refX-value' , '<g refX="test-refX-value"></g>')
|
393 | _createOneAttributeTest('g', 'refY' , 'test-refY-value' , '<g refY="test-refY-value"></g>')
|
394 | _createOneAttributeTest('g', 'rx' , 'test-rx-value' , '<g rx="test-rx-value"></g>')
|
395 | _createOneAttributeTest('g', 'ry' , 'test-ry-value' , '<g ry="test-ry-value"></g>')
|
396 | _createOneAttributeTest('g', 'targetX' , 'test-targetX-value' , '<g targetX="test-targetX-value"></g>')
|
397 | _createOneAttributeTest('g', 'targetY' , 'test-targetY-value' , '<g targetY="test-targetY-value"></g>')
|
398 | _createOneAttributeTest('g', 'u1' , 'test-u1-value' , '<g u1="test-u1-value"></g>')
|
399 | _createOneAttributeTest('g', 'u2' , 'test-u2-value' , '<g u2="test-u2-value"></g>')
|
400 | _createOneAttributeTest('g', 'x' , 'test-x-value' , '<g x="test-x-value"></g>')
|
401 | _createOneAttributeTest('g', 'x1' , 'test-x1-value' , '<g x1="test-x1-value"></g>')
|
402 | _createOneAttributeTest('g', 'x2' , 'test-x2-value' , '<g x2="test-x2-value"></g>')
|
403 | _createOneAttributeTest('g', 'y' , 'test-y-value' , '<g y="test-y-value"></g>')
|
404 | _createOneAttributeTest('g', 'y1' , 'test-y1-value' , '<g y1="test-y1-value"></g>')
|
405 | _createOneAttributeTest('g', 'y2' , 'test-y2-value' , '<g y2="test-y2-value"></g>')
|
406 | _createOneAttributeTest('g', 'z' , 'test-z-value' , '<g z="test-z-value"></g>')
|
407 |
|
408 | _createOneAttributeTest('g', 'xlink:type' , 'test-xlink:type-value' , '<g xlink:type="test-xlink:type-value"></g>')
|
409 | _createOneAttributeTest('g', 'xlink:role' , 'test-xlink:role-value' , '<g xlink:role="test-xlink:role-value"></g>')
|
410 | _createOneAttributeTest('g', 'xlink:arcrole' , 'test-xlink:arcrole-value' , '<g xlink:arcrole="test-xlink:arcrole-value"></g>')
|
411 | _createOneAttributeTest('g', 'xlink:title' , 'test-xlink:title-value' , '<g xlink:title="test-xlink:title-value"></g>')
|
412 | _createOneAttributeTest('g', 'xlink:show' , 'test-xlink:show-value' , '<g xlink:show="test-xlink:show-value"></g>')
|
413 | _createOneAttributeTest('g', 'xlink:actuate' , 'test-xlink:actuate-value' , '<g xlink:actuate="test-xlink:actuate-value"></g>')
|
414 |
|
415 |
|
416 |
|
417 |
|
418 |
|
419 |
|
420 |
|
421 | _createOneAttributeTest('g', 'href' , 'test-xlink:href-value' , '<g href="test-xlink:href-value"></g>')
|
422 | _createOneAttributeTest('g', 'xlink:href' , 'test-xlink:href-value' , '<g href="test-xlink:href-value"></g>')
|
423 | })
|
424 |
|
425 | test('Special property: textContent', () => {
|
426 | _reset()
|
427 | const nText = nSvg.newText()
|
428 |
|
429 |
|
430 | nText.set('textContent', 'this is some pure text content')
|
431 | _verifyResultHtml('<text>this is some pure text content</text>')
|
432 |
|
433 |
|
434 | nText.set('textContent', 'this is SVG escaped content: <>&\'"')
|
435 | _verifyResultHtml('<text>this is SVG escaped content: <>&\'"</text>')
|
436 | })
|
437 |
|
438 | test('Special property: innerHTML', () => {
|
439 |
|
440 |
|
441 |
|
442 | _reset()
|
443 | const nText = nSvg.newText()
|
444 |
|
445 |
|
446 | nText.set('innerHTML', 'this is some pure text content')
|
447 | _verifyResultHtml('<text>this is some pure text content</text>')
|
448 |
|
449 |
|
450 | nText.set('innerHTML', 'this is HTML content: <b class="test-class">TEST1 & TEST2</b>')
|
451 | _verifyResultHtml('<text>this is HTML content: <b class="test-class">TEST1 & TEST2</b></text>')
|
452 |
|
453 |
|
454 | nText.set('innerHTML', 'line1\nline2')
|
455 | _verifyResultHtml('<text>line1\nline2</text>')
|
456 |
|
457 |
|
458 |
|
459 | let nateError = null
|
460 | try {
|
461 | nText.newText()
|
462 | } catch (_nateError) {
|
463 | nateError = _nateError
|
464 | }
|
465 | nateError.getErrorCode().should.be.eql('nateChildNotAllowed')
|
466 |
|
467 |
|
468 | _verifyResultHtml('<text>line1\nline2</text>')
|
469 | })
|
470 |
|
471 | test('Create nate child when direct content exists (should fail)', () => {
|
472 |
|
473 | _reset()
|
474 | const nText = nSvg.newText().set('innerHTML', 'test-html-content')
|
475 |
|
476 |
|
477 |
|
478 | let nateError = null
|
479 | try {
|
480 | nText.newText()
|
481 | } catch (_nateError) {
|
482 | nateError = _nateError
|
483 | }
|
484 | nateError.getErrorCode().should.be.eql('nateChildNotAllowed')
|
485 |
|
486 |
|
487 | nText.set('innerHTML', null)
|
488 | nText.newText()
|
489 | })
|
490 |
|
491 | test('Set content directly when nate children exists (should fail)', () => {
|
492 | _reset()
|
493 |
|
494 | const nText = nSvg.newText()
|
495 | nText.newText()
|
496 |
|
497 |
|
498 | let nateError = null
|
499 | try {
|
500 | nText.set('innerHTML', 'test-html-content')
|
501 | } catch (_nateError) {
|
502 | nateError = _nateError
|
503 | }
|
504 | nateError.getErrorCode().should.be.eql('nateChildrenAlreadyExists')
|
505 |
|
506 |
|
507 |
|
508 | nText.deleteAllChildren()
|
509 | nText.set('innerHTML', 'test-html-content')
|
510 | _verifyResultHtml('<text>test-html-content</text>')
|
511 | })
|
512 |
|
513 | test('simple SVG', () =>
|
514 | {
|
515 | const nSvg = new K.NateSvgDocument();
|
516 | nSvg.set('width', 100).set('height', 100);
|
517 | nSvg.newCircle().set('cx', 50).set('cy', 50).set('r', 20).set('fill', 'green');
|
518 | const svgAsText = nSvg.render();
|
519 | svgAsText.should.be.eql('<svg version="1.1" baseProfile="full" width="100" height="100" xmlns="http://www.w3.org/2000/svg"><circle cx="50" cy="50" r="20" fill="green"/></svg>');
|
520 | });
|
521 |
|
522 | test('linear gradient', () =>
|
523 | {
|
524 | const nSvg = new K.NateSvgDocument();
|
525 | const pathL_leftGradient = nSvg.newLinearGradient({id:'l_leftGradient', x1:'0%', y1:'0%', x2:'0%', y2:'100%'});
|
526 | pathL_leftGradient.newStop({offset:'50%', 'stop-color':'#f00'});
|
527 | pathL_leftGradient.newStop({offset:'100%', 'stop-color':'#0f0'});
|
528 | const svgAsText = nSvg.render();
|
529 | svgAsText.should.be.eql('<svg version="1.1" baseProfile="full" width="300" height="200" xmlns="http://www.w3.org/2000/svg"><linearGradient id="l_leftGradient" x1="0%" y1="0%" x2="0%" y2="100%"><stop offset="50%" stop-color="#f00"/><stop offset="100%" stop-color="#0f0"/></linearGradient></svg>');
|
530 | });
|
531 | })
|
532 | }
|
533 |
|
534 | TestNateSvg(false)
|
535 | TestNateSvg(true)
|