Skip to content

Commit 09013bb

Browse files
committed
Update Sling.js to version 20.2.0
* Update Sling.js to version 20.2.0. * Add wiki page for SVG elements. * Update directives for SVG elements. * Add test cases to automated test suite.
1 parent 2c0f1d8 commit 09013bb

File tree

9 files changed

+596
-290
lines changed

9 files changed

+596
-290
lines changed

dist_sling/sling.es5.js

Lines changed: 231 additions & 231 deletions
Large diffs are not rendered by default.

dist_sling/sling.min.es5.js

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

dist_sling/sling.min.js

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

dist_sling/sling.min.nomodule.js

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

dist_sling/sling.slim.min.js

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

src/globalTests.js

Lines changed: 24 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -21,7 +21,7 @@ class TestSvgComponent1 {
2121
children: [
2222
markup("svg", {
2323
attrs: {
24-
slNs: 'http://www.w3.org/2000/svg',
24+
slns: 'http://www.w3.org/2000/svg',
2525
version: "1.1",
2626
class: "logo",
2727
"baseProfile": "tiny",
@@ -35,7 +35,7 @@ class TestSvgComponent1 {
3535
children: [
3636
markup("path", {
3737
attrs: {
38-
slNs: 'http://www.w3.org/2000/svg',
38+
slns: 'http://www.w3.org/2000/svg',
3939
fill: "#FFFFFF",
4040
stroke: "#000000",
4141
"stroke-width": "10",
@@ -45,13 +45,13 @@ class TestSvgComponent1 {
4545
}),
4646
markup("g", {
4747
attrs: {
48-
slNs: 'http://www.w3.org/2000/svg',
48+
slns: 'http://www.w3.org/2000/svg',
4949

5050
},
5151
children: [
5252
markup("path", {
5353
attrs: {
54-
slNs: 'http://www.w3.org/2000/svg',
54+
slns: 'http://www.w3.org/2000/svg',
5555
fill: "#fff",
5656
d:
5757
"M250.4,0.8C112.7,0.8,1,112.4,1,250.2c0,137.7,111.7,249.4,249.4,249.4c137.7,0,249.4-111.7,249.4-249.4 C499.8,112.4,388.1,0.8,250.4,0.8z M383.8,326.3c-62,0-101.4-14.1-117.6-46.3c-17.1-34.1-2.3-75.4,13.2-104.1 c-22.4,3-38.4,9.2-47.8,18.3c-11.2,10.9-13.6,26.7-16.3,45c-3.1,20.8-6.6,44.4-25.3,62.4c-19.8,19.1-51.6,26.9-100.2,24.6l1.8-39.7 c35.9,1.6,59.7-2.9,70.8-13.6c8.9-8.6,11.1-22.9,13.5-39.6c6.3-42,14.8-99.4,141.4-99.4h41L333,166c-12.6,16-45.4,68.2-31.2,96.2 c9.2,18.3,41.5,25.6,91.2,24.2l1.1,39.8C390.5,326.2,387.1,326.3,383.8,326.3z"
@@ -70,7 +70,7 @@ class TestSvgComponent1 {
7070
children: [
7171
markup("svg", {
7272
attrs: {
73-
slNs: 'http://www.w3.org/2000/svg',
73+
slns: 'http://www.w3.org/2000/svg',
7474
class: "waves",
7575
xmlns: "http://www.w3.org/2000/svg",
7676
"xmlns:xlink": "http://www.w3.org/1999/xlink",
@@ -82,12 +82,12 @@ class TestSvgComponent1 {
8282
children: [
8383
markup("defs", {
8484
attrs: {
85-
slNs: 'http://www.w3.org/2000/svg'
85+
slns: 'http://www.w3.org/2000/svg'
8686
},
8787
children: [
8888
markup("path", {
8989
attrs: {
90-
slNs: 'http://www.w3.org/2000/svg',
90+
slns: 'http://www.w3.org/2000/svg',
9191
id: "gentle-wave",
9292
d:
9393
"M-160 44c30 0 58-18 88-18s 58 18 88 18 58-18 88-18 58 18 88 18 v44h-352z"
@@ -97,15 +97,15 @@ class TestSvgComponent1 {
9797
}),
9898
markup("g", {
9999
attrs: {
100-
slNs: 'http://www.w3.org/2000/svg',
100+
slns: 'http://www.w3.org/2000/svg',
101101
class: "parallax",
102102
id: 'g-use-1'
103103
},
104104
children: [
105105
markup("use", {
106106
attrs: {
107-
slNs: 'http://www.w3.org/2000/svg',
108-
slNsFor: '{ "xlink:href": { "namespace": "http://www.w3.org/1999/xlink", "value": "#gentle-wave" } }',
107+
slns: 'http://www.w3.org/2000/svg',
108+
slnsfor: '{ "xlink:href": { "namespace": "http://www.w3.org/1999/xlink", "value": "#gentle-wave" } }',
109109
x: "48",
110110
y: "0",
111111
fill: "rgba(255,255,255,0.7)",
@@ -114,26 +114,26 @@ class TestSvgComponent1 {
114114
}),
115115
markup("use", {
116116
attrs: {
117-
slNs: 'http://www.w3.org/2000/svg',
118-
slNsFor: '{ "xlink:href": { "namespace": "http://www.w3.org/1999/xlink", "value": "#gentle-wave" } }',
117+
slns: 'http://www.w3.org/2000/svg',
118+
slnsfor: '{ "xlink:href": { "namespace": "http://www.w3.org/1999/xlink", "value": "#gentle-wave" } }',
119119
x: "48",
120120
y: "3",
121121
fill: "rgba(255,255,255,0.5)"
122122
}
123123
}),
124124
markup("use", {
125125
attrs: {
126-
slNs: 'http://www.w3.org/2000/svg',
127-
slNsFor: '{ "xlink:href": { "namespace": "http://www.w3.org/1999/xlink", "value": "#gentle-wave" } }',
126+
slns: 'http://www.w3.org/2000/svg',
127+
slnsfor: '{ "xlink:href": { "namespace": "http://www.w3.org/1999/xlink", "value": "#gentle-wave" } }',
128128
x: "48",
129129
y: "5",
130130
fill: "rgba(255,255,255,0.3)"
131131
}
132132
}),
133133
markup("use", {
134134
attrs: {
135-
slNs: 'http://www.w3.org/2000/svg',
136-
slNsFor: '{ "xlink:href": { "namespace": "http://www.w3.org/1999/xlink", "value": "#gentle-wave" } }',
135+
slns: 'http://www.w3.org/2000/svg',
136+
slnsfor: '{ "xlink:href": { "namespace": "http://www.w3.org/1999/xlink", "value": "#gentle-wave" } }',
137137
x: "48",
138138
y: "7",
139139
fill: "#fff"
@@ -9556,7 +9556,7 @@ export class GlobalTestRunner {
95569556

95579557
window.globalTestResults.push(result);
95589558
window.globalTestCount++;
9559-
}, 1000);
9559+
}, 1500);
95609560
}
95619561

95629562
testFinalize100SlStyleReapply() {
@@ -15082,7 +15082,7 @@ export class GlobalTestRunner {
1508215082
message: ''
1508315083
};
1508415084

15085-
mount('divsvgtest1', new TestSvgComponent1(), false);
15085+
mount('divsvgtest1', new TestSvgComponent1());
1508615086
const ele1 = document.getElementById('svg-test-1');
1508715087
const n1 = ele1.namespaceURI === 'http://www.w3.org/2000/svg';
1508815088

@@ -15094,8 +15094,13 @@ export class GlobalTestRunner {
1509415094
const bbox = ele3.getBBox();
1509515095

1509615096
const isNotZeroSize = bbox.height * bbox.width;
15097+
const contains1 = document.contains(ele3);
15098+
15099+
detectChanges();
15100+
15101+
const contains2 = document.contains(ele3);
1509715102

15098-
result.success = n1 && attr1 && !isNaN(isNotZeroSize) && (isNotZeroSize > 0);
15103+
result.success = n1 && attr1 && !isNaN(isNotZeroSize) && (isNotZeroSize > 0) && contains1 && contains2;
1509915104

1510015105
window.globalTestResults.push(result);
1510115106
window.globalTestCount++;

src/sling/core/sling.js

Lines changed: 19 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -173,8 +173,8 @@ const clearDataForStructuralDirectives = (domNode) => {
173173
export function renderElementWithoutClass(tagName, attrs, children) {
174174
let el;
175175

176-
if (attrs && attrs.slNs) {
177-
el = document.createElementNS(attrs.slNs, tagName.toLowerCase());
176+
if (attrs && attrs.slns) {
177+
el = document.createElementNS(attrs.slns, tagName.toLowerCase());
178178
} else {
179179
el = document.createElement(tagName);
180180
}
@@ -193,8 +193,8 @@ export function renderElementWithoutClass(tagName, attrs, children) {
193193
proxyEventForChangeDetection(k, el);
194194
}
195195
}
196-
else if (k === 'slNsFor') {
197-
const keyPairs = JSON.parse(attrs.slNsFor);
196+
else if (k === 'slnsfor') {
197+
const keyPairs = JSON.parse(attrs.slnsfor);
198198

199199
for (const [key, value] of Object.entries(keyPairs)) {
200200
el.setAttributeNS(
@@ -217,8 +217,8 @@ export function renderElementWithoutClass(tagName, attrs, children) {
217217
export function renderElement({ tagName, attrs, children }, isDetached = false) {
218218
let el;
219219

220-
if (attrs && attrs.slNs) {
221-
el = document.createElementNS(attrs.slNs, tagName.toLowerCase());
220+
if (attrs && attrs.slns) {
221+
el = document.createElementNS(attrs.slns, tagName.toLowerCase());
222222
} else {
223223
el = document.createElement(tagName);
224224
}
@@ -235,8 +235,8 @@ export function renderElement({ tagName, attrs, children }, isDetached = false)
235235
proxyEventForChangeDetection(k, el);
236236
}
237237
}
238-
else if (k === 'slNsFor') {
239-
const keyPairs = JSON.parse(attrs.slNsFor);
238+
else if (k === 'slnsfor') {
239+
const keyPairs = JSON.parse(attrs.slnsfor);
240240

241241
for (const [key, value] of Object.entries(keyPairs)) {
242242
el.setAttributeNS(
@@ -273,8 +273,8 @@ export function renderElement({ tagName, attrs, children }, isDetached = false)
273273
const renderElementInternal = ({ tagName, attrs, children }) => {
274274
let el;
275275

276-
if (attrs && attrs.slNs) {
277-
el = document.createElementNS(attrs.slNs, tagName.toLowerCase());
276+
if (attrs && attrs.slns) {
277+
el = document.createElementNS(attrs.slns, tagName.toLowerCase());
278278
} else {
279279
el = document.createElement(tagName);
280280
}
@@ -291,8 +291,8 @@ const renderElementInternal = ({ tagName, attrs, children }) => {
291291
proxyEventForChangeDetection(k, el);
292292
}
293293
}
294-
else if (k === 'slNsFor') {
295-
const keyPairs = JSON.parse(attrs.slNsFor);
294+
else if (k === 'slnsfor') {
295+
const keyPairs = JSON.parse(attrs.slnsfor);
296296

297297
for (const [key, value] of Object.entries(keyPairs)) {
298298
el.setAttributeNS(
@@ -527,8 +527,8 @@ const diffVAttrs = (node, oldAttrs, newAttrs) => {
527527
proxyEventForChangeDetection(k, node);
528528
}
529529
}
530-
else if (k === 'slNsFor') {
531-
const keyPairs = JSON.parse(newAttrs.slNsFor);
530+
else if (k === 'slnsfor') {
531+
const keyPairs = JSON.parse(newAttrs.slnsfor);
532532

533533
for (const [key, value] of Object.entries(keyPairs)) {
534534
node.setAttributeNS(
@@ -899,12 +899,13 @@ const diffVDom = (vOldNode, vNewNode, viewModel = null) => {
899899
}
900900

901901
// Tag mismatch
902-
if (vOldNode && vOldNode.tagName !== vNewNode.tagName) {
902+
if (vOldNode &&
903+
(vOldNode.tagName || '').toLowerCase() !== ((vNewNode ? vNewNode.tagName : undefined) || '').toLowerCase()) {
903904
if (vNewNode.tagName) {
904905
let el;
905906

906-
if (vNewNode.attrs && vNewNode.attrs.slNs) {
907-
el = document.createElementNS(vNewNode.attrs.slNs, vNewNode.tagName.toLowerCase());
907+
if (vNewNode.attrs && vNewNode.attrs.slns) {
908+
el = document.createElementNS(vNewNode.attrs.slns, vNewNode.tagName.toLowerCase());
908909
} else {
909910
el = document.createElement(vNewNode.tagName);
910911
}
@@ -1114,7 +1115,7 @@ const _mountInternal = (target, component, attachDetector) => {
11141115
}
11151116

11161117
export function version() {
1117-
return '20.1.0';
1118+
return '20.2.0';
11181119
}
11191120

11201121
function xmur3(str) {

src/sling/core/sling.slim.js

Lines changed: 19 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -172,8 +172,8 @@ const clearDataForStructuralDirectives = (domNode) => {
172172
export function renderElementWithoutClass(tagName, attrs, children) {
173173
let el;
174174

175-
if (attrs && attrs.slNs) {
176-
el = document.createElementNS(attrs.slNs, tagName.toLowerCase());
175+
if (attrs && attrs.slns) {
176+
el = document.createElementNS(attrs.slns, tagName.toLowerCase());
177177
} else {
178178
el = document.createElement(tagName);
179179
}
@@ -192,8 +192,8 @@ export function renderElementWithoutClass(tagName, attrs, children) {
192192
proxyEventForChangeDetection(k, el);
193193
}
194194
}
195-
else if (k === 'slNsFor') {
196-
const keyPairs = JSON.parse(attrs.slNsFor);
195+
else if (k === 'slnsfor') {
196+
const keyPairs = JSON.parse(attrs.slnsfor);
197197

198198
for (const [key, value] of Object.entries(keyPairs)) {
199199
el.setAttributeNS(
@@ -216,8 +216,8 @@ export function renderElementWithoutClass(tagName, attrs, children) {
216216
export function renderElement({ tagName, attrs, children }, isDetached = false) {
217217
let el;
218218

219-
if (attrs && attrs.slNs) {
220-
el = document.createElementNS(attrs.slNs, tagName.toLowerCase());
219+
if (attrs && attrs.slns) {
220+
el = document.createElementNS(attrs.slns, tagName.toLowerCase());
221221
} else {
222222
el = document.createElement(tagName);
223223
}
@@ -234,8 +234,8 @@ export function renderElement({ tagName, attrs, children }, isDetached = false)
234234
proxyEventForChangeDetection(k, el);
235235
}
236236
}
237-
else if (k === 'slNsFor') {
238-
const keyPairs = JSON.parse(attrs.slNsFor);
237+
else if (k === 'slnsfor') {
238+
const keyPairs = JSON.parse(attrs.slnsfor);
239239

240240
for (const [key, value] of Object.entries(keyPairs)) {
241241
el.setAttributeNS(
@@ -272,8 +272,8 @@ export function renderElement({ tagName, attrs, children }, isDetached = false)
272272
const renderElementInternal = ({ tagName, attrs, children }) => {
273273
let el;
274274

275-
if (attrs && attrs.slNs) {
276-
el = document.createElementNS(attrs.slNs, tagName.toLowerCase());
275+
if (attrs && attrs.slns) {
276+
el = document.createElementNS(attrs.slns, tagName.toLowerCase());
277277
} else {
278278
el = document.createElement(tagName);
279279
}
@@ -290,8 +290,8 @@ const renderElementInternal = ({ tagName, attrs, children }) => {
290290
proxyEventForChangeDetection(k, el);
291291
}
292292
}
293-
else if (k === 'slNsFor') {
294-
const keyPairs = JSON.parse(attrs.slNsFor);
293+
else if (k === 'slnsfor') {
294+
const keyPairs = JSON.parse(attrs.slnsfor);
295295

296296
for (const [key, value] of Object.entries(keyPairs)) {
297297
el.setAttributeNS(
@@ -508,8 +508,8 @@ const diffVAttrs = (node, oldAttrs, newAttrs) => {
508508
proxyEventForChangeDetection(k, node);
509509
}
510510
}
511-
else if (k === 'slNsFor') {
512-
const keyPairs = JSON.parse(newAttrs.slNsFor);
511+
else if (k === 'slnsfor') {
512+
const keyPairs = JSON.parse(newAttrs.slnsfor);
513513

514514
for (const [key, value] of Object.entries(keyPairs)) {
515515
node.setAttributeNS(
@@ -845,12 +845,13 @@ const diffVDom = (vOldNode, vNewNode, viewModel = null) => {
845845
}
846846

847847
// Tag mismatch
848-
if (vOldNode && vOldNode.tagName !== vNewNode.tagName) {
848+
if (vOldNode &&
849+
(vOldNode.tagName || '').toLowerCase() !== ((vNewNode ? vNewNode.tagName : undefined) || '').toLowerCase()) {
849850
if (vNewNode.tagName) {
850851
let el;
851852

852-
if (vNewNode.attrs && vNewNode.attrs.slNs) {
853-
el = document.createElementNS(vNewNode.attrs.slNs, vNewNode.tagName.toLowerCase());
853+
if (vNewNode.attrs && vNewNode.attrs.slns) {
854+
el = document.createElementNS(vNewNode.attrs.slns, vNewNode.tagName.toLowerCase());
854855
} else {
855856
el = document.createElement(vNewNode.tagName);
856857
}
@@ -1046,7 +1047,7 @@ const _mountInternal = (target, component, attachDetector) => {
10461047
}
10471048

10481049
export function version() {
1049-
return '20.1.0';
1050+
return '20.2.0';
10501051
}
10511052

10521053
export function resolveAll(promiseArr) {

0 commit comments

Comments
 (0)