more readable each block values

pull/862/head
Rich Harris 7 years ago
parent 75cf698885
commit 4f1d48c4a6

@ -425,13 +425,19 @@ export default class Generator {
getUniqueNameMaker(params: string[]) {
const localUsedNames = new Set(params);
function add(name: string) {
localUsedNames.add(name);
}
reservedNames.forEach(add);
this.importedNames.forEach(add);
return (name: string) => {
if (test) name = `${name}$`;
let alias = name;
for (
let i = 1;
reservedNames.has(alias) ||
this.importedNames.has(alias) ||
this.usedNames.has(alias) ||
localUsedNames.has(alias);
alias = `${name}_${i++}`

@ -6,6 +6,7 @@ import { walk } from 'estree-walker';
import deindent from '../../utils/deindent';
import { stringify, escape } from '../../utils/stringify';
import CodeBuilder from '../../utils/CodeBuilder';
import reservedNames from '../../utils/reservedNames';
import visit from './visit';
import shared from './shared';
import Generator from '../Generator';
@ -15,6 +16,8 @@ import Block from './Block';
import { version } from '../../../package.json';
import { Parsed, CompileOptions, Node } from '../../interfaces';
const test = typeof global !== 'undefined' && global.__svelte_test;
export class DomGenerator extends Generator {
blocks: (Block|string)[];
readonly: Set<string>;
@ -48,6 +51,33 @@ export class DomGenerator extends Generator {
// initial values for e.g. window.innerWidth, if there's a <:Window> meta tag
this.metaBindings = [];
}
getUniqueNameMaker(params: string[]) {
const localUsedNames = new Set(params);
function add(name: string) {
localUsedNames.add(name);
}
reservedNames.forEach(add);
this.importedNames.forEach(add);
for (const name in shared) {
localUsedNames.add(test ? `${name}$` : name);
}
return (name: string) => {
if (test) name = `${name}$`;
let alias = name;
for (
let i = 1;
this.usedNames.has(alias) ||
localUsedNames.has(alias);
alias = `${name}_${i++}`
);
localUsedNames.add(alias);
return alias;
};
}
}
export default function dom(

@ -206,7 +206,11 @@ const preprocessors = {
indexNames.set(node.context, indexName);
const listNames = new Map(block.listNames);
const listName = block.getUniqueName(`each_block_value`);
const listName = block.getUniqueName(
(node.expression.type === 'MemberExpression' && !node.expression.computed) ? node.expression.property.name :
node.expression.type === 'Identifier' ? node.expression.name :
`each_block_value`
);
listNames.set(node.context, listName);
const context = generator.getUniqueName(node.context);

@ -174,10 +174,10 @@ function capitalise(str) {
return str[0].toUpperCase() + str.slice(1);
}
export function showOutput(cwd, options = {}) {
export function showOutput(cwd, options = {}, s = svelte) {
glob.sync('**/*.html', { cwd }).forEach(file => {
if (file[0] === '_') return;
const { code } = svelte.compile(
const { code } = s.compile(
fs.readFileSync(`${cwd}/${file}`, 'utf-8'),
Object.assign(options, {
filename: file,

@ -203,12 +203,12 @@ var proto = {
function create_main_fragment(state, component) {
var text, p, text_1;
var each_block_value = state.comments;
var comments = state.comments;
var each_block_iterations = [];
for (var i = 0; i < each_block_value.length; i += 1) {
each_block_iterations[i] = create_each_block(state, each_block_value, each_block_value[i], i, component);
for (var i = 0; i < comments.length; i += 1) {
each_block_iterations[i] = create_each_block(state, comments, comments[i], i, component);
}
return {
@ -233,14 +233,14 @@ function create_main_fragment(state, component) {
},
update: function(changed, state) {
var each_block_value = state.comments;
var comments = state.comments;
if (changed.comments || changed.elapsed || changed.time) {
for (var i = 0; i < each_block_value.length; i += 1) {
for (var i = 0; i < comments.length; i += 1) {
if (each_block_iterations[i]) {
each_block_iterations[i].update(changed, state, each_block_value, each_block_value[i], i);
each_block_iterations[i].update(changed, state, comments, comments[i], i);
} else {
each_block_iterations[i] = create_each_block(state, each_block_value, each_block_value[i], i, component);
each_block_iterations[i] = create_each_block(state, comments, comments[i], i, component);
each_block_iterations[i].create();
each_block_iterations[i].mount(text.parentNode, text);
}
@ -250,7 +250,7 @@ function create_main_fragment(state, component) {
each_block_iterations[i].unmount();
each_block_iterations[i].destroy();
}
each_block_iterations.length = each_block_value.length;
each_block_iterations.length = comments.length;
}
if (changed.foo) {
@ -274,7 +274,7 @@ function create_main_fragment(state, component) {
}
// (1:0) {{#each comments as comment, i}}
function create_each_block(state, each_block_value, comment, i, component) {
function create_each_block(state, comments, comment, i, component) {
var div, strong, text, text_1, span, text_2_value = comment.author, text_2, text_3, text_4_value = state.elapsed(comment.time, state.time), text_4, text_5, text_6, raw_value = comment.html, raw_before;
return {
@ -313,7 +313,7 @@ function create_each_block(state, each_block_value, comment, i, component) {
raw_before.insertAdjacentHTML("afterend", raw_value);
},
update: function(changed, state, each_block_value, comment, i) {
update: function(changed, state, comments, comment, i) {
if ((changed.comments) && text_2_value !== (text_2_value = comment.author)) {
text_2.data = text_2_value;
}

@ -5,12 +5,12 @@ import { appendNode, assign, createElement, createText, destroyEach, detachAfter
function create_main_fragment(state, component) {
var text, p, text_1;
var each_block_value = state.comments;
var comments = state.comments;
var each_block_iterations = [];
for (var i = 0; i < each_block_value.length; i += 1) {
each_block_iterations[i] = create_each_block(state, each_block_value, each_block_value[i], i, component);
for (var i = 0; i < comments.length; i += 1) {
each_block_iterations[i] = create_each_block(state, comments, comments[i], i, component);
}
return {
@ -35,14 +35,14 @@ function create_main_fragment(state, component) {
},
update: function(changed, state) {
var each_block_value = state.comments;
var comments = state.comments;
if (changed.comments || changed.elapsed || changed.time) {
for (var i = 0; i < each_block_value.length; i += 1) {
for (var i = 0; i < comments.length; i += 1) {
if (each_block_iterations[i]) {
each_block_iterations[i].update(changed, state, each_block_value, each_block_value[i], i);
each_block_iterations[i].update(changed, state, comments, comments[i], i);
} else {
each_block_iterations[i] = create_each_block(state, each_block_value, each_block_value[i], i, component);
each_block_iterations[i] = create_each_block(state, comments, comments[i], i, component);
each_block_iterations[i].create();
each_block_iterations[i].mount(text.parentNode, text);
}
@ -52,7 +52,7 @@ function create_main_fragment(state, component) {
each_block_iterations[i].unmount();
each_block_iterations[i].destroy();
}
each_block_iterations.length = each_block_value.length;
each_block_iterations.length = comments.length;
}
if (changed.foo) {
@ -76,7 +76,7 @@ function create_main_fragment(state, component) {
}
// (1:0) {{#each comments as comment, i}}
function create_each_block(state, each_block_value, comment, i, component) {
function create_each_block(state, comments, comment, i, component) {
var div, strong, text, text_1, span, text_2_value = comment.author, text_2, text_3, text_4_value = state.elapsed(comment.time, state.time), text_4, text_5, text_6, raw_value = comment.html, raw_before;
return {
@ -115,7 +115,7 @@ function create_each_block(state, each_block_value, comment, i, component) {
raw_before.insertAdjacentHTML("afterend", raw_value);
},
update: function(changed, state, each_block_value, comment, i) {
update: function(changed, state, comments, comment, i) {
if ((changed.comments) && text_2_value !== (text_2_value = comment.author)) {
text_2.data = text_2_value;
}

@ -87,7 +87,7 @@ describe("runtime", () => {
}
} catch (err) {
failed.add(dir);
showOutput(cwd, { shared }); // eslint-disable-line no-console
showOutput(cwd, { shared }, svelte); // eslint-disable-line no-console
throw err;
}
}
@ -133,7 +133,7 @@ describe("runtime", () => {
try {
SvelteComponent = require(`./samples/${dir}/main.html`);
} catch (err) {
showOutput(cwd, { shared, hydratable: hydrate }); // eslint-disable-line no-console
showOutput(cwd, { shared, hydratable: hydrate }, svelte); // eslint-disable-line no-console
throw err;
}
@ -187,12 +187,12 @@ describe("runtime", () => {
config.error(assert, err);
} else {
failed.add(dir);
showOutput(cwd, { shared, hydratable: hydrate }); // eslint-disable-line no-console
showOutput(cwd, { shared, hydratable: hydrate }, svelte); // eslint-disable-line no-console
throw err;
}
}
if (config.show) showOutput(cwd, { shared, hydratable: hydrate });
if (config.show) showOutput(cwd, { shared, hydratable: hydrate }, svelte);
});
}

Loading…
Cancel
Save