dev warnings for bad arguments to component.observe (#369), and component.on("teardown") (#365)

pull/378/head
Rich Harris 8 years ago
parent a801e1843b
commit 06f89d1d96

@ -6,7 +6,6 @@ import processCss from '../shared/processCss.js';
import visitors from './visitors/index.js'; import visitors from './visitors/index.js';
import Generator from '../Generator.js'; import Generator from '../Generator.js';
import * as shared from '../../shared/index.js'; import * as shared from '../../shared/index.js';
import devHelperLookup from './utils/devHelperLookup.js';
class DomGenerator extends Generator { class DomGenerator extends Generator {
constructor ( parsed, source, name, names, visitors, options ) { constructor ( parsed, source, name, names, visitors, options ) {
@ -133,9 +132,10 @@ class DomGenerator extends Generator {
} }
helper ( name ) { helper ( name ) {
if ( this.options.dev && devHelperLookup[ name ] ) { if ( this.options.dev && `${name}Dev` in shared ) {
name = devHelperLookup[ name ]; name = `${name}Dev`;
} }
this.uses[ name ] = true; this.uses[ name ] = true;
if ( !( name in this.aliases ) ) { if ( !( name in this.aliases ) ) {
@ -373,7 +373,7 @@ export default function dom ( parsed, source, options, names ) {
if ( sharedPath ) { if ( sharedPath ) {
builders.main.addLine( `${name}.prototype.${methodName} = ${generator.helper( methodName )};` ); builders.main.addLine( `${name}.prototype.${methodName} = ${generator.helper( methodName )};` );
} else { } else {
const fn = shared[ options.dev && devHelperLookup[ methodName ] ? devHelperLookup[ methodName ] : methodName ]; // eslint-disable-line import/namespace const fn = shared[ options.dev && `${methodName}Dev` in shared ? `${methodName}Dev` : methodName ]; // eslint-disable-line import/namespace
builders.main.addLine( `${name}.prototype.${methodName} = ${fn};` ); builders.main.addLine( `${name}.prototype.${methodName} = ${fn};` );
} }
}); });
@ -385,7 +385,7 @@ export default function dom ( parsed, source, options, names ) {
}; };
${name}.prototype.teardown = ${name}.prototype.destroy = function destroy ( detach ) { ${name}.prototype.teardown = ${name}.prototype.destroy = function destroy ( detach ) {
this.fire( 'teardown' );${templateProperties.ondestroy ? `\ntemplate.ondestroy.call( this );` : ``} this.fire( 'destroy' );${templateProperties.ondestroy ? `\ntemplate.ondestroy.call( this );` : ``}
this._fragment.teardown( detach !== false ); this._fragment.teardown( detach !== false );
this._fragment = null; this._fragment = null;

@ -30,7 +30,53 @@ export function observe ( key, callback, options ) {
}; };
} }
export function observeDev ( key, callback, options ) {
var c = ( key = '' + key ).search( /[^\w]/ );
if ( c > -1 ) {
var message = "The first argument to component.observe(...) must be the name of a top-level property";
if ( c > 0 ) message += ", i.e. '" + key.slice( 0, c ) + "' rather than '" + key + "'";
throw new Error( message );
}
var group = ( options && options.defer ) ? this._observers.pre : this._observers.post;
( group[ key ] || ( group[ key ] = [] ) ).push( callback );
if ( !options || options.init !== false ) {
callback.__calling = true;
callback.call( this, this._state[ key ] );
callback.__calling = false;
}
return {
cancel: function () {
var index = group[ key ].indexOf( callback );
if ( ~index ) group[ key ].splice( index, 1 );
}
};
}
export function on ( eventName, handler ) { export function on ( eventName, handler ) {
if ( eventName === 'teardown' ) return this.on( 'destroy', handler );
var handlers = this._handlers[ eventName ] || ( this._handlers[ eventName ] = [] );
handlers.push( handler );
return {
cancel: function () {
var index = handlers.indexOf( handler );
if ( ~index ) handlers.splice( index, 1 );
}
};
}
export function onDev ( eventName, handler ) {
if ( eventName === 'teardown' ) {
console.warn( "Use component.on('destroy', ...) instead of component.on('teardown', ...) which has been deprecated and will be unsupported in Svelte 2" );
return this.on( 'destroy', handler );
}
var handlers = this._handlers[ eventName ] || ( this._handlers[ eventName ] = [] ); var handlers = this._handlers[ eventName ] || ( this._handlers[ eventName ] = [] );
handlers.push( handler ); handlers.push( handler );

@ -96,18 +96,21 @@ describe( 'generate', () => {
// Put the constructor on window for testing // Put the constructor on window for testing
window.SvelteComponent = SvelteComponent; window.SvelteComponent = SvelteComponent;
const target = window.document.querySelector( 'main' );
const warnings = []; const warnings = [];
window.console.warn = warning => { const warn = console.warn;
console.warn = warning => {
warnings.push( warning ); warnings.push( warning );
}; };
const target = window.document.querySelector( 'main' );
const component = new SvelteComponent({ const component = new SvelteComponent({
target, target,
data: config.data data: config.data
}); });
console.warn = warn;
if ( config.error ) { if ( config.error ) {
unintendedError = true; unintendedError = true;
throw new Error( 'Expected a runtime error' ); throw new Error( 'Expected a runtime error' );

@ -2,6 +2,6 @@ export default {
dev: true, dev: true,
error ( assert, err ) { error ( assert, err ) {
assert.equal( err.message, `The fisrt argument to component.observe(...) must be the name of a top-level property, i.e. 'nested' rather than 'nested.data'` ); assert.equal( err.message, `The first argument to component.observe(...) must be the name of a top-level property, i.e. 'nested' rather than 'nested.data'` );
} }
}; };

@ -2,6 +2,6 @@ export default {
dev: true, dev: true,
warnings: [ warnings: [
`Use component.on('destroy', ...) instead of component.on('teardown', ...) which has been deprecated` `Use component.on('destroy', ...) instead of component.on('teardown', ...) which has been deprecated and will be unsupported in Svelte 2`
] ]
}; };

@ -2,7 +2,7 @@ export default {
test ( assert, component ) { test ( assert, component ) {
let count = 0; let count = 0;
component.on( 'teardown', function () { component.on( 'destroy', function () {
assert.equal( this, component ); assert.equal( this, component );
count += 1; count += 1;
}); });

Loading…
Cancel
Save