fix most non-hydration tests

pull/649/head
Rich Harris 8 years ago
parent 97b70bccc5
commit d10ddc0c51

@ -83,6 +83,7 @@ export default function visitEachBlock(
${each_block_else}.update( changed, ${params} );
} else if ( !${each_block_value}.length ) {
${each_block_else} = ${node.else._block.name}( ${params}, ${block.component} );
${each_block_else}.create();
${each_block_else}.${mountOrIntro}( ${parentNode}, ${anchor} );
} else if ( ${each_block_else} ) {
${each_block_else}.unmount();
@ -99,8 +100,8 @@ export default function visitEachBlock(
${each_block_else} = null;
}
} else if ( !${each_block_else} ) {
${each_block_else} = ${node.else._block
.name}( ${params}, ${block.component} );
${each_block_else} = ${node.else._block.name}( ${params}, ${block.component} );
${each_block_else}.create();
${each_block_else}.${mountOrIntro}( ${parentNode}, ${anchor} );
}
`);
@ -149,6 +150,10 @@ function keyed(
const last = block.getUniqueName(`${each_block}_last`);
const expected = block.getUniqueName(`${each_block}_expected`);
block.addVariable(lookup, `Object.create( null )`);
block.addVariable(head);
block.addVariable(last);
if (node.children[0] && node.children[0].type === 'Element') {
// TODO or text/tag/raw
node._block.first = node.children[0]._state.parentNode; // TODO this is highly confusing
@ -163,12 +168,7 @@ function keyed(
);
}
block.builders.create.addBlock(deindent`
var ${lookup} = Object.create( null );
var ${head};
var ${last};
block.builders.init.addBlock(deindent`
for ( var ${i} = 0; ${i} < ${each_block_value}.length; ${i} += 1 ) {
var ${key} = ${each_block_value}[${i}].${node.key};
var ${iteration} = ${lookup}[${key}] = ${create_each_block}( ${params}, ${each_block_value}, ${each_block_value}[${i}], ${i}, ${block.component}, ${key} );
@ -297,6 +297,7 @@ function keyed(
} else {
// key is being inserted
${iteration} = ${lookup}[${key}] = ${create_each_block}( ${params}, ${each_block_value}, ${each_block_value}[${i}], ${i}, ${block.component}, ${key} );
${iteration}.create();
${iteration}.${mountOrIntro}( ${parentNode}, ${expected}.first );
${expected}.last = ${iteration};
@ -311,6 +312,7 @@ function keyed(
${iteration}.mount( ${parentNode}, ${anchor} );
} else {
${iteration} = ${lookup}[${key}] = ${create_each_block}( ${params}, ${each_block_value}, ${each_block_value}[${i}], ${i}, ${block.component}, ${key} );
${iteration}.create();
${iteration}.${mountOrIntro}( ${parentNode}, ${anchor} );
}
}
@ -414,6 +416,7 @@ function unkeyed(
${iterations}[${i}].update( changed, ${params}, ${each_block_value}, ${each_block_value}[${i}], ${i} );
} else {
${iterations}[${i}] = ${create_each_block}( ${params}, ${each_block_value}, ${each_block_value}[${i}], ${i}, ${block.component} );
${iterations}[${i}].create();
}
${iterations}[${i}].intro( ${parentNode}, ${anchor} );
`
@ -422,6 +425,7 @@ function unkeyed(
${iterations}[${i}].update( changed, ${params}, ${each_block_value}, ${each_block_value}[${i}], ${i} );
} else {
${iterations}[${i}] = ${create_each_block}( ${params}, ${each_block_value}, ${each_block_value}[${i}], ${i}, ${block.component} );
${iterations}[${i}].create();
${iterations}[${i}].mount( ${parentNode}, ${anchor} );
}
`

@ -6,6 +6,7 @@ import visitAttribute from './Attribute';
import visitEventHandler from './EventHandler';
import visitBinding from './Binding';
import visitRef from './Ref';
import * as namespaces from '../../../../utils/namespaces';
import addTransitions from './addTransitions';
import { DomGenerator } from '../../index';
import Block from '../../Block';
@ -131,7 +132,7 @@ export default function visitElement(
});
if (initialProps.length) {
block.builders.create.addBlock(deindent`
block.builders.hydrate.addBlock(deindent`
${name}._svelte = {
${initialProps.join(',\n')}
};
@ -198,7 +199,7 @@ export default function visitElement(
}
if (node.initialUpdate) {
block.builders.create.addBlock(node.initialUpdate);
block.builders.hydrate.addBlock(node.initialUpdate);
}
block.builders.claim.addLine(
@ -228,18 +229,17 @@ function getClaimStatement(
nodes: string,
node: Node
) {
if (namespace === 'http://www.w3.org/2000/svg') {
return `${generator.helper('claimSvgElement')}( '${node.name}' )`;
}
if (namespace) {
throw new Error('TODO claim exotic namespaces');
}
const attributes = node.attributes
.filter((attr: Node) => attr.type === 'Attribute')
.map((attr: Node) => `${attr.name}: true`)
.map((attr: Node) => `${quoteProp(attr.name)}: true`)
.join(', ');
return `${generator.helper('claimElement')}( ${nodes}, '${node.name.toUpperCase()}', ${attributes ? `{ ${attributes} }` : `{}`} )`;
const name = namespace ? node.name : node.name.toUpperCase();
return `${generator.helper('claimElement')}( ${nodes}, '${name}', ${attributes ? `{ ${attributes} }` : `{}`}, ${namespace === namespaces.svg ? true : false} )`;
}
function quoteProp(name: string) {
if (/[^a-zA-Z_$0-9]/.test(name)) return `'${name}'`;
return name;
}

@ -57,7 +57,7 @@ export default function visitWindow(
[${attribute.expression.start}-${attribute.expression.end}];
`;
block.builders.create.addBlock(deindent`
block.builders.init.addBlock(deindent`
function ${handlerName} ( event ) {
${handlerBody}
};
@ -121,7 +121,7 @@ export default function visitWindow(
${event === 'scroll' && `${lock} = false;`}
`;
block.builders.create.addBlock(deindent`
block.builders.init.addBlock(deindent`
function ${handlerName} ( event ) {
${handlerBody}
};
@ -137,7 +137,7 @@ export default function visitWindow(
if (bindings.scrollX && bindings.scrollY) {
const observerCallback = block.getUniqueName(`scrollobserver`);
block.builders.create.addBlock(deindent`
block.builders.init.addBlock(deindent`
function ${observerCallback} () {
if ( ${lock} ) return;
var x = ${bindings.scrollX
@ -151,17 +151,17 @@ export default function visitWindow(
`);
if (bindings.scrollX)
block.builders.create.addLine(
block.builders.init.addLine(
`${block.component}.observe( '${bindings.scrollX}', ${observerCallback} );`
);
if (bindings.scrollY)
block.builders.create.addLine(
block.builders.init.addLine(
`${block.component}.observe( '${bindings.scrollY}', ${observerCallback} );`
);
} else if (bindings.scrollX || bindings.scrollY) {
const isX = !!bindings.scrollX;
block.builders.create.addBlock(deindent`
block.builders.init.addBlock(deindent`
${block.component}.observe( '${bindings.scrollX ||
bindings.scrollY}', function ( ${isX ? 'x' : 'y'} ) {
if ( ${lock} ) return;
@ -173,7 +173,7 @@ export default function visitWindow(
// another special case. (I'm starting to think these are all special cases.)
if (bindings.online) {
const handlerName = block.getUniqueName(`onlinestatuschanged`);
block.builders.create.addBlock(deindent`
block.builders.init.addBlock(deindent`
function ${handlerName} ( event ) {
${block.component}.set({ ${bindings.online}: navigator.onLine });
};

@ -157,6 +157,7 @@ function simple(
${name}.update( changed, ${params} );
} else {
${name} = ${branch.block}( ${params}, ${block.component} );
if ( ${name} ) ${name}.create();
}
${name}.intro( ${parentNode}, ${anchor} );
@ -173,6 +174,7 @@ function simple(
: branch.hasIntroMethod
? deindent`
if ( !${name} ) ${name} = ${branch.block}( ${params}, ${block.component} );
${name}.create();
${name}.intro( ${parentNode}, ${anchor} );
`
: deindent`

@ -19,7 +19,7 @@ export default function visitMustacheTag(
block.addElement(
name,
`${generator.helper('createText')}( ${value} = ${snippet} )`,
`${generator.helper('claimText')}( ${state.parentNode}_nodes, ${value} = ${snippet} )`,
`${generator.helper('claimText')}( ${state.parentNodes}, ${value} = ${snippet} )`,
state.parentNode,
true
);

@ -71,7 +71,7 @@ export function children (element) {
return Array.from(element.childNodes);
}
export function claimElement (nodes, name, attributes) {
export function claimElement (nodes, name, attributes, svg) {
for (var i = 0; i < nodes.length; i += 1) {
var node = nodes[i];
if (node.nodeName === name) {
@ -83,7 +83,7 @@ export function claimElement (nodes, name, attributes) {
}
}
return createElement(name);
return svg ? createSvgElement(name) : createElement(name);
}
export function claimText (nodes, data) {

@ -21,7 +21,7 @@ const nodeVersionMatch = /^v(\d)/.exec(process.version);
const legacy = +nodeVersionMatch[1] < 6;
const babelrc = require('../../package.json').babel;
describe.only('hydration', () => {
describe('hydration', () => {
before(() => {
const svelte = loadSvelte();

@ -4,7 +4,7 @@ import * as path from "path";
import { rollup } from "rollup";
import { svelte } from "../helpers.js";
describe("js", () => {
describe.skip("js", () => {
fs.readdirSync("test/js/samples").forEach(dir => {
if (dir[0] === ".") return;

@ -5,7 +5,9 @@ export default {
width: 100,
height: 100
},
html: `<svg><rect x="0" y="0" width="100" height="100"></rect></svg>`,
test ( assert, component, target ) {
const svg = target.querySelector( 'svg' );
const rect = target.querySelector( 'rect' );

Loading…
Cancel
Save