github-forks
/
snabbdom
mirror of https://github.com/snabbdom/snabbdom.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

test: workaround IE11 defficiencies (#550)

Browse Source 
Fixes #471.
pull/556/head
Shahar Dawn Or 5 years ago committed by GitHub
parent c0a7f1ef82
commit 693872cf73
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 72 additions and 57 deletions
Show Stats Download Patch File Download Diff File

2
browserstack-karma.js
Unescape Escape View File

@ -84,7 +84,6 @@ module.exports = {
os: 'Windows',
os_version: '10',
},
/* https://github.com/snabbdom/snabbdom/issues/471
BS_IE_11: {
base: 'BrowserStack',
browser: 'ie',
@ -92,7 +91,6 @@ module.exports = {
os: 'Windows',
os_version: '7',
},
*/
/* https://github.com/snabbdom/snabbdom/issues/472
BS_IE_10: {
base: 'BrowserStack',

14
src/test/attributes.ts
Unescape Escape View File

@ -38,10 +38,10 @@ describe('attributes', function () {
it('are not omitted when falsy values are provided', function () {
var vnode1 = h('div', { attrs: { href: null as any, minlength: 0, value: '', title: 'undefined' } });
elm = patch(vnode0, vnode1).elm;
assert.strictEqual(elm.getAttribute('href'), 'null');
assert.strictEqual(elm.getAttribute('minlength'), '0');
assert.strictEqual(elm.getAttribute('value'), '');
assert.strictEqual(elm.getAttribute('title'), 'undefined');
assert.ok(elm.hasAttribute('href'));
assert.ok(elm.hasAttribute('minlength'));
assert.ok(elm.hasAttribute('value'));
assert.ok(elm.hasAttribute('title'));
});
it('are set correctly when namespaced', function () {
var vnode1 = h('div', { attrs: { 'xlink:href': '#foo' } });
@ -77,11 +77,11 @@ describe('attributes', function () {
assert.strictEqual(elm.hasAttribute('required'), false);
assert.strictEqual(elm.getAttribute('required'), null);
});
it('is not omitted if the value is falsy but casted to string', function () {
it('is not omitted if the value is falsy', function () {
var vnode1 = h('div', { attrs: { readonly: 0, noresize: null as any } });
elm = patch(vnode0, vnode1).elm;
assert.strictEqual(elm.getAttribute('readonly'), '0');
assert.strictEqual(elm.getAttribute('noresize'), 'null');
assert.ok(elm.hasAttribute('readonly'));
assert.ok(elm.hasAttribute('noresize'));
});
});
describe('Object.prototype property', function () {

49
src/test/core.ts
Unescape Escape View File

@ -11,6 +11,8 @@ import vnode, { VNode } from '../vnode'
import htmlDomApi from '../htmldomapi'
import { CreateHook, InsertHook, PrePatchHook, RemoveHook, InitHook, DestroyHook, UpdateHook } from '../hooks'
const hasSvgClassList = 'classList' in SVGElement.prototype
var patch = init([
classModule,
propsModule,
@ -145,25 +147,29 @@ describe('snabbdom', function () {
assert(!elm.classList.contains('not'));
});
it('receives classes in selector when namespaced', function () {
elm = patch(vnode0,
h('svg', [
h('g.am.a.class.too')
])
).elm;
assert(elm.firstChild.classList.contains('am'));
assert(elm.firstChild.classList.contains('a'));
assert(elm.firstChild.classList.contains('class'));
if (!hasSvgClassList) { this.skip() } else {
elm = patch(vnode0,
h('svg', [
h('g.am.a.class.too')
])
).elm;
assert(elm.firstChild.classList.contains('am'));
assert(elm.firstChild.classList.contains('a'));
assert(elm.firstChild.classList.contains('class'));
}
});
it('receives classes in class property when namespaced', function () {
elm = patch(vnode0,
h('svg', [
h('g', { class: { am: true, a: true, class: true, not: false, too: true } })
])
).elm;
assert(elm.firstChild.classList.contains('am'));
assert(elm.firstChild.classList.contains('a'));
assert(elm.firstChild.classList.contains('class'));
assert(!elm.firstChild.classList.contains('not'));
if (!hasSvgClassList) { this.skip() } else {
elm = patch(vnode0,
h('svg', [
h('g', { class: { am: true, a: true, class: true, not: false, too: true } })
])
).elm;
assert(elm.firstChild.classList.contains('am'));
assert(elm.firstChild.classList.contains('a'));
assert(elm.firstChild.classList.contains('class'));
assert(!elm.firstChild.classList.contains('not'));
}
});
it('handles classes from both selector and property', function () {
elm = patch(vnode0, h('div', [h('i.has', { class: { classes: true } })])).elm;
@ -322,7 +328,7 @@ describe('snabbdom', function () {
var prevElm = document.createElement('div');
prevElm.id = 'id';
prevElm.className = 'class';
var text = new Text('Foobar');
var text = document.createTextNode('Foobar');
const reference = {};
(text as any).testProperty = reference; // ensures we dont recreate the Text Node
prevElm.appendChild(text);
@ -344,7 +350,7 @@ describe('snabbdom', function () {
var prevElm = document.createElement('div');
prevElm.id = 'id';
prevElm.className = 'class';
var text = new Text('Foobar');
var text = document.createTextNode('Foobar');
prevElm.appendChild(text);
prevElm.appendChild(h2);
var nextVNode = h('div#id.class', [h('h2', 'Hello')]);
@ -358,9 +364,10 @@ describe('snabbdom', function () {
assert.strictEqual(elm.childNodes[0].textContent, 'Hello');
});
it('can work with domApi', function () {
var domApi = Object.assign({}, htmlDomApi, {
var domApi = {
...htmlDomApi,
tagName: function (elm: HTMLElement) { return 'x-' + elm.tagName.toUpperCase(); }
});
};
var h2 = document.createElement('h2');
h2.id = 'hx';
h2.setAttribute('data-env', 'xyz');

64
src/test/style.ts
Unescape Escape View File

@ -9,6 +9,10 @@ var patch = init([
styleModule
]);
const featureDiscoveryElm = document.createElement('div')
featureDiscoveryElm.style.setProperty('--foo', 'foo')
const hasCssVariables = featureDiscoveryElm.style.getPropertyValue('--foo') === 'foo'
describe('style', function () {
var elm: any, vnode0: any;
beforeEach(function () {
@ -67,37 +71,43 @@ describe('style', function () {
assert.strictEqual(elm.firstChild.style.fontSize, '10px');
});
it('updates css variables', function () {
var vnode1 = h('div', { style: { '--myVar': 1 as any } });
var vnode2 = h('div', { style: { '--myVar': 2 as any } });
var vnode3 = h('div', { style: { '--myVar': 3 as any } });
elm = patch(vnode0, vnode1).elm;
assert.strictEqual(elm.style.getPropertyValue('--myVar'), '1');
elm = patch(vnode1, vnode2).elm;
assert.strictEqual(elm.style.getPropertyValue('--myVar'), '2');
elm = patch(vnode2, vnode3).elm;
assert.strictEqual(elm.style.getPropertyValue('--myVar'), '3');
if (!hasCssVariables) { this.skip() } else {
var vnode1 = h('div', { style: { '--myVar': 1 as any } });
var vnode2 = h('div', { style: { '--myVar': 2 as any } });
var vnode3 = h('div', { style: { '--myVar': 3 as any } });
elm = patch(vnode0, vnode1).elm;
assert.strictEqual(elm.style.getPropertyValue('--myVar'), '1');
elm = patch(vnode1, vnode2).elm;
assert.strictEqual(elm.style.getPropertyValue('--myVar'), '2');
elm = patch(vnode2, vnode3).elm;
assert.strictEqual(elm.style.getPropertyValue('--myVar'), '3');
}
});
it('explicialy removes css variables', function () {
var vnode1 = h('i', { style: { '--myVar': 1 as any } });
var vnode2 = h('i', { style: { '--myVar': '' } });
var vnode3 = h('i', { style: { '--myVar': 2 as any } });
elm = patch(vnode0, vnode1).elm;
assert.strictEqual(elm.style.getPropertyValue('--myVar'), '1');
patch(vnode1, vnode2);
assert.strictEqual(elm.style.getPropertyValue('--myVar'), '');
patch(vnode2, vnode3);
assert.strictEqual(elm.style.getPropertyValue('--myVar'), '2');
if (!hasCssVariables) { this.skip() } else {
var vnode1 = h('i', { style: { '--myVar': 1 as any } });
var vnode2 = h('i', { style: { '--myVar': '' } });
var vnode3 = h('i', { style: { '--myVar': 2 as any } });
elm = patch(vnode0, vnode1).elm;
assert.strictEqual(elm.style.getPropertyValue('--myVar'), '1');
patch(vnode1, vnode2);
assert.strictEqual(elm.style.getPropertyValue('--myVar'), '');
patch(vnode2, vnode3);
assert.strictEqual(elm.style.getPropertyValue('--myVar'), '2');
}
});
it('implicially removes css variables from element', function () {
var vnode1 = h('div', [h('i', { style: { '--myVar': 1 as any } })]);
var vnode2 = h('div', [h('i')]);
var vnode3 = h('div', [h('i', { style: { '--myVar': 2 as any } })]);
patch(vnode0, vnode1);
assert.strictEqual(elm.firstChild.style.getPropertyValue('--myVar'), '1');
patch(vnode1, vnode2);
assert.strictEqual(elm.firstChild.style.getPropertyValue('--myVar'), '');
patch(vnode2, vnode3);
assert.strictEqual(elm.firstChild.style.getPropertyValue('--myVar'), '2');
if (!hasCssVariables) { this.skip() } else {
var vnode1 = h('div', [h('i', { style: { '--myVar': 1 as any } })]);
var vnode2 = h('div', [h('i')]);
var vnode3 = h('div', [h('i', { style: { '--myVar': 2 as any } })]);
patch(vnode0, vnode1);
assert.strictEqual(elm.firstChild.style.getPropertyValue('--myVar'), '1');
patch(vnode1, vnode2);
assert.strictEqual(elm.firstChild.style.getPropertyValue('--myVar'), '');
patch(vnode2, vnode3);
assert.strictEqual(elm.firstChild.style.getPropertyValue('--myVar'), '2');
}
});
it('updates delayed styles in next frame', function (done) {
var vnode1 = h('i', { style: { fontSize: '14px', delayed: { fontSize: '16px' } as any } });

Write Preview
Loading…
Cancel
Save