diff --git a/site/src/components/Repl/Output/ReplProxy.js b/site/src/components/Repl/Output/ReplProxy.js index 7ae56e35b7..5988c20f19 100644 --- a/site/src/components/Repl/Output/ReplProxy.js +++ b/site/src/components/Repl/Output/ReplProxy.js @@ -15,7 +15,7 @@ export default class ReplProxy { } iframeCommand(command, args) { - return new Promise( (resolve, reject) => { + return new Promise((resolve, reject) => { this.cmdId += 1; this.pendingCmds.set(this.cmdId, { resolve, reject }); @@ -23,7 +23,7 @@ export default class ReplProxy { action: command, cmdId: this.cmdId, args - }, '*') + }, '*'); }); } diff --git a/src/compile/Component.ts b/src/compile/Component.ts index 8a6b17f96c..656b004403 100644 --- a/src/compile/Component.ts +++ b/src/compile/Component.ts @@ -3,8 +3,8 @@ import { walk, childKeys } from 'estree-walker'; import { getLocator } from 'locate-character'; import Stats from '../Stats'; import { globals, reserved } from '../utils/names'; -import { namespaces, validNamespaces } from '../utils/namespaces'; -import wrapModule from './wrapModule'; +import { namespaces, valid_namespaces } from '../utils/namespaces'; +import create_module from './create_module'; import { create_scopes, extract_names, Scope } from './utils/scope'; import Stylesheet from './css/Stylesheet'; import { test } from '../config'; @@ -70,13 +70,13 @@ export default class Component { source: string; code: MagicString; name: string; - compileOptions: CompileOptions; + compile_options: CompileOptions; fragment: Fragment; module_scope: Scope; instance_scope: Scope; instance_scope_map: WeakMap; - componentOptions: ComponentOptions; + component_options: ComponentOptions; namespace: string; tag: string; accessors: boolean; @@ -98,7 +98,7 @@ export default class Component { injected_reactive_declaration_vars: Set = new Set(); helpers: Set = new Set(); - indirectDependencies: Map> = new Map(); + indirect_dependencies: Map> = new Map(); file: string; locate: (c: number) => { line: number, column: number }; @@ -112,13 +112,13 @@ export default class Component { stylesheet: Stylesheet; aliases: Map = new Map(); - usedNames: Set = new Set(); + used_names: Set = new Set(); constructor( ast: Ast, source: string, name: string, - compileOptions: CompileOptions, + compile_options: CompileOptions, stats: Stats, warnings: Warning[] ) { @@ -128,24 +128,24 @@ export default class Component { this.warnings = warnings; this.ast = ast; this.source = source; - this.compileOptions = compileOptions; + this.compile_options = compile_options; - this.file = compileOptions.filename && ( - typeof process !== 'undefined' ? compileOptions.filename.replace(process.cwd(), '').replace(/^[\/\\]/, '') : compileOptions.filename + this.file = compile_options.filename && ( + typeof process !== 'undefined' ? compile_options.filename.replace(process.cwd(), '').replace(/^[\/\\]/, '') : compile_options.filename ); this.locate = getLocator(this.source); this.code = new MagicString(source); // styles - this.stylesheet = new Stylesheet(source, ast, compileOptions.filename, compileOptions.dev); + this.stylesheet = new Stylesheet(source, ast, compile_options.filename, compile_options.dev); this.stylesheet.validate(this); - this.componentOptions = process_component_options(this, this.ast.html.children); - this.namespace = namespaces[this.componentOptions.namespace] || this.componentOptions.namespace; + this.component_options = process_component_options(this, this.ast.html.children); + this.namespace = namespaces[this.component_options.namespace] || this.component_options.namespace; - if (compileOptions.customElement) { - this.tag = this.componentOptions.tag || compileOptions.tag; + if (compile_options.customElement) { + this.tag = this.component_options.tag || compile_options.tag; if (!this.tag) { throw new Error(`Cannot compile to a custom element without specifying a tag name via options.tag or `); } @@ -157,11 +157,11 @@ export default class Component { this.walk_instance_js_pre_template(); this.fragment = new Fragment(this, ast.html); - this.name = this.getUniqueName(name); + this.name = this.get_unique_name(name); this.walk_instance_js_post_template(); - if (!compileOptions.customElement) this.stylesheet.reify(); + if (!compile_options.customElement) this.stylesheet.reify(); this.stylesheet.warnOnUnusedSelectors(this); } @@ -197,11 +197,11 @@ export default class Component { const variable = this.var_lookup.get(subscribable_name); if (variable) variable.subscribable = true; } else { - this.usedNames.add(name); + this.used_names.add(name); } } - addSourcemapLocations(node: Node) { + add_sourcemap_locations(node: Node) { walk(node, { enter: (node: Node) => { this.code.addSourcemapLocation(node.start); @@ -212,7 +212,7 @@ export default class Component { alias(name: string) { if (!this.aliases.has(name)) { - this.aliases.set(name, this.getUniqueName(name)); + this.aliases.set(name, this.get_unique_name(name)); } return this.aliases.get(name); @@ -228,17 +228,17 @@ export default class Component { let css = null; if (result) { - const { compileOptions, name } = this; - const { format = 'esm' } = compileOptions; + const { compile_options, name } = this; + const { format = 'esm' } = compile_options; const banner = `/* ${this.file ? `${this.file} ` : ``}generated by Svelte v${"__VERSION__"} */`; result = result .replace(/__svelte:self__/g, this.name) - .replace(compileOptions.generate === 'ssr' ? /(@+|#+)(\w*(?:-\w*)?)/g : /(@+)(\w*(?:-\w*)?)/g, (match: string, sigil: string, name: string) => { + .replace(compile_options.generate === 'ssr' ? /(@+|#+)(\w*(?:-\w*)?)/g : /(@+)(\w*(?:-\w*)?)/g, (match: string, sigil: string, name: string) => { if (sigil === '@') { if (internal_exports.has(name)) { - if (compileOptions.dev && internal_exports.has(`${name}Dev`)) name = `${name}Dev`; + if (compile_options.dev && internal_exports.has(`${name}Dev`)) name = `${name}Dev`; this.helpers.add(name); } @@ -248,21 +248,20 @@ export default class Component { return sigil.slice(1) + name; }); - const importedHelpers = Array.from(this.helpers) + const imported_helpers = Array.from(this.helpers) .sort() .map(name => { const alias = this.alias(name); return { name, alias }; }); - const module = wrapModule( + const module = create_module( result, format, name, - compileOptions, banner, - compileOptions.sveltePath, - importedHelpers, + compile_options.sveltePath, + imported_helpers, this.imports, this.vars.filter(variable => variable.module && variable.export_name).map(variable => ({ name: variable.name, @@ -272,17 +271,17 @@ export default class Component { ); const parts = module.split('✂]'); - const finalChunk = parts.pop(); + const final_chunk = parts.pop(); const compiled = new Bundle({ separator: '' }); - function addString(str: string) { + function add_string(str: string) { compiled.addSource({ content: new MagicString(str), }); } - const { filename } = compileOptions; + const { filename } = compile_options; // special case — the source file doesn't actually get used anywhere. we need // to add an empty file to populate map.sources and map.sourcesContent @@ -297,7 +296,7 @@ export default class Component { parts.forEach((str: string) => { const chunk = str.replace(pattern, ''); - if (chunk) addString(chunk); + if (chunk) add_string(chunk); const match = pattern.exec(str); @@ -309,17 +308,17 @@ export default class Component { }); }); - addString(finalChunk); + add_string(final_chunk); - css = compileOptions.customElement ? + css = compile_options.customElement ? { code: null, map: null } : - this.stylesheet.render(compileOptions.cssOutputFilename, true); + this.stylesheet.render(compile_options.cssOutputFilename, true); js = { code: compiled.toString(), map: compiled.generateMap({ includeContent: true, - file: compileOptions.outputFilename, + file: compile_options.outputFilename, }) }; } @@ -343,25 +342,25 @@ export default class Component { }; } - getUniqueName(name: string) { + get_unique_name(name: string) { if (test) name = `${name}$`; let alias = name; for ( let i = 1; reserved.has(alias) || this.var_lookup.has(alias) || - this.usedNames.has(alias); + this.used_names.has(alias); alias = `${name}_${i++}` ); - this.usedNames.add(alias); + this.used_names.add(alias); return alias; } - getUniqueNameMaker() { - const localUsedNames = new Set(); + get_unique_name_maker() { + const local_used_names = new Set(); function add(name: string) { - localUsedNames.add(name); + local_used_names.add(name); } reserved.forEach(add); @@ -373,11 +372,11 @@ export default class Component { let alias = name; for ( let i = 1; - this.usedNames.has(alias) || - localUsedNames.has(alias); + this.used_names.has(alias) || + local_used_names.has(alias); alias = `${name}_${i++}` ); - localUsedNames.add(alias); + local_used_names.add(alias); return alias; }; } @@ -398,7 +397,7 @@ export default class Component { source: this.source, start: pos.start, end: pos.end, - filename: this.compileOptions.filename + filename: this.compile_options.filename }); } @@ -428,7 +427,7 @@ export default class Component { start, end, pos: pos.start, - filename: this.compileOptions.filename, + filename: this.compile_options.filename, toString: () => `${warning.message} (${start.line + 1}:${start.column})\n${frame}`, }); } @@ -536,7 +535,7 @@ export default class Component { const script = this.ast.module; if (!script) return; - this.addSourcemapLocations(script.content); + this.add_sourcemap_locations(script.content); let { scope, globals } = create_scopes(script.content); this.module_scope = scope; @@ -581,7 +580,7 @@ export default class Component { const script = this.ast.instance; if (!script) return; - this.addSourcemapLocations(script.content); + this.add_sourcemap_locations(script.content); // inject vars for reactive declarations script.content.body.forEach(node => { @@ -759,7 +758,7 @@ export default class Component { rewrite_props(get_insert: (variable: Var) => string) { const component = this; - const { code, instance_scope, instance_scope_map: map, componentOptions } = this; + const { code, instance_scope, instance_scope_map: map, component_options } = this; let scope = instance_scope; const coalesced_declarations = []; @@ -1189,11 +1188,11 @@ export default class Component { } function process_component_options(component: Component, nodes) { - const componentOptions: ComponentOptions = { - immutable: component.compileOptions.immutable || false, - accessors: 'accessors' in component.compileOptions - ? component.compileOptions.accessors - : !!component.compileOptions.customElement + const component_options: ComponentOptions = { + immutable: component.compile_options.immutable || false, + accessors: 'accessors' in component.compile_options + ? component.compile_options.accessors + : !!component.compile_options.customElement }; const node = nodes.find(node => node.name === 'svelte:options'); @@ -1237,7 +1236,7 @@ function process_component_options(component: Component, nodes) { }); } - componentOptions.tag = tag; + component_options.tag = tag; break; } @@ -1248,8 +1247,8 @@ function process_component_options(component: Component, nodes) { if (typeof ns !== 'string') component.error(attribute, { code, message }); - if (validNamespaces.indexOf(ns) === -1) { - const match = fuzzymatch(ns, validNamespaces); + if (valid_namespaces.indexOf(ns) === -1) { + const match = fuzzymatch(ns, valid_namespaces); if (match) { component.error(attribute, { code: `invalid-namespace-property`, @@ -1263,7 +1262,7 @@ function process_component_options(component: Component, nodes) { } } - componentOptions.namespace = ns; + component_options.namespace = ns; break; } @@ -1275,7 +1274,7 @@ function process_component_options(component: Component, nodes) { if (typeof value !== 'boolean') component.error(attribute, { code, message }); - componentOptions[name] = value; + component_options[name] = value; break; default: @@ -1295,5 +1294,5 @@ function process_component_options(component: Component, nodes) { }); } - return componentOptions; + return component_options; } diff --git a/src/compile/wrapModule.ts b/src/compile/create_module.ts similarity index 69% rename from src/compile/wrapModule.ts rename to src/compile/create_module.ts index 746b25cbcc..ae5232021d 100644 --- a/src/compile/wrapModule.ts +++ b/src/compile/create_module.ts @@ -1,14 +1,8 @@ import deindent from './utils/deindent'; import list from '../utils/list'; -import { CompileOptions, ModuleFormat, Node } from '../interfaces'; +import { ModuleFormat, Node } from '../interfaces'; import { stringify_props } from './utils/stringify_props'; -interface Dependency { - name: string; - statements: string[]; - source: string; -} - const wrappers = { esm, cjs }; type Export = { @@ -16,11 +10,10 @@ type Export = { as: string; }; -export default function wrapModule( +export default function create_module( code: string, format: ModuleFormat, name: string, - options: CompileOptions, banner: string, sveltePath = 'svelte', helpers: { name: string, alias: string }[], @@ -28,18 +21,18 @@ export default function wrapModule( module_exports: Export[], source: string ): string { - const internalPath = `${sveltePath}/internal`; + const internal_path = `${sveltePath}/internal`; if (format === 'esm') { - return esm(code, name, options, banner, sveltePath, internalPath, helpers, imports, module_exports, source); + return esm(code, name, banner, sveltePath, internal_path, helpers, imports, module_exports, source); } - if (format === 'cjs') return cjs(code, name, banner, sveltePath, internalPath, helpers, imports, module_exports); + if (format === 'cjs') return cjs(code, name, banner, sveltePath, internal_path, helpers, imports, module_exports); throw new Error(`options.format is invalid (must be ${list(Object.keys(wrappers))})`); } -function editSource(source, sveltePath) { +function edit_source(source, sveltePath) { return source === 'svelte' || source.startsWith('svelte/') ? source.replace('svelte', sveltePath) : source; @@ -48,23 +41,22 @@ function editSource(source, sveltePath) { function esm( code: string, name: string, - options: CompileOptions, banner: string, sveltePath: string, - internalPath: string, + internal_path: string, helpers: { name: string, alias: string }[], imports: Node[], module_exports: Export[], source: string ) { - const importHelpers = helpers.length > 0 && ( - `import ${stringify_props(helpers.map(h => h.name === h.alias ? h.name : `${h.name} as ${h.alias}`).sort())} from ${JSON.stringify(internalPath)};` + const internal_imports = helpers.length > 0 && ( + `import ${stringify_props(helpers.map(h => h.name === h.alias ? h.name : `${h.name} as ${h.alias}`).sort())} from ${JSON.stringify(internal_path)};` ); - const importBlock = imports.length > 0 && ( + const user_imports = imports.length > 0 && ( imports .map((declaration: Node) => { - const import_source = editSource(declaration.source.value, sveltePath); + const import_source = edit_source(declaration.source.value, sveltePath); return ( source.slice(declaration.start, declaration.source.start) + @@ -77,8 +69,8 @@ function esm( return deindent` ${banner} - ${importHelpers} - ${importBlock} + ${internal_imports} + ${user_imports} ${code} @@ -91,15 +83,15 @@ function cjs( name: string, banner: string, sveltePath: string, - internalPath: string, + internal_path: string, helpers: { name: string, alias: string }[], imports: Node[], module_exports: Export[] ) { - const helperDeclarations = helpers.map(h => `${h.alias === h.name ? h.name : `${h.name}: ${h.alias}`}`).sort(); + const declarations = helpers.map(h => `${h.alias === h.name ? h.name : `${h.name}: ${h.alias}`}`).sort(); - const helperBlock = helpers.length > 0 && ( - `const ${stringify_props(helperDeclarations)} = require(${JSON.stringify(internalPath)});\n` + const internal_imports = helpers.length > 0 && ( + `const ${stringify_props(declarations)} = require(${JSON.stringify(internal_path)});\n` ); const requires = imports.map(node => { @@ -121,7 +113,7 @@ function cjs( lhs = `{ ${properties.join(', ')} }`; } - const source = editSource(node.source.value, sveltePath); + const source = edit_source(node.source.value, sveltePath); return `const ${lhs} = require("${source}");` }); @@ -134,7 +126,7 @@ function cjs( ${banner} "use strict"; - ${helperBlock} + ${internal_imports} ${requires} ${code} diff --git a/src/compile/css/Selector.ts b/src/compile/css/Selector.ts index a6ee79e181..3a631f55e1 100644 --- a/src/compile/css/Selector.ts +++ b/src/compile/css/Selector.ts @@ -1,6 +1,6 @@ import MagicString from 'magic-string'; import Stylesheet from './Stylesheet'; -import { gatherPossibleValues, UNKNOWN } from './gatherPossibleValues'; +import { gather_possible_values, UNKNOWN } from './gather_possible_values'; import { Node } from '../interfaces'; import Component from '../compile/Component'; @@ -8,14 +8,14 @@ export default class Selector { node: Node; stylesheet: Stylesheet; blocks: Block[]; - localBlocks: Block[]; + local_blocks: Block[]; used: boolean; constructor(node: Node, stylesheet: Stylesheet) { this.node = node; this.stylesheet = stylesheet; - this.blocks = groupSelectors(node); + this.blocks = group_selectors(node); // take trailing :global(...) selectors out of consideration let i = this.blocks.length; @@ -24,19 +24,19 @@ export default class Selector { i -= 1; } - this.localBlocks = this.blocks.slice(0, i); + this.local_blocks = this.blocks.slice(0, i); this.used = this.blocks[0].global; } apply(node: Node, stack: Node[]) { - const toEncapsulate: Node[] = []; + const to_encapsulate: Node[] = []; - applySelector(this.stylesheet, this.localBlocks.slice(), node, stack.slice(), toEncapsulate); + apply_selector(this.stylesheet, this.local_blocks.slice(), node, stack.slice(), to_encapsulate); - if (toEncapsulate.length > 0) { - toEncapsulate.filter((_, i) => i === 0 || i === toEncapsulate.length - 1).forEach(({ node, block }) => { - this.stylesheet.nodesWithCssClass.add(node); - block.shouldEncapsulate = true; + if (to_encapsulate.length > 0) { + to_encapsulate.filter((_, i) => i === 0 || i === to_encapsulate.length - 1).forEach(({ node, block }) => { + this.stylesheet.nodes_with_css_class.add(node); + block.should_encapsulate = true; }); this.used = true; @@ -57,7 +57,7 @@ export default class Selector { } transform(code: MagicString, attr: string) { - function encapsulateBlock(block: Block) { + function encapsulate_block(block: Block) { let i = block.selectors.length; while (i--) { const selector = block.selectors[i]; @@ -81,7 +81,7 @@ export default class Selector { code.remove(selector.start, first.start).remove(last.end, selector.end); } - if (block.shouldEncapsulate) encapsulateBlock(block); + if (block.should_encapsulate) encapsulate_block(block); }); } @@ -121,7 +121,7 @@ export default class Selector { } } -function applySelector(stylesheet: Stylesheet, blocks: Block[], node: Node, stack: Node[], toEncapsulate: any[]): boolean { +function apply_selector(stylesheet: Stylesheet, blocks: Block[], node: Node, stack: Node[], to_encapsulate: any[]): boolean { const block = blocks.pop(); if (!block) return false; @@ -145,15 +145,15 @@ function applySelector(stylesheet: Stylesheet, blocks: Block[], node: Node, stac } if (selector.type === 'ClassSelector') { - if (!attributeMatches(node, 'class', selector.name, '~=', false) && !classMatches(node, selector.name)) return false; + if (!attribute_matches(node, 'class', selector.name, '~=', false) && !class_matches(node, selector.name)) return false; } else if (selector.type === 'IdSelector') { - if (!attributeMatches(node, 'id', selector.name, '=', false)) return false; + if (!attribute_matches(node, 'id', selector.name, '=', false)) return false; } else if (selector.type === 'AttributeSelector') { - if (!attributeMatches(node, selector.name.name, selector.value && unquote(selector.value), selector.matcher, selector.flags)) return false; + if (!attribute_matches(node, selector.name.name, selector.value && unquote(selector.value), selector.matcher, selector.flags)) return false; } else if (selector.type === 'TypeSelector') { @@ -163,7 +163,7 @@ function applySelector(stylesheet: Stylesheet, blocks: Block[], node: Node, stac else { // bail. TODO figure out what these could be - toEncapsulate.push({ node, block }); + to_encapsulate.push({ node, block }); return true; } } @@ -171,21 +171,21 @@ function applySelector(stylesheet: Stylesheet, blocks: Block[], node: Node, stac if (block.combinator) { if (block.combinator.type === 'WhiteSpace') { while (stack.length) { - if (applySelector(stylesheet, blocks.slice(), stack.pop(), stack, toEncapsulate)) { - toEncapsulate.push({ node, block }); + if (apply_selector(stylesheet, blocks.slice(), stack.pop(), stack, to_encapsulate)) { + to_encapsulate.push({ node, block }); return true; } } if (blocks.every(block => block.global)) { - toEncapsulate.push({ node, block }); + to_encapsulate.push({ node, block }); return true; } return false; } else if (block.combinator.name === '>') { - if (applySelector(stylesheet, blocks, stack.pop(), stack, toEncapsulate)) { - toEncapsulate.push({ node, block }); + if (apply_selector(stylesheet, blocks, stack.pop(), stack, to_encapsulate)) { + to_encapsulate.push({ node, block }); return true; } @@ -193,11 +193,11 @@ function applySelector(stylesheet: Stylesheet, blocks: Block[], node: Node, stac } // TODO other combinators - toEncapsulate.push({ node, block }); + to_encapsulate.push({ node, block }); return true; } - toEncapsulate.push({ node, block }); + to_encapsulate.push({ node, block }); return true; } @@ -210,43 +210,39 @@ const operators = { '*=': (value: string, flags: string) => new RegExp(value, flags) }; -function attributeMatches(node: Node, name: string, expectedValue: string, operator: string, caseInsensitive: boolean) { +function attribute_matches(node: Node, name: string, expected_value: string, operator: string, caseInsensitive: boolean) { const spread = node.attributes.find(attr => attr.type === 'Spread'); if (spread) return true; const attr = node.attributes.find((attr: Node) => attr.name === name); if (!attr) return false; - if (attr.isTrue) return operator === null; + if (attr.is_true) return operator === null; if (attr.chunks.length > 1) return true; - if (!expectedValue) return true; + if (!expected_value) return true; - const pattern = operators[operator](expectedValue, caseInsensitive ? 'i' : ''); + const pattern = operators[operator](expected_value, caseInsensitive ? 'i' : ''); const value = attr.chunks[0]; if (!value) return false; if (value.type === 'Text') return pattern.test(value.data); - const possibleValues = new Set(); - gatherPossibleValues(value.node, possibleValues); - if (possibleValues.has(UNKNOWN)) return true; + const possible_values = new Set(); + gather_possible_values(value.node, possible_values); + if (possible_values.has(UNKNOWN)) return true; - for (const x of Array.from(possibleValues)) { // TypeScript for-of is slightly unlike JS + for (const x of Array.from(possible_values)) { // TypeScript for-of is slightly unlike JS if (pattern.test(x)) return true; } return false; } -function classMatches(node, name: string) { - return node.classes.some(function(classDir) { - return classDir.name === name; +function class_matches(node, name: string) { + return node.classes.some(function(class_directive) { + return class_directive.name === name; }); } -function isDynamic(value: Node) { - return value.length > 1 || value[0].type !== 'Text'; -} - function unquote(value: Node) { if (value.type === 'Identifier') return value.name; const str = value.value; @@ -262,7 +258,7 @@ class Block { selectors: Node[] start: number; end: number; - shouldEncapsulate: boolean; + should_encapsulate: boolean; constructor(combinator: Node) { this.combinator = combinator; @@ -272,7 +268,7 @@ class Block { this.start = null; this.end = null; - this.shouldEncapsulate = false; + this.should_encapsulate = false; } add(selector: Node) { @@ -286,7 +282,7 @@ class Block { } } -function groupSelectors(selector: Node) { +function group_selectors(selector: Node) { let block: Block = new Block(null); const blocks = [block]; diff --git a/src/compile/css/Stylesheet.ts b/src/compile/css/Stylesheet.ts index ecbd0a3648..6e72a86d28 100644 --- a/src/compile/css/Stylesheet.ts +++ b/src/compile/css/Stylesheet.ts @@ -9,7 +9,7 @@ function remove_css_prefox(name: string): string { return name.replace(/^-((webkit)|(moz)|(o)|(ms))-/, ''); } -const isKeyframesNode = (node: Node) => remove_css_prefox(node.name) === 'keyframes'; +const is_keyframes_node = (node: Node) => remove_css_prefox(node.name) === 'keyframes'; // https://github.com/darkskyapp/string-hash/blob/master/index.js function hash(str: string): string { @@ -37,8 +37,8 @@ class Rule { this.selectors.forEach(selector => selector.apply(node, stack)); // TODO move the logic in here? } - isUsed(dev: boolean) { - if (this.parent && this.parent.node.type === 'Atrule' && isKeyframesNode(this.parent.node)) return true; + is_used(dev: boolean) { + if (this.parent && this.parent.node.type === 'Atrule' && is_keyframes_node(this.parent.node)) return true; if (this.declarations.length === 0) return dev; return this.selectors.some(s => s.used); } @@ -79,7 +79,7 @@ class Rule { } transform(code: MagicString, id: string, keyframes: Map) { - if (this.parent && this.parent.node.type === 'Atrule' && isKeyframesNode(this.parent.node)) return true; + if (this.parent && this.parent.node.type === 'Atrule' && is_keyframes_node(this.parent.node)) return true; const attr = `.${id}`; @@ -93,7 +93,7 @@ class Rule { }); } - warnOnUnusedSelector(handler: (selector: Selector) => void) { + warn_on_unused_selector(handler: (selector: Selector) => void) { this.selectors.forEach(selector => { if (!selector.used) handler(selector); }); @@ -154,7 +154,7 @@ class Atrule { }); } - else if (isKeyframesNode(this.node)) { + else if (is_keyframes_node(this.node)) { this.children.forEach((rule: Rule) => { rule.selectors.forEach(selector => { selector.used = true; @@ -163,14 +163,14 @@ class Atrule { } } - isUsed(dev: boolean) { + is_used(dev: boolean) { return true; // TODO } minify(code: MagicString, dev: boolean) { if (this.node.name === 'media') { - const expressionChar = code.original[this.node.expression.start]; - let c = this.node.start + (expressionChar === '(' ? 6 : 7); + const expression_char = code.original[this.node.expression.start]; + let c = this.node.start + (expression_char === '(' ? 6 : 7); if (this.node.expression.start > c) code.remove(c, this.node.expression.start); this.node.expression.children.forEach((query: Node) => { @@ -179,7 +179,7 @@ class Atrule { }); code.remove(c, this.node.block.start); - } else if (isKeyframesNode(this.node)) { + } else if (is_keyframes_node(this.node)) { let c = this.node.start + this.node.name.length + 1; if (this.node.expression.start - c > 1) code.overwrite(c, this.node.expression.start, ' '); c = this.node.expression.end; @@ -200,7 +200,7 @@ class Atrule { let c = this.node.block.start + 1; this.children.forEach(child => { - if (child.isUsed(dev)) { + if (child.is_used(dev)) { code.remove(c, child.node.start); child.minify(code, dev); c = child.node.end; @@ -212,7 +212,7 @@ class Atrule { } transform(code: MagicString, id: string, keyframes: Map) { - if (isKeyframesNode(this.node)) { + if (is_keyframes_node(this.node)) { this.node.expression.children.forEach(({ type, name, start, end }: Node) => { if (type === 'Identifier') { if (name.startsWith('-global-')) { @@ -226,7 +226,7 @@ class Atrule { this.children.forEach(child => { child.transform(code, id, keyframes); - }) + }); } validate(component: Component) { @@ -235,31 +235,28 @@ class Atrule { }); } - warnOnUnusedSelector(handler: (selector: Selector) => void) { + warn_on_unused_selector(handler: (selector: Selector) => void) { if (this.node.name !== 'media') return; this.children.forEach(child => { - child.warnOnUnusedSelector(handler); + child.warn_on_unused_selector(handler); }); } } -const keys = {}; - export default class Stylesheet { source: string; ast: Ast; filename: string; dev: boolean; - hasStyles: boolean; + has_styles: boolean; id: string; - children: (Rule|Atrule)[]; - keyframes: Map; + children: (Rule|Atrule)[] = []; + keyframes: Map = new Map(); - nodesWithCssClass: Set; - nodesWithRefCssClass: Map; + nodes_with_css_class: Set = new Set(); constructor(source: string, ast: Ast, filename: string, dev: boolean) { this.source = source; @@ -267,19 +264,13 @@ export default class Stylesheet { this.filename = filename; this.dev = dev; - this.children = []; - this.keyframes = new Map(); - - this.nodesWithCssClass = new Set(); - this.nodesWithRefCssClass = new Map(); - if (ast.css && ast.css.children.length) { this.id = `svelte-${hash(ast.css.content.styles)}`; - this.hasStyles = true; + this.has_styles = true; const stack: (Rule | Atrule)[] = []; - let currentAtrule: Atrule = null; + let current_atrule: Atrule = null; walk(ast.css, { enter: (node: Node) => { @@ -293,13 +284,13 @@ export default class Stylesheet { // possibly other future constructs) if (last && !(last instanceof Atrule)) return; - if (currentAtrule) { - currentAtrule.children.push(atrule); + if (current_atrule) { + current_atrule.children.push(atrule); } else { this.children.push(atrule); } - if (isKeyframesNode(node)) { + if (is_keyframes_node(node)) { node.expression.children.forEach((expression: Node) => { if (expression.type === 'Identifier' && !expression.name.startsWith('-global-')) { this.keyframes.set(expression.name, `${this.id}-${expression.name}`); @@ -307,15 +298,15 @@ export default class Stylesheet { }); } - currentAtrule = atrule; + current_atrule = atrule; } if (node.type === 'Rule') { - const rule = new Rule(node, this, currentAtrule); + const rule = new Rule(node, this, current_atrule); stack.push(rule); - if (currentAtrule) { - currentAtrule.children.push(rule); + if (current_atrule) { + current_atrule.children.push(rule); } else { this.children.push(rule); } @@ -324,16 +315,16 @@ export default class Stylesheet { leave: (node: Node) => { if (node.type === 'Rule' || node.type === 'Atrule') stack.pop(); - if (node.type === 'Atrule') currentAtrule = stack[stack.length - 1] as Atrule; + if (node.type === 'Atrule') current_atrule = stack[stack.length - 1] as Atrule; } }); } else { - this.hasStyles = false; + this.has_styles = false; } } apply(node: Element) { - if (!this.hasStyles) return; + if (!this.has_styles) return; const stack: Element[] = []; let parent: Node = node; @@ -348,13 +339,13 @@ export default class Stylesheet { } reify() { - this.nodesWithCssClass.forEach((node: Node) => { - node.addCssClass(); + this.nodes_with_css_class.forEach((node: Node) => { + node.add_css_class(); }); } - render(cssOutputFilename: string, shouldTransformSelectors: boolean) { - if (!this.hasStyles) { + render(file: string, should_transform_selectors: boolean) { + if (!this.has_styles) { return { code: null, map: null }; } @@ -367,7 +358,7 @@ export default class Stylesheet { } }); - if (shouldTransformSelectors) { + if (should_transform_selectors) { this.children.forEach((child: (Atrule|Rule)) => { child.transform(code, this.id, this.keyframes); }); @@ -375,7 +366,7 @@ export default class Stylesheet { let c = 0; this.children.forEach(child => { - if (child.isUsed(this.dev)) { + if (child.is_used(this.dev)) { code.remove(c, child.node.start); child.minify(code, this.dev); c = child.node.end; @@ -389,7 +380,7 @@ export default class Stylesheet { map: code.generateMap({ includeContent: true, source: this.filename, - file: cssOutputFilename + file }) }; } @@ -402,7 +393,7 @@ export default class Stylesheet { warnOnUnusedSelectors(component: Component) { this.children.forEach(child => { - child.warnOnUnusedSelector((selector: Selector) => { + child.warn_on_unused_selector((selector: Selector) => { component.warn(selector.node, { code: `css-unused-selector`, message: `Unused CSS selector` diff --git a/src/compile/css/gatherPossibleValues.ts b/src/compile/css/gather_possible_values.ts similarity index 55% rename from src/compile/css/gatherPossibleValues.ts rename to src/compile/css/gather_possible_values.ts index 829626b9e3..4cc7cd07e0 100644 --- a/src/compile/css/gatherPossibleValues.ts +++ b/src/compile/css/gather_possible_values.ts @@ -2,14 +2,14 @@ import { Node } from '../interfaces'; export const UNKNOWN = {}; -export function gatherPossibleValues(node: Node, set: Set) { +export function gather_possible_values(node: Node, set: Set) { if (node.type === 'Literal') { set.add(node.value); } else if (node.type === 'ConditionalExpression') { - gatherPossibleValues(node.consequent, set); - gatherPossibleValues(node.alternate, set); + gather_possible_values(node.consequent, set); + gather_possible_values(node.alternate, set); } else { diff --git a/src/compile/nodes/Action.ts b/src/compile/nodes/Action.ts index 761738ac79..feec3fada8 100644 --- a/src/compile/nodes/Action.ts +++ b/src/compile/nodes/Action.ts @@ -6,7 +6,7 @@ export default class Action extends Node { type: 'Action'; name: string; expression: Expression; - usesContext: boolean; + uses_context: boolean; constructor(component: Component, parent, scope, info) { super(component, parent, scope, info); @@ -20,6 +20,6 @@ export default class Action extends Node { ? new Expression(component, this, scope, info.expression) : null; - this.usesContext = this.expression && this.expression.usesContext; + this.uses_context = this.expression && this.expression.uses_context; } } \ No newline at end of file diff --git a/src/compile/nodes/Animation.ts b/src/compile/nodes/Animation.ts index 68ebfd3828..638a88b169 100644 --- a/src/compile/nodes/Animation.ts +++ b/src/compile/nodes/Animation.ts @@ -31,7 +31,7 @@ export default class Animation extends Node { }); } - block.hasAnimation = true; + block.has_animation = true; this.expression = info.expression ? new Expression(component, this, scope, info.expression) diff --git a/src/compile/nodes/Attribute.ts b/src/compile/nodes/Attribute.ts index 8364af51f3..c07960ce47 100644 --- a/src/compile/nodes/Attribute.ts +++ b/src/compile/nodes/Attribute.ts @@ -14,12 +14,12 @@ export default class Attribute extends Node { component: Component; parent: Element; name: string; - isSpread: boolean; - isTrue: boolean; - isDynamic: boolean; - isStatic: boolean; - isSynthetic: boolean; - shouldCache: boolean; + is_spread: boolean; + is_true: boolean; + is_dynamic: boolean; + is_static: boolean; + is_synthetic: boolean; + should_cache: boolean; expression?: Expression; chunks: (Text | Expression)[]; dependencies: Set; @@ -29,33 +29,33 @@ export default class Attribute extends Node { if (info.type === 'Spread') { this.name = null; - this.isSpread = true; - this.isTrue = false; - this.isSynthetic = false; + this.is_spread = true; + this.is_true = false; + this.is_synthetic = false; this.expression = new Expression(component, this, scope, info.expression); this.dependencies = this.expression.dependencies; this.chunks = null; - this.isDynamic = true; // TODO not necessarily - this.isStatic = false; - this.shouldCache = false; // TODO does this mean anything here? + this.is_dynamic = true; // TODO not necessarily + this.is_static = false; + this.should_cache = false; // TODO does this mean anything here? } else { this.name = info.name; - this.isTrue = info.value === true; - this.isStatic = true; - this.isSynthetic = info.synthetic; + this.is_true = info.value === true; + this.is_static = true; + this.is_synthetic = info.synthetic; this.dependencies = new Set(); - this.chunks = this.isTrue + this.chunks = this.is_true ? [] : info.value.map(node => { if (node.type === 'Text') return node; - this.isStatic = false; + this.is_static = false; const expression = new Expression(component, this, scope, node.expression); @@ -63,9 +63,9 @@ export default class Attribute extends Node { return expression; }); - this.isDynamic = this.dependencies.size > 0; + this.is_dynamic = this.dependencies.size > 0; - this.shouldCache = this.isDynamic + this.should_cache = this.is_dynamic ? this.chunks.length === 1 ? this.chunks[0].node.type !== 'Identifier' || scope.names.has(this.chunks[0].node.name) : true @@ -74,7 +74,7 @@ export default class Attribute extends Node { } get_dependencies() { - if (this.isSpread) return this.expression.dynamic_dependencies(); + if (this.is_spread) return this.expression.dynamic_dependencies(); const dependencies = new Set(); this.chunks.forEach(chunk => { @@ -86,8 +86,8 @@ export default class Attribute extends Node { return Array.from(dependencies); } - getValue(block) { - if (this.isTrue) return true; + get_value(block) { + if (this.is_true) return true; if (this.chunks.length === 0) return `""`; if (this.chunks.length === 1) { @@ -102,16 +102,16 @@ export default class Attribute extends Node { if (chunk.type === 'Text') { return stringify(chunk.data); } else { - return chunk.getPrecedence() <= 13 ? `(${chunk.render()})` : chunk.render(); + return chunk.get_precedence() <= 13 ? `(${chunk.render()})` : chunk.render(); } }) .join(' + '); } - getStaticValue() { - if (this.isSpread || this.isDynamic) return null; + get_static_value() { + if (this.is_spread || this.is_dynamic) return null; - return this.isTrue + return this.is_true ? true : this.chunks[0] ? this.chunks[0].data diff --git a/src/compile/nodes/Binding.ts b/src/compile/nodes/Binding.ts index 778e17538a..939af8a8d9 100644 --- a/src/compile/nodes/Binding.ts +++ b/src/compile/nodes/Binding.ts @@ -7,7 +7,7 @@ import TemplateScope from './shared/TemplateScope'; export default class Binding extends Node { name: string; expression: Expression; - isContextual: boolean; + is_contextual: boolean; obj: string; prop: string; @@ -28,11 +28,11 @@ export default class Binding extends Node { let prop; const { name } = get_object(this.expression.node); - this.isContextual = scope.names.has(name); + this.is_contextual = scope.names.has(name); // make sure we track this as a mutable ref - if (this.isContextual) { - scope.dependenciesForName.get(name).forEach(name => { + if (this.is_contextual) { + scope.dependencies_for_name.get(name).forEach(name => { const variable = component.var_lookup.get(name); variable[this.expression.node.type === 'MemberExpression' ? 'mutated' : 'reassigned'] = true; }); diff --git a/src/compile/nodes/CatchBlock.ts b/src/compile/nodes/CatchBlock.ts index db202b9517..f728c1b850 100644 --- a/src/compile/nodes/CatchBlock.ts +++ b/src/compile/nodes/CatchBlock.ts @@ -1,6 +1,6 @@ import Node from './shared/Node'; import Block from '../render-dom/Block'; -import mapChildren from './shared/mapChildren'; +import map_children from './shared/map_children'; import TemplateScope from './shared/TemplateScope'; export default class CatchBlock extends Node { @@ -13,8 +13,8 @@ export default class CatchBlock extends Node { this.scope = scope.child(); this.scope.add(parent.error, parent.expression.dependencies, this); - this.children = mapChildren(component, parent, this.scope, info.children); + this.children = map_children(component, parent, this.scope, info.children); - this.warnIfEmptyBlock(); + this.warn_if_empty_block(); } } \ No newline at end of file diff --git a/src/compile/nodes/EachBlock.ts b/src/compile/nodes/EachBlock.ts index fa095031a3..ce9b63fe47 100644 --- a/src/compile/nodes/EachBlock.ts +++ b/src/compile/nodes/EachBlock.ts @@ -2,7 +2,7 @@ import Node from './shared/Node'; import ElseBlock from './ElseBlock'; import Block from '../render-dom/Block'; import Expression from './shared/Expression'; -import mapChildren from './shared/mapChildren'; +import map_children from './shared/map_children'; import TemplateScope from './shared/TemplateScope'; import { Node as INode } from '../../interfaces'; @@ -38,7 +38,7 @@ export default class EachBlock extends Node { key: Expression; scope: TemplateScope; contexts: Array<{ name: string, tail: string }>; - hasAnimation: boolean; + has_animation: boolean; has_binding = false; children: Node[]; @@ -71,11 +71,11 @@ export default class EachBlock extends Node { this.scope.add(this.index, dependencies, this); } - this.hasAnimation = false; + this.has_animation = false; - this.children = mapChildren(component, this, this.scope, info.children); + this.children = map_children(component, this, this.scope, info.children); - if (this.hasAnimation) { + if (this.has_animation) { if (this.children.length !== 1) { const child = this.children.find(child => !!child.animation); component.error(child.animation, { @@ -85,7 +85,7 @@ export default class EachBlock extends Node { } } - this.warnIfEmptyBlock(); // TODO would be better if EachBlock, IfBlock etc extended an abstract Block class + this.warn_if_empty_block(); // TODO would be better if EachBlock, IfBlock etc extended an abstract Block class this.else = info.else ? new ElseBlock(component, this, this.scope, info.else) diff --git a/src/compile/nodes/Element.ts b/src/compile/nodes/Element.ts index 881ff22708..536e1e729a 100644 --- a/src/compile/nodes/Element.ts +++ b/src/compile/nodes/Element.ts @@ -9,7 +9,7 @@ import Action from './Action'; import Class from './Class'; import Text from './Text'; import { namespaces } from '../../utils/namespaces'; -import mapChildren from './shared/mapChildren'; +import map_children from './shared/map_children'; import { dimensions } from '../../utils/patterns'; import fuzzymatch from '../../utils/fuzzymatch'; import list from '../../utils/list'; @@ -18,13 +18,13 @@ import TemplateScope from './shared/TemplateScope'; const svg = /^(?:altGlyph|altGlyphDef|altGlyphItem|animate|animateColor|animateMotion|animateTransform|circle|clipPath|color-profile|cursor|defs|desc|discard|ellipse|feBlend|feColorMatrix|feComponentTransfer|feComposite|feConvolveMatrix|feDiffuseLighting|feDisplacementMap|feDistantLight|feDropShadow|feFlood|feFuncA|feFuncB|feFuncG|feFuncR|feGaussianBlur|feImage|feMerge|feMergeNode|feMorphology|feOffset|fePointLight|feSpecularLighting|feSpotLight|feTile|feTurbulence|filter|font|font-face|font-face-format|font-face-name|font-face-src|font-face-uri|foreignObject|g|glyph|glyphRef|hatch|hatchpath|hkern|image|line|linearGradient|marker|mask|mesh|meshgradient|meshpatch|meshrow|metadata|missing-glyph|mpath|path|pattern|polygon|polyline|radialGradient|rect|set|solidcolor|stop|switch|symbol|text|textPath|tref|tspan|unknown|use|view|vkern)$/; -const ariaAttributes = 'activedescendant atomic autocomplete busy checked colindex controls current describedby details disabled dropeffect errormessage expanded flowto grabbed haspopup hidden invalid keyshortcuts label labelledby level live modal multiline multiselectable orientation owns placeholder posinset pressed readonly relevant required roledescription rowindex selected setsize sort valuemax valuemin valuenow valuetext'.split(' '); -const ariaAttributeSet = new Set(ariaAttributes); +const aria_attributes = 'activedescendant atomic autocomplete busy checked colindex controls current describedby details disabled dropeffect errormessage expanded flowto grabbed haspopup hidden invalid keyshortcuts label labelledby level live modal multiline multiselectable orientation owns placeholder posinset pressed readonly relevant required roledescription rowindex selected setsize sort valuemax valuemin valuenow valuetext'.split(' '); +const aria_attribute_set = new Set(aria_attributes); -const ariaRoles = 'alert alertdialog application article banner button cell checkbox columnheader combobox command complementary composite contentinfo definition dialog directory document feed figure form grid gridcell group heading img input landmark link list listbox listitem log main marquee math menu menubar menuitem menuitemcheckbox menuitemradio navigation none note option presentation progressbar radio radiogroup range region roletype row rowgroup rowheader scrollbar search searchbox section sectionhead select separator slider spinbutton status structure switch tab table tablist tabpanel term textbox timer toolbar tooltip tree treegrid treeitem widget window'.split(' '); -const ariaRoleSet = new Set(ariaRoles); +const aria_roles = 'alert alertdialog application article banner button cell checkbox columnheader combobox command complementary composite contentinfo definition dialog directory document feed figure form grid gridcell group heading img input landmark link list listbox listitem log main marquee math menu menubar menuitem menuitemcheckbox menuitemradio navigation none note option presentation progressbar radio radiogroup range region roletype row rowgroup rowheader scrollbar search searchbox section sectionhead select separator slider spinbutton status structure switch tab table tablist tabpanel term textbox timer toolbar tooltip tree treegrid treeitem widget window'.split(' '); +const aria_role_set = new Set(aria_roles); -const a11yRequiredAttributes = { +const a11y_required_attributes = { a: ['href'], area: ['alt', 'aria-label', 'aria-labelledby'], @@ -37,12 +37,12 @@ const a11yRequiredAttributes = { object: ['title', 'aria-label', 'aria-labelledby'] }; -const a11yDistractingElements = new Set([ +const a11y_distracting_elements = new Set([ 'blink', 'marquee' ]); -const a11yRequiredContent = new Set([ +const a11y_required_content = new Set([ // anchor-has-content 'a', @@ -55,9 +55,9 @@ const a11yRequiredContent = new Set([ 'h6' ]) -const invisibleElements = new Set(['meta', 'html', 'script', 'style']); +const invisible_elements = new Set(['meta', 'html', 'script', 'style']); -const validModifiers = new Set([ +const valid_modifiers = new Set([ 'preventDefault', 'stopPropagation', 'capture', @@ -65,7 +65,7 @@ const validModifiers = new Set([ 'passive' ]); -const passiveEvents = new Set([ +const passive_events = new Set([ 'wheel', 'touchstart', 'touchmove', @@ -93,10 +93,10 @@ export default class Element extends Node { super(component, parent, scope, info); this.name = info.name; - const parentElement = parent.findNearest(/^Element/); + const parent_element = parent.find_nearest(/^Element/); this.namespace = this.name === 'svg' ? namespaces.svg : - parentElement ? parentElement.namespace : this.component.namespace; + parent_element ? parent_element.namespace : this.component.namespace; if (!this.namespace && svg.test(this.name)) { this.component.warn(this, { @@ -107,9 +107,9 @@ export default class Element extends Node { if (this.name === 'textarea') { if (info.children.length > 0) { - const valueAttribute = info.attributes.find(node => node.name === 'value'); - if (valueAttribute) { - component.error(valueAttribute, { + const value_attribute = info.attributes.find(node => node.name === 'value'); + if (value_attribute) { + component.error(value_attribute, { code: `textarea-duplicate-value`, message: `A