diff --git a/src/compiler/compile/render_dom/Block.ts b/src/compiler/compile/render_dom/Block.ts index 9e42432d73..0fa187546d 100644 --- a/src/compiler/compile/render_dom/Block.ts +++ b/src/compiler/compile/render_dom/Block.ts @@ -3,6 +3,7 @@ import Wrapper from './wrappers/shared/Wrapper'; import { b, x } from 'code-red'; import { Node, Identifier, ArrayPattern, Literal, CallExpression } from 'estree'; import { is_head } from './wrappers/shared/is_head'; +import { sanitize_name } from '../utils/stringify'; export interface BlockOptions { parent?: Block; @@ -465,14 +466,14 @@ export default class Block { node.callee.name === "@listen" ) { // b`@listen(ref, "type", args);` - const listener = this.get_unique_name(`${(node.arguments[1] as Literal).value}_listener`); + const listener = this.get_unique_name(`${sanitize_name((node.arguments[1] as Literal).value)}_listener`); this.add_variable(listener); mount.push(b`${listener} = ${node};`); destroy.push(b`${listener}();`) } else if ( node.type === "AssignmentExpression" && node.left.type === "Identifier" && - node.left.name.endsWith("_action") + node.left.name.includes("_action") ) { // b`identifier = use_action(args);` mount.push(node); diff --git a/src/compiler/compile/render_dom/index.ts b/src/compiler/compile/render_dom/index.ts index 7bcc6eada7..6096c50849 100644 --- a/src/compiler/compile/render_dom/index.ts +++ b/src/compiler/compile/render_dom/index.ts @@ -448,7 +448,8 @@ export default function dom( ${unknown_props_check} - ${component.slots.size || component.compile_options.dev ? b`let { $$slots = {}, $$scope } = $$props;` : null} + ${component.slots.size || component.compile_options.dev ? b`let { $$slots = {} } = $$props;` : null} + ${component.slots.size ? b`let { $$scope } = $$props;` : null} ${component.compile_options.dev && b`@validate_slots('${component.tag}', $$slots, [${[...component.slots.keys()].map(key => `'${key}'`).join(',')}]);`} ${renderer.binding_groups.length > 0 && b`const $$binding_groups = [${renderer.binding_groups.map(_ => x`[]`)}];`} diff --git a/src/compiler/compile/render_dom/wrappers/shared/add_actions.ts b/src/compiler/compile/render_dom/wrappers/shared/add_actions.ts index 43730a7a2a..aecb9e2880 100644 --- a/src/compiler/compile/render_dom/wrappers/shared/add_actions.ts +++ b/src/compiler/compile/render_dom/wrappers/shared/add_actions.ts @@ -1,6 +1,7 @@ import { b, x } from 'code-red'; import Block from '../../Block'; import Action from '../../../nodes/Action'; +import { sanitize_name } from '../../../utils/stringify'; export default function add_actions( block: Block, target: string, @@ -18,7 +19,7 @@ export function add_action(block: Block, target: string, action: Action) { dependencies = expression.dynamic_dependencies(); } - const id = block.get_unique_name(`${action.name.replace(/[^a-zA-Z0-9_$]/g, '_')}_action`); + const id = block.get_unique_name(`${sanitize_name(action.name)}_action`); block.add_variable(id); const fn = block.renderer.reference(action.name); diff --git a/src/compiler/compile/utils/stringify.ts b/src/compiler/compile/utils/stringify.ts index 19f6d99673..33bc19e7f8 100644 --- a/src/compiler/compile/utils/stringify.ts +++ b/src/compiler/compile/utils/stringify.ts @@ -5,6 +5,10 @@ export function string_literal(data: string) { }; } +export function sanitize_name(str){ + return str.replace(/[^a-zA-Z0-9_$]/g, '_') +} + export function escape(data: string, { only_escape_at_symbol = false } = {}) { return data.replace(only_escape_at_symbol ? /@+/g : /(@+|#+)/g, (match: string) => { return match + match[0];