Merge pull request #297 from sveltejs/gh-290-a

[WIP] failing test for first bug in #290
pull/250/merge
Rich Harris 9 years ago committed by GitHub
commit b81107faf5

@ -24,6 +24,36 @@ export default {
addComponentAttributes( generator, node, local );
if ( local.allUsedContexts.size ) {
const contextNames = [...local.allUsedContexts];
const initialProps = contextNames.map( contextName => {
if ( contextName === 'root' ) return `root: root`;
const listName = generator.current.listNames[ contextName ];
const indexName = generator.current.indexNames[ contextName ];
return `${listName}: ${listName},\n${indexName}: ${indexName}`;
}).join( ',\n' );
const updates = contextNames.map( contextName => {
if ( contextName === 'root' ) return `${name}._context.root = root;`;
const listName = generator.current.listNames[ contextName ];
const indexName = generator.current.indexNames[ contextName ];
return `${name}._context.${listName} = ${listName};\n${name}._context.${indexName} = ${indexName};`;
}).join( '\n' );
local.init.addBlock( deindent`
${name}._context = {
${initialProps}
};
` );
local.update.addBlock( updates );
}
const componentInitProperties = [
`target: ${!isToplevel ? generator.current.target: 'null'}`,
'_root: component._root || component'

@ -94,12 +94,12 @@ export default function addComponentAttributes ( generator, node, local ) {
// TODO hoist event handlers? can do `this.__component.method(...)`
const declarations = [...usedContexts].map( name => {
if ( name === 'root' ) return 'var root = this.__svelte.root;';
if ( name === 'root' ) return 'var root = this._context.root;';
const listName = generator.current.listNames[ name ];
const indexName = generator.current.indexNames[ name ];
return `var ${listName} = this.__svelte.${listName}, ${indexName} = this.__svelte.${indexName}, ${name} = ${listName}[${indexName}]`;
return `var ${listName} = this._context.${listName}, ${indexName} = this._context.${indexName}, ${name} = ${listName}[${indexName}]`;
});
const handlerBody = ( declarations.length ? declarations.join( '\n' ) + '\n\n' : '' ) + `[✂${attribute.expression.start}-${attribute.expression.end}✂];`;

@ -0,0 +1 @@
<button on:click='fire("foo")'>click me</button>

@ -0,0 +1,27 @@
export default {
data: {
items: [ 'a', 'b', 'c' ]
},
html: `
<div><button>click me</button><button>click me</button><button>click me</button></div>
`,
test ( assert, component, target, window ) {
const buttons = target.querySelectorAll( 'button' );
const clicks = [];
component.on( 'foo', item => {
clicks.push( item );
});
const event = new window.MouseEvent( 'click' );
buttons[0].dispatchEvent( event );
buttons[2].dispatchEvent( event );
assert.deepEqual( clicks, [ 'a', 'c' ]);
component.teardown();
}
};

@ -0,0 +1,19 @@
<div>
{{#each items as item}}
<Widget on:foo='foo(item)'/>
{{/each}}
</div>
<script>
import Widget from './Widget.html';
export default {
components: { Widget },
methods: {
foo ( item ) {
this.fire( 'foo', item );
}
}
};
</script>
Loading…
Cancel
Save