remove redundant component.destroy calls, rename others to $destroy

pull/1864/head
Rich Harris 7 years ago
parent 3da78c7e46
commit 3f52b5ac0e

@ -1,2 +1 @@
--bail
test/test.js

@ -4,29 +4,28 @@ export default {
// instead
skip: true,
test ( assert, component, target, window ) {
assert.equal( component.t, 0 );
assert.equal( component.d, 0 );
assert.equal( component.v, 0.5 );
assert.equal( component.paused, true );
test(assert, component, target, window) {
assert.equal(component.t, 0);
assert.equal(component.d, 0);
assert.equal(component.v, 0.5);
assert.equal(component.paused, true);
const audio = target.querySelector( 'audio' );
const timeupdate = new window.Event( 'timeupdate' );
const durationchange = new window.Event( 'durationchange' );
const volumechange = new window.Event( 'volumechange' );
const audio = target.querySelector('audio');
const timeupdate = new window.Event('timeupdate');
const durationchange = new window.Event('durationchange');
const volumechange = new window.Event('volumechange');
audio.currentTime = 10;
audio.duration = 20;
audio.volume = 0.75;
audio.dispatchEvent( timeupdate );
audio.dispatchEvent( durationchange );
audio.dispatchEvent( volumechange );
audio.dispatchEvent(timeupdate);
audio.dispatchEvent(durationchange);
audio.dispatchEvent(volumechange);
audio.play();
assert.equal( component.t, 10 );
assert.equal( component.d, 0 ); // not 20, because read-only. Not sure how to test this!
assert.equal( component.v, 0.75 );
assert.equal( component.paused, true ); // ditto...
component.destroy();
assert.equal(component.t, 10);
assert.equal(component.d, 0); // not 20, because read-only. Not sure how to test this!
assert.equal(component.v, 0.75);
assert.equal(component.paused, true); // ditto...
}
};

@ -3,18 +3,16 @@ export default {
a: 42
},
test ( assert, component, target, window ) {
const input = target.querySelector( 'input' );
assert.equal( input.value, '42' );
test(assert, component, target, window) {
const input = target.querySelector('input');
assert.equal(input.value, '42');
const event = new window.Event( 'input' );
const event = new window.Event('input');
input.value = 43;
input.dispatchEvent( event );
input.dispatchEvent(event);
assert.equal( input.value, '43' );
assert.equal( component.a, 43 );
component.destroy();
assert.equal(input.value, '43');
assert.equal(component.a, 43);
}
};

@ -13,13 +13,11 @@ export default {
<p>selected: a</p>
`,
test ( assert, component, target ) {
const select = target.querySelector( 'select' );
const options = [ ...target.querySelectorAll( 'option' ) ];
test(assert, component, target) {
const select = target.querySelector('select');
const options = [...target.querySelectorAll('option')];
assert.equal( select.value, 'a' );
assert.ok( options[0].selected );
component.destroy();
assert.equal(select.value, 'a');
assert.ok(options[0].selected);
}
};

@ -33,7 +33,5 @@ export default {
assert.equal(select.value, 'b');
assert.ok(options[1].selected);
component.destroy();
},
};

@ -9,24 +9,22 @@ export default {
<p>selected: nothing</p>
`,
test ( assert, component, target ) {
test(assert, component, target) {
component.items = [ 'one', 'two', 'three' ];
component.selected = 'two';
const options = target.querySelectorAll( 'option' );
assert.ok( !options[0].selected );
assert.ok( options[1].selected );
assert.ok( !options[2].selected );
const options = target.querySelectorAll('option');
assert.ok(!options[0].selected);
assert.ok(options[1].selected);
assert.ok(!options[2].selected);
assert.htmlEqual( target.innerHTML, `
assert.htmlEqual(target.innerHTML, `
<select>
<option value='one'>one</option>
<option value='two'>two</option>
<option value='three'>three</option>
</select>
<p>selected: two</p>
` );
component.destroy();
`);
}
};

@ -30,15 +30,15 @@ export default {
<pre>ONE SOURCE\nTWO SOURCE</pre>
`,
test ( assert, component, target, window ) {
const event = new window.MouseEvent( 'input' );
const textarea = target.querySelector( 'textarea' );
test(assert, component, target, window) {
const event = new window.MouseEvent('input');
const textarea = target.querySelector('textarea');
textarea.value = 'one source changed';
textarea.dispatchEvent( event );
textarea.dispatchEvent(event);
assert.equal( component.compiled, 'ONE SOURCE CHANGED\nTWO SOURCE' );
assert.htmlEqual( target.innerHTML, `
assert.equal(component.compiled, 'ONE SOURCE CHANGED\nTWO SOURCE');
assert.htmlEqual(target.innerHTML, `
<select>
<option value='[object Object]'>One.html</option>
<option value='[object Object]'>Two.html</option>
@ -47,28 +47,28 @@ export default {
<textarea></textarea>
<pre>ONE SOURCE CHANGED\nTWO SOURCE</pre>
` );
`);
// const select = target.querySelector( 'select' );
// console.log( `select.options[0].selected`, select.options[0].selected )
// console.log( `select.options[1].selected`, select.options[1].selected )
// console.log( `select.value`, select.value )
// console.log( `select.__value`, select.__value )
// const select = target.querySelector('select');
// console.log(`select.options[0].selected`, select.options[0].selected)
// console.log(`select.options[1].selected`, select.options[1].selected)
// console.log(`select.value`, select.value)
// console.log(`select.__value`, select.__value)
// select.options[1].selected = true;
// console.log( `select.options[0].selected`, select.options[0].selected )
// console.log( `select.options[1].selected`, select.options[1].selected )
// console.log( `select.value`, select.value )
// console.log( `select.__value`, select.__value )
// select.dispatchEvent( new window.Event( 'change' ) );
// console.log(`select.options[0].selected`, select.options[0].selected)
// console.log(`select.options[1].selected`, select.options[1].selected)
// console.log(`select.value`, select.value)
// console.log(`select.__value`, select.__value)
// select.dispatchEvent(new window.Event('change'));
component.selectedComponent = components[1];
assert.equal( textarea.value, 'two source' );
assert.equal(textarea.value, 'two source');
textarea.value = 'two source changed';
textarea.dispatchEvent( event );
textarea.dispatchEvent(event);
assert.equal( component.compiled, 'ONE SOURCE CHANGED\nTWO SOURCE CHANGED' );
assert.htmlEqual( target.innerHTML, `
assert.equal(component.compiled, 'ONE SOURCE CHANGED\nTWO SOURCE CHANGED');
assert.htmlEqual(target.innerHTML, `
<select>
<option value='[object Object]'>One.html</option>
<option value='[object Object]'>Two.html</option>
@ -77,8 +77,6 @@ export default {
<textarea></textarea>
<pre>ONE SOURCE CHANGED\nTWO SOURCE CHANGED</pre>
` );
component.destroy();
`);
}
};

@ -11,19 +11,17 @@ export default {
<p>foo, bar, baz</p>
`,
test ( assert, component, target, window ) {
const event = new window.MouseEvent( 'input' );
const inputs = target.querySelectorAll( 'input' );
test(assert, component, target, window) {
const event = new window.MouseEvent('input');
const inputs = target.querySelectorAll('input');
inputs[0].value = 'blah';
inputs[0].dispatchEvent( event );
inputs[0].dispatchEvent(event);
assert.deepEqual( component.a, [{ name: 'blah' }, { name: 'bar' }, { name: 'baz' }] );
assert.htmlEqual( target.innerHTML, `
assert.deepEqual(component.a, [{ name: 'blah' }, { name: 'bar' }, { name: 'baz' }]);
assert.htmlEqual(target.innerHTML, `
<input><input><input>
<p>blah, bar, baz</p>
` );
component.destroy();
`);
}
};

@ -7,16 +7,14 @@ export default {
<span>foo</span><span>bar</span><span>baz</span>
`,
test ( assert, component, target ) {
test(assert, component, target) {
component.a = [
{ id: 'yep' },
{ id: 'nope' }
];
assert.htmlEqual( target.innerHTML, `
assert.htmlEqual(target.innerHTML, `
<span>yep</span><span>nope</span>
` );
component.destroy();
`);
}
};

@ -11,19 +11,17 @@ export default {
<p>foo, bar, baz</p>
`,
test ( assert, component, target, window ) {
const event = new window.MouseEvent( 'input' );
const inputs = target.querySelectorAll( 'input' );
test(assert, component, target, window) {
const event = new window.MouseEvent('input');
const inputs = target.querySelectorAll('input');
inputs[0].value = 'blah';
inputs[0].dispatchEvent( event );
inputs[0].dispatchEvent(event);
assert.deepEqual( component.a, [ 'blah', 'bar', 'baz' ] );
assert.htmlEqual( target.innerHTML, `
assert.deepEqual(component.a, [ 'blah', 'bar', 'baz' ]);
assert.htmlEqual(target.innerHTML, `
<input><input><input>
<p>blah, bar, baz</p>
` );
component.destroy();
`);
}
};

@ -3,10 +3,8 @@ export default {
<div><p class='widget'>Hello</p></div>
`,
test ( assert, component, target ) {
test(assert, component, target) {
component.arriving = false;
assert.htmlEqual( target.innerHTML, `<div><p class='widget'>Goodbye</p></div>` );
component.destroy();
assert.htmlEqual(target.innerHTML, `<div><p class='widget'>Goodbye</p></div>`);
}
};

@ -5,6 +5,5 @@ export default {
component.y = 2;
assert.equal(component.x, 4);
assert.equal(target.innerHTML, '<p>4</p>');
component.destroy();
}
};

@ -6,6 +6,5 @@ export default {
assert.equal(component.c, 5);
assert.equal(component.cSquared, 25);
assert.equal(target.innerHTML, '<p>3 + 2 = 5</p>\n<p>5 * 5 = 25</p>');
component.destroy();
}
};

@ -1,8 +1,7 @@
export default {
html: `<span>got</span>`,
test ( assert, component ) {
assert.equal( component.foo, 'got' );
component.destroy();
test(assert, component) {
assert.equal(component.foo, 'got');
}
};

@ -1,8 +1,7 @@
export default {
html: `ABCD`,
test ( assert, component ) {
assert.equal( component.compute, 'ABCD' );
component.destroy();
test (assert, component) {
assert.equal(component.compute, 'ABCD');
}
};

@ -1,6 +1,6 @@
export default {
test(assert, component) {
component.destroy();
component.destroy();
component.$destroy();
component.$destroy();
}
};

@ -11,8 +11,8 @@ export default {
warnings.push(warning);
};
component.destroy();
component.destroy();
component.$destroy();
component.$destroy();
assert.deepEqual(warnings, [
`Component was already destroyed`

@ -11,23 +11,21 @@ export default {
<p>drink milk</p>
`,
test ( assert, component, target ) {
const [ p1, p2 ] = target.querySelectorAll( 'p' );
test(assert, component, target) {
const [ p1, p2 ] = target.querySelectorAll('p');
component.todos = [
{ id: 123, description: 'buy beer' },
{ id: 234, description: 'drink beer' }
];
assert.htmlEqual( target.innerHTML, `
assert.htmlEqual(target.innerHTML, `
<p>buy beer</p>
<p>drink beer</p>
` );
`);
const [ p3, p4 ] = target.querySelectorAll( 'p' );
const [ p3, p4 ] = target.querySelectorAll('p');
assert.equal( p1, p3 );
assert.equal( p2, p4 );
component.destroy();
assert.equal(p1, p3);
assert.equal(p2, p4);
}
};

@ -16,7 +16,5 @@ export default {
<p>b</p>
<p>c</p>
`);
component.destroy();
}
};

@ -11,19 +11,17 @@ export default {
<p>2: implement client-side hydration</p>
`,
test ( assert, component, target ) {
const [ p1, p2 ] = target.querySelectorAll( 'p' );
test(assert, component, target) {
const [ p1, p2 ] = target.querySelectorAll('p');
component.todos = [
{ id: 234, description: 'implement client-side hydration' }
];
assert.htmlEqual( target.innerHTML, '<p>1: implement client-side hydration</p>' );
assert.htmlEqual(target.innerHTML, '<p>1: implement client-side hydration</p>');
const [ p3 ] = target.querySelectorAll( 'p' );
const [ p3 ] = target.querySelectorAll('p');
assert.ok( !target.contains( p1 ), 'first <p> element should be removed' );
assert.equal( p2, p3, 'second <p> element should be retained' );
component.destroy();
assert.ok(!target.contains(p1), 'first <p> element should be removed');
assert.equal(p2, p3, 'second <p> element should be retained');
}
};

@ -8,25 +8,23 @@ export default {
<p>second: </p>
`,
test ( assert, component, target, window ) {
const event = new window.MouseEvent( 'click' );
test(assert, component, target, window) {
const event = new window.MouseEvent('click');
const buttons = target.querySelectorAll( 'button' );
const buttons = target.querySelectorAll('button');
buttons[1].dispatchEvent( event );
buttons[1].dispatchEvent(event);
assert.htmlEqual( target.innerHTML, `
assert.htmlEqual(target.innerHTML, `
<button>0: foo</button>
<button>1: bar</button>
<button>2: baz</button>
<p>first: 1</p>
<p>second: bar</p>
` );
`);
assert.equal( component.first, '1' );
assert.equal( component.second, 'bar' );
component.destroy();
assert.equal(component.first, '1');
assert.equal(component.second, 'bar');
}
};

@ -8,25 +8,23 @@ export default {
<p>fromState: </p>
`,
test ( assert, component, target, window ) {
const event = new window.MouseEvent( 'click' );
test(assert, component, target, window) {
const event = new window.MouseEvent('click');
const buttons = target.querySelectorAll( 'button' );
const buttons = target.querySelectorAll('button');
buttons[1].dispatchEvent( event );
buttons[1].dispatchEvent(event);
assert.htmlEqual( target.innerHTML, `
assert.htmlEqual(target.innerHTML, `
<button>foo</button>
<button>bar</button>
<button>baz</button>
<p>fromDom: bar</p>
<p>fromState: bar</p>
` );
`);
assert.equal( component.fromDom, 'bar' );
assert.equal( component.fromState, 'bar' );
component.destroy();
assert.equal(component.fromDom, 'bar');
assert.equal(component.fromState, 'bar');
}
};

@ -1,7 +1,7 @@
export default {
props: {
foo: [ 1 ],
bar: [ 2 ],
foo: [1],
bar: [2],
clicked: 'neither'
},
@ -11,26 +11,24 @@ export default {
<p>clicked: neither</p>
`,
test ( assert, component, target, window ) {
const buttons = target.querySelectorAll( 'button' );
const event = new window.MouseEvent( 'click' );
test(assert, component, target, window) {
const buttons = target.querySelectorAll('button');
const event = new window.MouseEvent('click');
buttons[0].dispatchEvent( event );
assert.equal( component.clicked, 'foo' );
assert.htmlEqual( target.innerHTML, `
buttons[0].dispatchEvent(event);
assert.equal(component.clicked, 'foo');
assert.htmlEqual(target.innerHTML, `
<button>foo</button>
<button>bar</button>
<p>clicked: foo</p>
` );
`);
buttons[1].dispatchEvent( event );
assert.equal( component.clicked, 'bar' );
assert.htmlEqual( target.innerHTML, `
buttons[1].dispatchEvent(event);
assert.equal(component.clicked, 'bar');
assert.htmlEqual(target.innerHTML, `
<button>foo</button>
<button>bar</button>
<p>clicked: bar</p>
` );
component.destroy();
`);
}
};

@ -15,18 +15,16 @@ export default {
<p>selected: foo</p>
`,
test ( assert, component, target, window ) {
const buttons = target.querySelectorAll( 'button' );
const event = new window.MouseEvent( 'click' );
test(assert, component, target, window) {
const buttons = target.querySelectorAll('button');
const event = new window.MouseEvent('click');
buttons[1].dispatchEvent( event );
assert.htmlEqual( target.innerHTML, `
buttons[1].dispatchEvent(event);
assert.htmlEqual(target.innerHTML, `
<button>foo</button>
<button>bar</button>
<button>baz</button>
<p>selected: bar</p>
` );
component.destroy();
`);
}
};

@ -1,2 +1,2 @@
<input class='wont-focus'>
<input class='will-focus' on:click='{() => event.target.focus()}'>
<input class='will-focus' on:click='{e => e.target.focus()}'>

@ -1,17 +1,15 @@
export default {
test ( assert, component ) {
test(assert, component) {
let count = 0;
const expected = { x: 1 };
component.$on( 'foo', data => {
assert.equal( data, expected );
component.$on('foo', data => {
assert.equal(data, expected);
count += 1;
});
component.fire( 'foo', expected );
assert.equal( count, 1 );
component.destroy();
component.fire('foo', expected);
assert.equal(count, 1);
}
};

@ -5,11 +5,9 @@ export default {
html: '1, 3, 5, 7, 9',
test ( assert, component, target ) {
component.numbers = [ 10, 11, 12, 13, 14, 15, 16 ];
test(assert, component, target) {
component.numbers = [10, 11, 12, 13, 14, 15, 16];
assert.htmlEqual( target.innerHTML, `11, 13, 15` );
component.destroy();
assert.htmlEqual(target.innerHTML, `11, 13, 15`);
}
};

@ -6,7 +6,7 @@ export default {
html: `<div>1</div>`,
test(assert, component) {
component.destroy();
component.$destroy();
const { foo } = component.get();
assert.equal(foo, undefined);
}

@ -5,11 +5,11 @@ export default {
html: '<h1>Hello world!</h1>',
test ( assert, component, target ) {
test (assert, component, target) {
component.name = 'everybody';
assert.htmlEqual( target.innerHTML, '<h1>Hello everybody!</h1>' );
assert.htmlEqual(target.innerHTML, '<h1>Hello everybody!</h1>');
component.destroy();
assert.htmlEqual( target.innerHTML, '' );
component.$destroy();
assert.htmlEqual(target.innerHTML, '');
}
};

@ -15,7 +15,5 @@ export default {
component.x = 6;
assert.htmlEqual(target.innerHTML, ``);
component.destroy();
}
};

@ -7,17 +7,15 @@ export default {
before-if-after
`,
test ( assert, component, target ) {
test (assert, component, target) {
component.x = 4;
assert.htmlEqual( target.innerHTML, `
assert.htmlEqual(target.innerHTML, `
before-elseif-after
` );
`);
component.x = 6;
assert.htmlEqual( target.innerHTML, `
assert.htmlEqual(target.innerHTML, `
before-else-after
` );
component.destroy();
`);
}
};

@ -7,17 +7,15 @@ export default {
<p>x is greater than 10</p>
`,
test ( assert, component, target ) {
test(assert, component, target) {
component.x = 4;
assert.htmlEqual( target.innerHTML, `
assert.htmlEqual(target.innerHTML, `
<p>x is less than 5</p>
` );
`);
component.x = 6;
assert.htmlEqual( target.innerHTML, `
assert.htmlEqual(target.innerHTML, `
<p>x is between 5 and 10</p>
` );
component.destroy();
`);
}
};

@ -1,7 +1,7 @@
export default {
test(assert, component) {
assert.deepEqual(component.events, ['create']);
component.destroy();
component.$destroy();
assert.deepEqual(component.events, ['create', 'destroy']);
}
};

@ -10,13 +10,11 @@ export default {
<p>hello!</p>
`,
test ( assert, component, target ) {
test(assert, component, target) {
component.value = 'goodbye!';
assert.htmlEqual( target.innerHTML, `
assert.htmlEqual(target.innerHTML, `
<p>goodbye!</p>
<p>goodbye!</p>
` );
component.destroy();
`);
}
};

@ -5,13 +5,11 @@ export default {
<span>3</span><span>2</span><span>1</span>
`,
test ( assert, component, target ) {
test(assert, component, target) {
component.refs.list.update();
assert.htmlEqual( target.innerHTML, `
assert.htmlEqual(target.innerHTML, `
<span>1</span><span>2</span><span>3</span><span>4</span><span>5</span>
` );
component.destroy();
`);
}
};

@ -3,10 +3,8 @@ export default {
html: `<div><p>true</p></div>`,
test ( assert, component, target ) {
test(assert, component, target) {
component.foo = true;
assert.htmlEqual( target.innerHTML, `<div><p>true</p>\n<p>true</p></div>` );
component.destroy();
assert.htmlEqual(target.innerHTML, `<div><p>true</p>\n<p>true</p></div>`);
}
};

@ -7,13 +7,11 @@ export default {
html: `<div><p>does not change</p></div>`,
test ( assert, component, target ) {
const p = target.querySelector( 'p' );
test(assert, component, target) {
const p = target.querySelector('p');
component.raw = '<p>does not change</p>';
assert.equal( target.innerHTML, `<div><p>does not change</p></div>` );
assert.strictEqual( target.querySelector( 'p' ), p );
component.destroy();
assert.equal(target.innerHTML, `<div><p>does not change</p></div>`);
assert.strictEqual(target.querySelector('p'), p);
}
};

@ -9,12 +9,12 @@ export default {
html: `before${ns}<span><em>raw html!!!\\o/</span></em>${ns}after`,
test ( assert, component, target ) {
test(assert, component, target) {
component.raw = '';
assert.equal( target.innerHTML, `before${ns}${ns}after` );
assert.equal(target.innerHTML, `before${ns}${ns}after`);
component.raw = 'how about <strong>unclosed elements?';
assert.equal( target.innerHTML, `before${ns}how about <strong>unclosed elements?</strong>${ns}after` );
component.destroy();
assert.equal( target.innerHTML, '' );
assert.equal(target.innerHTML, `before${ns}how about <strong>unclosed elements?</strong>${ns}after`);
component.$destroy();
assert.equal(target.innerHTML, '');
}
};

@ -4,19 +4,17 @@ export default {
selected: 'b'
},
test ( assert, component, target, window ) {
const select = target.querySelector( 'select' );
assert.equal( select.value, 'b' );
test(assert, component, target, window) {
const select = target.querySelector('select');
assert.equal(select.value, 'b');
const event = new window.Event( 'change' );
const event = new window.Event('change');
select.value = 'c';
select.dispatchEvent( event );
select.dispatchEvent(event);
assert.equal( select.value, 'c' );
assert.equal( component.lastChangedTo, 'c' );
assert.equal( component.selected, 'c' );
component.destroy();
assert.equal(select.value, 'c');
assert.equal(component.lastChangedTo, 'c');
assert.equal(component.selected, 'c');
}
};

@ -14,8 +14,8 @@ export default {
</select>
`,
test ( assert, component, target ) {
assert.htmlEqual( target.innerHTML,`
test(assert, component, target) {
assert.htmlEqual(target.innerHTML,`
<select>
<option value="a">One</option>
<option value="b">Two</option>
@ -23,9 +23,9 @@ export default {
</select>
`);
assert.equal( target.querySelector( 'select' ).value, 'a' );
assert.equal(target.querySelector('select').value, 'a');
component.destroy();
assert.htmlEqual( target.innerHTML, '' );
component.$destroy();
assert.htmlEqual(target.innerHTML, '');
}
};

@ -4,7 +4,7 @@ export default {
},
test(assert, component) {
component.destroy();
component.$destroy();
component.x = 2;
}
};

@ -7,10 +7,9 @@ export default {
a: 42
},
test ( assert, component ) {
test(assert, component) {
const obj = { a: 1 };
component.set( obj );
component.set( obj ); // will fail if the object is not cloned
component.destroy();
component.set(obj);
component.set(obj); // will fail if the object is not cloned
}
};

@ -18,7 +18,7 @@ export default {
values.push(current.foo);
});
component.destroy();
component.$destroy();
assert.deepEqual(values, [2]);
assert.equal(valueOnDestroy, 2);

@ -1,8 +1,7 @@
export default {
skip: true, // nice-to-have tricky though, so skipping for now
test ( assert, component ) {
test(assert, component) {
component.foo = { x: 2 };
component.destroy();
}
};

@ -7,9 +7,8 @@ export default {
</svg>
`,
test ( assert, component, target ) {
const circle = target.querySelector( 'circle' );
assert.equal( circle.getAttribute( 'class' ), 'red' );
component.destroy();
test(assert, component, target) {
const circle = target.querySelector('circle');
assert.equal(circle.getAttribute('class'), 'red');
}
};

@ -3,12 +3,10 @@
export default {
html: `<svg class='foo'></svg>`,
test ( assert, component, target ) {
const svg = target.querySelector( 'svg' );
test(assert, component, target) {
const svg = target.querySelector('svg');
assert.equal( svg.namespaceURI, 'http://www.w3.org/2000/svg' );
assert.equal( svg.getAttribute( 'class' ), 'foo' );
component.destroy();
assert.equal(svg.namespaceURI, 'http://www.w3.org/2000/svg');
assert.equal(svg.getAttribute('class'), 'foo');
}
};

@ -5,11 +5,10 @@ export default {
</svg>
`,
test ( assert, component, target ) {
const circles = target.querySelectorAll( 'circle' );
assert.equal( circles[0].namespaceURI, 'http://www.w3.org/2000/svg' );
assert.equal( circles[1].namespaceURI, 'http://www.w3.org/2000/svg' );
assert.equal( circles[2].namespaceURI, 'http://www.w3.org/2000/svg' );
component.destroy();
test(assert, component, target) {
const circles = target.querySelectorAll('circle');
assert.equal(circles[0].namespaceURI, 'http://www.w3.org/2000/svg');
assert.equal(circles[1].namespaceURI, 'http://www.w3.org/2000/svg');
assert.equal(circles[2].namespaceURI, 'http://www.w3.org/2000/svg');
}
};

@ -8,12 +8,10 @@ export default {
<use xlink:href='#stamp' x='20' y='20'/>
</svg>
`,
test ( assert, component, target ) {
const use = target.querySelector( 'use' );
test(assert, component, target) {
const use = target.querySelector('use');
const href = use.attributes[ 'xlink:href' ];
assert.equal( href.namespaceURI, 'http://www.w3.org/1999/xlink' );
component.destroy();
assert.equal(href.namespaceURI, 'http://www.w3.org/1999/xlink');
}
};

@ -1,12 +1,10 @@
export default {
test ( assert, component, target, window, raf ) {
test(assert, component, target, window, raf) {
component.visible = true;
const div = target.querySelector( 'div' );
assert.strictEqual( div.style.opacity, '0' );
const div = target.querySelector('div');
assert.strictEqual(div.style.opacity, '0');
raf.tick( 50 );
assert.strictEqual( div.style.opacity, '' );
component.destroy();
raf.tick(50);
assert.strictEqual(div.style.opacity, '');
}
};

@ -1,24 +1,22 @@
export default {
test ( assert, component, target, window, raf ) {
test(assert, component, target, window, raf) {
component.visible = true;
const div = target.querySelector( 'div' );
assert.equal( div.foo, 0 );
const div = target.querySelector('div');
assert.equal(div.foo, 0);
raf.tick( 50 );
assert.equal( div.foo, 0 );
raf.tick(50);
assert.equal(div.foo, 0);
raf.tick( 150 );
assert.equal( div.foo, 1 );
raf.tick(150);
assert.equal(div.foo, 1);
component.visible = false;
assert.equal( div.bar, undefined );
assert.equal(div.bar, undefined);
raf.tick( 200 );
assert.equal( div.bar, 1 );
raf.tick(200);
assert.equal(div.bar, 1);
raf.tick( 300 );
assert.equal( div.bar, 0 );
component.destroy();
raf.tick(300);
assert.equal(div.bar, 0);
}
};

@ -1,29 +1,27 @@
export default {
test ( assert, component, target, window, raf ) {
test(assert, component, target, window, raf) {
component.visible = true;
const div = target.querySelector( 'div' );
assert.equal( div.foo, 0 );
const div = target.querySelector('div');
assert.equal(div.foo, 0);
raf.tick( 50 );
assert.equal( div.foo, 0 );
raf.tick(50);
assert.equal(div.foo, 0);
raf.tick( 100 );
assert.equal( div.foo, 0.5 );
raf.tick(100);
assert.equal(div.foo, 0.5);
component.visible = false;
raf.tick( 125 );
assert.equal( div.foo, 0.75 );
raf.tick(125);
assert.equal(div.foo, 0.75);
raf.tick( 150 );
assert.equal( div.foo, 1 );
raf.tick(150);
assert.equal(div.foo, 1);
raf.tick( 175 );
assert.equal( div.foo, 0.75 );
raf.tick(175);
assert.equal(div.foo, 0.75);
raf.tick( 250 );
assert.equal( div.foo, 0 );
component.destroy();
raf.tick(250);
assert.equal(div.foo, 0);
}
};

@ -12,7 +12,7 @@ export default {
raf.tick(50);
assert.equal(div.foo, 0.5);
component.destroy();
component.$destroy();
raf.tick(100);
},

@ -3,36 +3,34 @@ export default {
name: 'world'
},
test ( assert, component, target, window, raf ) {
test(assert, component, target, window, raf) {
global.count = 0;
component.visible = true;
assert.equal( global.count, 1 );
const div = target.querySelector( 'div' );
assert.equal( div.foo, 0 );
assert.equal(global.count, 1);
const div = target.querySelector('div');
assert.equal(div.foo, 0);
raf.tick( 75 );
raf.tick(75);
component.name = 'everybody';
assert.equal( div.foo, 0.75 );
assert.htmlEqual( div.innerHTML, 'hello everybody!' );
assert.equal(div.foo, 0.75);
assert.htmlEqual(div.innerHTML, 'hello everybody!');
component.visible = false;
component.name = 'again';
assert.htmlEqual( div.innerHTML, 'hello everybody!' );
assert.htmlEqual(div.innerHTML, 'hello everybody!');
raf.tick( 125 );
assert.equal( div.foo, 0.25 );
raf.tick(125);
assert.equal(div.foo, 0.25);
component.visible = true;
raf.tick( 175 );
assert.equal( div.foo, 0.75 );
assert.htmlEqual( div.innerHTML, 'hello again!' );
raf.tick(175);
assert.equal(div.foo, 0.75);
assert.htmlEqual(div.innerHTML, 'hello again!');
raf.tick( 200 );
assert.equal( div.foo, 1 );
raf.tick(200);
assert.equal(div.foo, 1);
raf.tick( 225 );
component.destroy();
raf.tick(225);
}
};

@ -4,40 +4,38 @@ export default {
things: [ 'a', 'b', 'c' ]
},
test ( assert, component, target, window, raf ) {
test(assert, component, target, window, raf) {
component.visible = true;
const divs = target.querySelectorAll( 'div' );
assert.equal( divs[0].foo, 0 );
assert.equal( divs[1].foo, 0 );
assert.equal( divs[2].foo, 0 );
const divs = target.querySelectorAll('div');
assert.equal(divs[0].foo, 0);
assert.equal(divs[1].foo, 0);
assert.equal(divs[2].foo, 0);
raf.tick( 50 );
assert.equal( divs[0].foo, 0.5 );
assert.equal( divs[1].foo, 0.5 );
assert.equal( divs[2].foo, 0.5 );
raf.tick(50);
assert.equal(divs[0].foo, 0.5);
assert.equal(divs[1].foo, 0.5);
assert.equal(divs[2].foo, 0.5);
component.visible = false;
raf.tick( 70 );
assert.equal( divs[0].foo, 0.7 );
assert.equal( divs[1].foo, 0.7 );
assert.equal( divs[2].foo, 0.7 );
raf.tick(70);
assert.equal(divs[0].foo, 0.7);
assert.equal(divs[1].foo, 0.7);
assert.equal(divs[2].foo, 0.7);
assert.equal( divs[0].bar, 0.8 );
assert.equal( divs[1].bar, 0.8 );
assert.equal( divs[2].bar, 0.8 );
assert.equal(divs[0].bar, 0.8);
assert.equal(divs[1].bar, 0.8);
assert.equal(divs[2].bar, 0.8);
component.visible = true;
raf.tick( 100 );
assert.equal( divs[0].foo, 0.3 );
assert.equal( divs[1].foo, 0.3 );
assert.equal( divs[2].foo, 0.3 );
raf.tick(100);
assert.equal(divs[0].foo, 0.3);
assert.equal(divs[1].foo, 0.3);
assert.equal(divs[2].foo, 0.3);
assert.equal( divs[0].bar, 1 );
assert.equal( divs[1].bar, 1 );
assert.equal( divs[2].bar, 1 );
component.destroy();
assert.equal(divs[0].bar, 1);
assert.equal(divs[1].bar, 1);
assert.equal(divs[2].bar, 1);
}
};

@ -3,30 +3,28 @@ export default {
things: [ 'a', 'b', 'c' ]
},
test ( assert, component, target, window, raf ) {
let divs = target.querySelectorAll( 'div' );
assert.equal( divs[0].foo, 0 );
assert.equal( divs[1].foo, 0 );
assert.equal( divs[2].foo, 0 );
test(assert, component, target, window, raf) {
let divs = target.querySelectorAll('div');
assert.equal(divs[0].foo, 0);
assert.equal(divs[1].foo, 0);
assert.equal(divs[2].foo, 0);
raf.tick( 50 );
assert.equal( divs[0].foo, 0.5 );
assert.equal( divs[1].foo, 0.5 );
assert.equal( divs[2].foo, 0.5 );
raf.tick(50);
assert.equal(divs[0].foo, 0.5);
assert.equal(divs[1].foo, 0.5);
assert.equal(divs[2].foo, 0.5);
component.things = [ 'a', 'b', 'c', 'd' ];
divs = target.querySelectorAll( 'div' );
assert.equal( divs[0].foo, 0.5 );
assert.equal( divs[1].foo, 0.5 );
assert.equal( divs[2].foo, 0.5 );
assert.equal( divs[3].foo, 0 );
divs = target.querySelectorAll('div');
assert.equal(divs[0].foo, 0.5);
assert.equal(divs[1].foo, 0.5);
assert.equal(divs[2].foo, 0.5);
assert.equal(divs[3].foo, 0);
raf.tick( 75 );
assert.equal( divs[0].foo, 0.75 );
assert.equal( divs[1].foo, 0.75 );
assert.equal( divs[2].foo, 0.75 );
assert.equal( divs[3].foo, 0.25 );
component.destroy();
raf.tick(75);
assert.equal(divs[0].foo, 0.75);
assert.equal(divs[1].foo, 0.75);
assert.equal(divs[2].foo, 0.75);
assert.equal(divs[3].foo, 0.25);
}
};

@ -7,16 +7,16 @@ export default {
]
},
test ( assert, component, target, window, raf ) {
let divs = target.querySelectorAll( 'div' );
assert.equal( divs[0].foo, 0 );
assert.equal( divs[1].foo, 0 );
assert.equal( divs[2].foo, 0 );
test(assert, component, target, window, raf) {
let divs = target.querySelectorAll('div');
assert.equal(divs[0].foo, 0);
assert.equal(divs[1].foo, 0);
assert.equal(divs[2].foo, 0);
raf.tick( 50 );
assert.equal( divs[0].foo, 0.5 );
assert.equal( divs[1].foo, 0.5 );
assert.equal( divs[2].foo, 0.5 );
raf.tick(50);
assert.equal(divs[0].foo, 0.5);
assert.equal(divs[1].foo, 0.5);
assert.equal(divs[2].foo, 0.5);
component.things = [
{ name: 'a' },
@ -24,24 +24,22 @@ export default {
{ name: 'b' },
{ name: 'c' }
];
assert.htmlEqual( target.innerHTML, `
assert.htmlEqual(target.innerHTML, `
<div>a</div>
<div>woo!</div>
<div>b</div>
<div>c</div>
` );
divs = target.querySelectorAll( 'div' );
assert.equal( divs[0].foo, 0.5 );
assert.equal( divs[1].foo, 0 );
assert.equal( divs[2].foo, 0.5 );
assert.equal( divs[3].foo, 0.5 );
`);
divs = target.querySelectorAll('div');
assert.equal(divs[0].foo, 0.5);
assert.equal(divs[1].foo, 0);
assert.equal(divs[2].foo, 0.5);
assert.equal(divs[3].foo, 0.5);
raf.tick( 75 );
assert.equal( divs[0].foo, 0.75 );
assert.equal( divs[1].foo, 0.25 );
assert.equal( divs[2].foo, 0.75 );
assert.equal( divs[3].foo, 0.75 );
component.destroy();
raf.tick(75);
assert.equal(divs[0].foo, 0.75);
assert.equal(divs[1].foo, 0.25);
assert.equal(divs[2].foo, 0.75);
assert.equal(divs[3].foo, 0.75);
}
};

@ -29,7 +29,5 @@ export default {
raf.tick(250);
assert.deepEqual(component.intros.sort(), ['a', 'a', 'b', 'b', 'c', 'c', 'd', 'd']);
assert.equal(component.introCount, 4);
component.destroy();
}
};

@ -1,30 +1,28 @@
export default {
test ( assert, component, target, window, raf ) {
test(assert, component, target, window, raf) {
global.count = 0;
component.visible = true;
assert.equal( global.count, 1 );
const div = target.querySelector( 'div' );
assert.equal( div.foo, 0 );
assert.equal(global.count, 1);
const div = target.querySelector('div');
assert.equal(div.foo, 0);
raf.tick( 300 );
assert.equal( div.foo, 0.75 );
raf.tick(300);
assert.equal(div.foo, 0.75);
component.visible = false;
assert.equal( global.count, 1 );
assert.equal(global.count, 1);
raf.tick( 500 );
assert.equal( div.foo, 0.25 );
raf.tick(500);
assert.equal(div.foo, 0.25);
component.visible = true;
raf.tick( 700 );
assert.equal( div.foo, 0.75 );
raf.tick(700);
assert.equal(div.foo, 0.75);
raf.tick( 800 );
assert.equal( div.foo, 1 );
raf.tick(800);
assert.equal(div.foo, 1);
raf.tick( 900 );
component.destroy();
raf.tick(900);
}
};

@ -12,21 +12,17 @@ export default {
<div>5</div>
`,
test ( assert, component, target, window, raf ) {
const divs = target.querySelectorAll('div');
test(assert, component, target, window, raf) {
raf.tick(100);
component.threshold = 4;
raf.tick( 200 );
raf.tick(200);
assert.htmlEqual(target.innerHTML, `
<div>1</div>
<div>2</div>
<div>3</div>
<div>4</div>
`);
component.destroy();
}
};

@ -12,7 +12,7 @@ export default {
<div>5</div>
`,
test ( assert, component, target, window, raf ) {
test(assert, component, target, window, raf) {
const divs = target.querySelectorAll('div');
raf.tick(100);
@ -31,7 +31,5 @@ export default {
<div>4</div>
<div>5</div>
`);
component.destroy();
}
};

@ -11,7 +11,7 @@ export default {
<div>5</div>
`,
test ( assert, component, target, window, raf ) {
test(assert, component, target, window, raf) {
const divs = target.querySelectorAll('div');
assert.equal(divs[0].foo, 0);
@ -20,9 +20,9 @@ export default {
assert.equal(divs[0].foo, 1);
component.threshold = 4;
assert.equal( divs[4].foo, 1 );
assert.equal(divs[4].foo, 1);
raf.tick( 200 );
raf.tick(200);
assert.htmlEqual(target.innerHTML, `
<div>1</div>
<div>2</div>
@ -31,15 +31,13 @@ export default {
`);
component.threshold = 3;
assert.equal( divs[3].foo, 1 );
assert.equal(divs[3].foo, 1);
raf.tick( 300 );
raf.tick(300);
assert.htmlEqual(target.innerHTML, `
<div>1</div>
<div>2</div>
<div>3</div>
`);
component.destroy();
}
};

@ -1,46 +1,44 @@
export default {
test ( assert, component, target, window, raf ) {
test(assert, component, target, window, raf) {
component.visible = true;
let div = target.querySelector( 'div' );
assert.equal( div.foo, 0 );
let div = target.querySelector('div');
assert.equal(div.foo, 0);
raf.tick( 200 );
assert.equal( div.foo, 0.5 );
raf.tick(200);
assert.equal(div.foo, 0.5);
raf.tick( 400 );
assert.equal( div.foo, 1 );
raf.tick(400);
assert.equal(div.foo, 1);
raf.tick( 500 );
assert.equal( div.foo, 1 );
raf.tick(500);
assert.equal(div.foo, 1);
component.visible = false;
raf.tick( 600 );
assert.equal( div.foo, 1 );
assert.equal( div.bar, 0.75 );
raf.tick(600);
assert.equal(div.foo, 1);
assert.equal(div.bar, 0.75);
raf.tick( 900 );
assert.equal( div.foo, 1 );
assert.equal( div.bar, 0 );
raf.tick(900);
assert.equal(div.foo, 1);
assert.equal(div.bar, 0);
// test outro before intro complete
raf.tick( 1000 );
raf.tick(1000);
component.visible = true;
div = target.querySelector( 'div' );
div = target.querySelector('div');
raf.tick( 1200 );
assert.equal( div.foo, 0.5 );
raf.tick(1200);
assert.equal(div.foo, 0.5);
component.visible = false;
raf.tick( 1300 );
assert.equal( div.foo, 0.75 );
assert.equal( div.bar, 0.75 );
raf.tick(1300);
assert.equal(div.foo, 0.75);
assert.equal(div.bar, 0.75);
raf.tick( 1400 );
assert.equal( div.foo, 1 );
assert.equal( div.bar, 0.5 );
raf.tick(1400);
assert.equal(div.foo, 1);
assert.equal(div.bar, 0.5);
raf.tick( 2000 );
component.destroy();
raf.tick(2000);
}
};

@ -1,17 +1,15 @@
export default {
test ( assert, component, target, window, raf ) {
test(assert, component, target, window, raf) {
component.visible = true;
const div = target.querySelector( 'div' );
assert.equal( window.getComputedStyle( div ).opacity, 0 );
const div = target.querySelector('div');
assert.equal(window.getComputedStyle(div).opacity, 0);
raf.tick( 200 );
assert.equal( window.getComputedStyle( div ).opacity, 0.5 );
raf.tick(200);
assert.equal(window.getComputedStyle(div).opacity, 0.5);
raf.tick( 400 );
assert.equal( window.getComputedStyle( div ).opacity, 1 );
raf.tick(400);
assert.equal(window.getComputedStyle(div).opacity, 1);
raf.tick( 500 );
component.destroy();
raf.tick(500);
}
};

@ -1,5 +1,5 @@
export default {
test ( assert, component, target, window, raf ) {
test(assert, component, target, window, raf) {
component.visible = true;
const div = target.querySelector('div');
@ -16,7 +16,5 @@ export default {
raf.tick(600);
assert.equal(component.refs.div, undefined);
assert.equal(target.querySelector('div'), undefined);
component.destroy();
}
};

@ -3,20 +3,19 @@ export default {
z: 'z'
},
test ( assert, component, target, window, raf ) {
assert.equal( target.querySelector( 'div' ), component.refs.no );
test(assert, component, target, window, raf) {
assert.equal(target.querySelector('div'), component.refs.no);
component.x = true;
raf.tick( 25 );
assert.equal( component.refs.yes.foo, undefined );
assert.equal( component.refs.no.foo, 0.75 );
raf.tick(25);
assert.equal(component.refs.yes.foo, undefined);
assert.equal(component.refs.no.foo, 0.75);
raf.tick( 75 );
assert.equal( component.refs.yes.foo, undefined );
assert.equal( component.refs.no.foo, 0.25 );
raf.tick(75);
assert.equal(component.refs.yes.foo, undefined);
assert.equal(component.refs.no.foo, 0.25);
raf.tick( 100 );
component.destroy();
raf.tick(100);
}
};

@ -1,21 +1,19 @@
export default {
test ( assert, component, target, window, raf ) {
assert.equal( target.querySelector( 'div' ), component.refs.no );
assert.equal( component.refs.no.foo, 0 );
test(assert, component, target, window, raf) {
assert.equal(target.querySelector('div'), component.refs.no);
assert.equal(component.refs.no.foo, 0);
raf.tick( 200 );
assert.equal( component.refs.no.foo, 0.5 );
raf.tick(200);
assert.equal(component.refs.no.foo, 0.5);
raf.tick( 500 );
raf.tick(500);
component.x = true;
assert.equal( component.refs.no, undefined );
assert.equal( component.refs.yes.foo, 0 );
assert.equal(component.refs.no, undefined);
assert.equal(component.refs.yes.foo, 0);
raf.tick( 700 );
assert.equal( component.refs.yes.foo, 0.5 );
raf.tick(700);
assert.equal(component.refs.yes.foo, 0.5);
raf.tick( 1000 );
component.destroy();
raf.tick(1000);
}
};

@ -1,18 +1,17 @@
export default {
test ( assert, component, target, window, raf ) {
assert.equal( target.querySelector( 'div' ), component.refs.no );
test(assert, component, target, window, raf) {
assert.equal(target.querySelector('div'), component.refs.no);
component.x = true;
raf.tick( 25 );
assert.equal( component.refs.yes.foo, undefined );
assert.equal( component.refs.no.foo, 0.75 );
raf.tick(25);
assert.equal(component.refs.yes.foo, undefined);
assert.equal(component.refs.no.foo, 0.75);
raf.tick( 75 );
assert.equal( component.refs.yes.foo, undefined );
assert.equal( component.refs.no.foo, 0.25 );
raf.tick(75);
assert.equal(component.refs.yes.foo, undefined);
assert.equal(component.refs.no.foo, 0.25);
raf.tick( 100 );
component.destroy();
raf.tick(100);
}
};

@ -4,21 +4,20 @@ export default {
y: true
},
test ( assert, component, target, window, raf ) {
assert.equal( target.querySelector( 'div' ), component.refs.no );
test(assert, component, target, window, raf) {
assert.equal(target.querySelector('div'), component.refs.no);
component.x = true;
component.y = false;
raf.tick( 25 );
assert.equal( component.refs.yes.foo, undefined );
assert.equal( component.refs.no.foo, 0.75 );
raf.tick(25);
assert.equal(component.refs.yes.foo, undefined);
assert.equal(component.refs.no.foo, 0.75);
raf.tick( 75 );
assert.equal( component.refs.yes.foo, undefined );
assert.equal( component.refs.no.foo, 0.25 );
raf.tick(75);
assert.equal(component.refs.yes.foo, undefined);
assert.equal(component.refs.no.foo, 0.25);
raf.tick( 100 );
component.destroy();
raf.tick(100);
}
};

@ -1,21 +1,19 @@
export default {
test ( assert, component, target, window, raf ) {
test(assert, component, target, window, raf) {
component.visible = true;
const div = target.querySelector( 'div' );
assert.equal( div.foo, 0 );
const div = target.querySelector('div');
assert.equal(div.foo, 0);
raf.tick( 50 );
assert.equal( div.foo, 0 );
raf.tick(50);
assert.equal(div.foo, 0);
raf.tick( 100 );
assert.equal( div.foo, 0.5 );
raf.tick(100);
assert.equal(div.foo, 0.5);
raf.tick( 125 );
assert.equal( div.foo, 0.75 );
raf.tick(125);
assert.equal(div.foo, 0.75);
raf.tick( 150 );
assert.equal( div.foo, 1 );
component.destroy();
raf.tick(150);
assert.equal(div.foo, 1);
}
};

@ -15,7 +15,5 @@ export default {
assert.equal(div.foo, 200);
raf.tick(101);
component.destroy();
},
};

@ -11,7 +11,5 @@ export default {
assert.equal(div.foo, 200);
raf.tick(101);
component.destroy();
},
};

@ -1,12 +1,10 @@
export default {
skip: true, // JSDOM
test ( assert, component, target, window ) {
assert.equal( window.pageYOffset, 0 );
test(assert, component, target, window) {
assert.equal(window.pageYOffset, 0);
component.scrollY = 100;
assert.equal( window.pageYOffset, 100 );
component.destroy();
assert.equal(window.pageYOffset, 100);
}
};

@ -5,20 +5,18 @@ export default {
html: `true`,
skip: /^v4/.test( process.version ), // node 4 apparently does some dumb stuff
skip: /^v4/.test(process.version), // node 4 apparently does some dumb stuff
'skip-ssr': true, // there's some kind of weird bug with this test... it compiles with the wrong require.extensions hook for some bizarre reason
test ( assert, component, target, window ) {
const event = new window.Event( 'click' );
test(assert, component, target, window) {
const event = new window.Event('click');
window.dispatchEvent( event );
assert.equal( component.foo, false );
assert.htmlEqual( target.innerHTML, `false` );
window.dispatchEvent(event);
assert.equal(component.foo, false);
assert.htmlEqual(target.innerHTML, `false`);
window.dispatchEvent( event );
assert.equal( component.foo, true );
assert.htmlEqual( target.innerHTML, `true` );
component.destroy();
window.dispatchEvent(event);
assert.equal(component.foo, true);
assert.htmlEqual(target.innerHTML, `true`);
}
};
Loading…
Cancel
Save