diff --git a/src/generators/Generator.ts b/src/generators/Generator.ts index 6e78d0fc74..8f2dad24e4 100644 --- a/src/generators/Generator.ts +++ b/src/generators/Generator.ts @@ -12,6 +12,7 @@ import namespaces from '../utils/namespaces'; import { removeNode, removeObjectKey } from '../utils/removeNode'; import wrapModule from './shared/utils/wrapModule'; import annotateWithScopes from '../utils/annotateWithScopes'; +import getName from '../utils/getName'; import clone from '../utils/clone'; import DomBlock from './dom/Block'; import SsrBlock from './server-side-rendering/Block'; @@ -497,13 +498,13 @@ export default class Generator { if (defaultExport) { defaultExport.declaration.properties.forEach((prop: Node) => { - templateProperties[prop.key.name] = prop; + templateProperties[getName(prop.key)] = prop; }); ['helpers', 'events', 'components', 'transitions'].forEach(key => { if (templateProperties[key]) { templateProperties[key].value.properties.forEach((prop: Node) => { - this[key].add(prop.key.name); + this[key].add(getName(prop.key)); }); } }); @@ -574,7 +575,7 @@ export default class Generator { if (templateProperties.components) { templateProperties.components.value.properties.forEach((property: Node) => { - addDeclaration(property.key.name, property.value, 'components'); + addDeclaration(getName(property.key), property.value, 'components'); }); } @@ -582,7 +583,7 @@ export default class Generator { const dependencies = new Map(); templateProperties.computed.value.properties.forEach((prop: Node) => { - const key = prop.key.name; + const key = getName(prop.key); const value = prop.value; const deps = value.params.map( @@ -605,12 +606,12 @@ export default class Generator { computations.push({ key, deps }); - const prop = templateProperties.computed.value.properties.find((prop: Node) => prop.key.name === key); + const prop = templateProperties.computed.value.properties.find((prop: Node) => getName(prop.key) === key); addDeclaration(key, prop.value, 'computed'); }; templateProperties.computed.value.properties.forEach((prop: Node) => - visit(prop.key.name) + visit(getName(prop.key)) ); } @@ -620,13 +621,13 @@ export default class Generator { if (templateProperties.events && dom) { templateProperties.events.value.properties.forEach((property: Node) => { - addDeclaration(property.key.name, property.value, 'events'); + addDeclaration(getName(property.key), property.value, 'events'); }); } if (templateProperties.helpers) { templateProperties.helpers.value.properties.forEach((property: Node) => { - addDeclaration(property.key.name, property.value, 'helpers'); + addDeclaration(getName(property.key), property.value, 'helpers'); }); } @@ -663,7 +664,7 @@ export default class Generator { if (templateProperties.transitions) { templateProperties.transitions.value.properties.forEach((property: Node) => { - addDeclaration(property.key.name, property.value, 'transitions'); + addDeclaration(getName(property.key), property.value, 'transitions'); }); } } diff --git a/src/generators/server-side-rendering/index.ts b/src/generators/server-side-rendering/index.ts index 5e6bd25d8d..b4590df95d 100644 --- a/src/generators/server-side-rendering/index.ts +++ b/src/generators/server-side-rendering/index.ts @@ -5,6 +5,7 @@ import Block from './Block'; import preprocess from './preprocess'; import visit from './visit'; import { removeNode, removeObjectKey } from '../../utils/removeNode'; +import getName from '../../utils/getName'; import { Parsed, Node, CompileOptions } from '../../interfaces'; import { AppendTarget } from './interfaces'; import { stringify } from '../../utils/stringify'; @@ -132,7 +133,7 @@ export default function ssr( } ${templateProperties.components.value.properties.map((prop: Node) => { - return `addComponent(%components-${prop.key.name});`; + return `addComponent(%components-${getName(prop.key)});`; })} `} diff --git a/src/utils/getName.ts b/src/utils/getName.ts new file mode 100644 index 0000000000..d236bbaec8 --- /dev/null +++ b/src/utils/getName.ts @@ -0,0 +1,6 @@ +import { Node } from '../interfaces'; + +export default function getMethodName(node: Node) { + if (node.type === 'Identifier') return node.name; + if (node.type === 'Literal') return String(node.value); +} \ No newline at end of file diff --git a/src/utils/removeNode.ts b/src/utils/removeNode.ts index 6abea2f8c9..26095b483c 100644 --- a/src/utils/removeNode.ts +++ b/src/utils/removeNode.ts @@ -1,4 +1,5 @@ import MagicString from 'magic-string'; +import getName from '../utils/getName'; import { Node } from '../interfaces'; const keys = { @@ -51,7 +52,7 @@ export function removeObjectKey(code: MagicString, node: Node, key: string) { let i = node.properties.length; while (i--) { const property = node.properties[i]; - if (property.key.type === 'Identifier' && property.key.name === key) { + if (property.key.type === 'Identifier' && getName(property.key) === key) { removeNode(code, node, property); } } diff --git a/src/validate/js/index.ts b/src/validate/js/index.ts index 01754b7d00..be120c5a4a 100644 --- a/src/validate/js/index.ts +++ b/src/validate/js/index.ts @@ -3,6 +3,7 @@ import fuzzymatch from '../utils/fuzzymatch'; import checkForDupes from './utils/checkForDupes'; import checkForComputedKeys from './utils/checkForComputedKeys'; import namespaces from '../../utils/namespaces'; +import getName from '../../utils/getName'; import { Validator } from '../'; import { Node } from '../../interfaces'; @@ -29,7 +30,7 @@ export default function validateJs(validator: Validator, js: Node) { const props = validator.properties; node.declaration.properties.forEach((prop: Node) => { - props.set(prop.key.name, prop); + props.set(getName(prop.key), prop); }); // Remove these checks in version 2 @@ -49,25 +50,26 @@ export default function validateJs(validator: Validator, js: Node) { // ensure all exported props are valid node.declaration.properties.forEach((prop: Node) => { - const propValidator = propValidators[prop.key.name]; + const name = getName(prop.key); + const propValidator = propValidators[name]; if (propValidator) { propValidator(validator, prop); } else { - const match = fuzzymatch(prop.key.name, validPropList); + const match = fuzzymatch(name, validPropList); if (match) { validator.error( - `Unexpected property '${prop.key.name}' (did you mean '${match}'?)`, + `Unexpected property '${name}' (did you mean '${match}'?)`, prop.start ); } else if (/FunctionExpression/.test(prop.value.type)) { validator.error( - `Unexpected property '${prop.key.name}' (did you mean to include it in 'methods'?)`, + `Unexpected property '${name}' (did you mean to include it in 'methods'?)`, prop.start ); } else { validator.error( - `Unexpected property '${prop.key.name}'`, + `Unexpected property '${name}'`, prop.start ); } @@ -86,7 +88,7 @@ export default function validateJs(validator: Validator, js: Node) { ['components', 'methods', 'helpers', 'transitions'].forEach(key => { if (validator.properties.has(key)) { validator.properties.get(key).value.properties.forEach((prop: Node) => { - validator[key].set(prop.key.name, prop.value); + validator[key].set(getName(prop.key), prop.value); }); } }); diff --git a/src/validate/js/propValidators/components.ts b/src/validate/js/propValidators/components.ts index a7ca5eb990..7d46470d0b 100644 --- a/src/validate/js/propValidators/components.ts +++ b/src/validate/js/propValidators/components.ts @@ -1,5 +1,6 @@ import checkForDupes from '../utils/checkForDupes'; import checkForComputedKeys from '../utils/checkForComputedKeys'; +import getName from '../../../utils/getName'; import { Validator } from '../../'; import { Node } from '../../../interfaces'; @@ -16,14 +17,16 @@ export default function components(validator: Validator, prop: Node) { checkForComputedKeys(validator, prop.value.properties); prop.value.properties.forEach((component: Node) => { - if (component.key.name === 'state') { + const name = getName(component.key); + + if (name === 'state') { validator.error( `Component constructors cannot be called 'state' due to technical limitations`, component.start ); } - if (!/^[A-Z]/.test(component.key.name)) { + if (!/^[A-Z]/.test(name)) { validator.warn(`Component names should be capitalised`, component.start); } }); diff --git a/src/validate/js/propValidators/methods.ts b/src/validate/js/propValidators/methods.ts index 7d8547ef39..66fd27eea1 100644 --- a/src/validate/js/propValidators/methods.ts +++ b/src/validate/js/propValidators/methods.ts @@ -2,6 +2,7 @@ import checkForAccessors from '../utils/checkForAccessors'; import checkForDupes from '../utils/checkForDupes'; import checkForComputedKeys from '../utils/checkForComputedKeys'; import usesThisOrArguments from '../utils/usesThisOrArguments'; +import getName from '../../../utils/getName'; import { Validator } from '../../'; import { Node } from '../../../interfaces'; @@ -21,9 +22,11 @@ export default function methods(validator: Validator, prop: Node) { checkForComputedKeys(validator, prop.value.properties); prop.value.properties.forEach((prop: Node) => { - if (builtin.has(prop.key.name)) { + const name = getName(prop.key); + + if (builtin.has(name)) { validator.error( - `Cannot overwrite built-in method '${prop.key.name}'`, + `Cannot overwrite built-in method '${name}'`, prop.start ); } diff --git a/src/validate/js/utils/checkForDupes.ts b/src/validate/js/utils/checkForDupes.ts index 8565ab5388..0473d7a265 100644 --- a/src/validate/js/utils/checkForDupes.ts +++ b/src/validate/js/utils/checkForDupes.ts @@ -1,5 +1,6 @@ import { Validator } from '../../'; import { Node } from '../../../interfaces'; +import getName from '../../../utils/getName'; export default function checkForDupes( validator: Validator, @@ -8,10 +9,12 @@ export default function checkForDupes( const seen = new Set(); properties.forEach(prop => { - if (seen.has(prop.key.name)) { - validator.error(`Duplicate property '${prop.key.name}'`, prop.start); + const name = getName(prop.key); + + if (seen.has(name)) { + validator.error(`Duplicate property '${name}'`, prop.start); } - seen.add(prop.key.name); + seen.add(name); }); } diff --git a/test/validator/samples/method-quoted/errors.json b/test/validator/samples/method-quoted/errors.json new file mode 100644 index 0000000000..fe51488c70 --- /dev/null +++ b/test/validator/samples/method-quoted/errors.json @@ -0,0 +1 @@ +[] diff --git a/test/validator/samples/method-quoted/input.html b/test/validator/samples/method-quoted/input.html new file mode 100644 index 0000000000..790276eebc --- /dev/null +++ b/test/validator/samples/method-quoted/input.html @@ -0,0 +1,10 @@ + + + \ No newline at end of file