diff --git a/packages/svelte/messages/compile-errors/attributes.md b/packages/svelte/messages/compile-errors/attributes.md index 8e27e74076..08cabae89a 100644 --- a/packages/svelte/messages/compile-errors/attributes.md +++ b/packages/svelte/messages/compile-errors/attributes.md @@ -14,38 +14,6 @@ > '%name%' is not a valid attribute name -## animation_invalid_placement - -> An element that uses the `animate:` directive must be the only child of a keyed `{#each ...}` block - -## animation_missing_key - -> An element that uses the `animate:` directive must be the only child of a keyed `{#each ...}` block. Did you forget to add a key to your each block? - -## animation_duplicate - -> An element can only have one 'animate' directive - -## invalid_event_modifier - -> Valid event modifiers are %list% - -## invalid_component_event_modifier - -> Event modifiers other than 'once' can only be used on DOM elements - -## invalid_event_modifier_combination - -> The '%modifier1%' and '%modifier2%' modifiers cannot be used together - -## transition_duplicate - -> Cannot use multiple `%type%:` directives on a single element - -## transition_conflict - -> Cannot use `%type%:` alongside existing `%existing%:` directive - ## invalid_let_directive_placement > `let:` directive at invalid position @@ -56,4 +24,4 @@ ## invalid_sequence_expression -> Sequence expressions are not allowed as attribute/directive values in runes mode, unless wrapped in parentheses \ No newline at end of file +> Sequence expressions are not allowed as attribute/directive values in runes mode, unless wrapped in parentheses diff --git a/packages/svelte/messages/compile-errors/template.md b/packages/svelte/messages/compile-errors/template.md new file mode 100644 index 0000000000..7436f4882d --- /dev/null +++ b/packages/svelte/messages/compile-errors/template.md @@ -0,0 +1,31 @@ +## animation_invalid_placement + +> An element that uses the `animate:` directive must be the only child of a keyed `{#each ...}` block + +## animation_missing_key + +> An element that uses the `animate:` directive must be the only child of a keyed `{#each ...}` block. Did you forget to add a key to your each block? + +## animation_duplicate + +> An element can only have one 'animate' directive + +## event_handler_invalid_modifier + +> Valid event modifiers are %list% + +## event_handler_invalid_modifier_combination + +> The '%modifier1%' and '%modifier2%' modifiers cannot be used together + +## event_handler_invalid_component_modifier + +> Event modifiers other than 'once' can only be used on DOM elements + +## transition_duplicate + +> Cannot use multiple `%type%:` directives on a single element + +## transition_conflict + +> Cannot use `%type%:` alongside existing `%existing%:` directive diff --git a/packages/svelte/src/compiler/errors.js b/packages/svelte/src/compiler/errors.js index 810c1582be..e533a748b3 100644 --- a/packages/svelte/src/compiler/errors.js +++ b/packages/svelte/src/compiler/errors.js @@ -56,43 +56,6 @@ function e(node, code, message) { throw new CompileError(code, message, start !== undefined && end !== undefined ? [start, end] : undefined); } -/** - * Attribute shorthand cannot be empty - * @param {null | number | NodeLike} node - * @returns {never} - */ -export function empty_attribute_shorthand(node) { - e(node, "empty_attribute_shorthand", "Attribute shorthand cannot be empty"); -} - -/** - * Attributes need to be unique - * @param {null | number | NodeLike} node - * @returns {never} - */ -export function duplicate_attribute(node) { - e(node, "duplicate_attribute", "Attributes need to be unique"); -} - -/** - * Event attribute must be a JavaScript expression, not a string - * @param {null | number | NodeLike} node - * @returns {never} - */ -export function invalid_event_attribute_value(node) { - e(node, "invalid_event_attribute_value", "Event attribute must be a JavaScript expression, not a string"); -} - -/** - * '%name%' is not a valid attribute name - * @param {null | number | NodeLike} node - * @param {string} name - * @returns {never} - */ -export function invalid_attribute_name(node, name) { - e(node, "invalid_attribute_name", `'${name}' is not a valid attribute name`); -} - /** * An element that uses the `animate:` directive must be the only child of a keyed `{#each ...}` block * @param {null | number | NodeLike} node @@ -121,54 +84,40 @@ export function animation_duplicate(node) { } /** - * Valid event modifiers are %list% - * @param {null | number | NodeLike} node - * @param {string} list - * @returns {never} - */ -export function invalid_event_modifier(node, list) { - e(node, "invalid_event_modifier", `Valid event modifiers are ${list}`); -} - -/** - * Event modifiers other than 'once' can only be used on DOM elements + * Attribute shorthand cannot be empty * @param {null | number | NodeLike} node * @returns {never} */ -export function invalid_component_event_modifier(node) { - e(node, "invalid_component_event_modifier", "Event modifiers other than 'once' can only be used on DOM elements"); +export function empty_attribute_shorthand(node) { + e(node, "empty_attribute_shorthand", "Attribute shorthand cannot be empty"); } /** - * The '%modifier1%' and '%modifier2%' modifiers cannot be used together + * Attributes need to be unique * @param {null | number | NodeLike} node - * @param {string} modifier1 - * @param {string} modifier2 * @returns {never} */ -export function invalid_event_modifier_combination(node, modifier1, modifier2) { - e(node, "invalid_event_modifier_combination", `The '${modifier1}' and '${modifier2}' modifiers cannot be used together`); +export function duplicate_attribute(node) { + e(node, "duplicate_attribute", "Attributes need to be unique"); } /** - * Cannot use multiple `%type%:` directives on a single element + * Event attribute must be a JavaScript expression, not a string * @param {null | number | NodeLike} node - * @param {string} type * @returns {never} */ -export function transition_duplicate(node, type) { - e(node, "transition_duplicate", `Cannot use multiple \`${type}:\` directives on a single element`); +export function invalid_event_attribute_value(node) { + e(node, "invalid_event_attribute_value", "Event attribute must be a JavaScript expression, not a string"); } /** - * Cannot use `%type%:` alongside existing `%existing%:` directive + * '%name%' is not a valid attribute name * @param {null | number | NodeLike} node - * @param {string} type - * @param {string} existing + * @param {string} name * @returns {never} */ -export function transition_conflict(node, type, existing) { - e(node, "transition_conflict", `Cannot use \`${type}:\` alongside existing \`${existing}:\` directive`); +export function invalid_attribute_name(node, name) { + e(node, "invalid_attribute_name", `'${name}' is not a valid attribute name`); } /** @@ -496,6 +445,36 @@ export function invalid_title_content(node) { e(node, "invalid_title_content", "`` can only contain text and {tags}"); } +/** + * Valid event modifiers are %list% + * @param {null | number | NodeLike} node + * @param {string} list + * @returns {never} + */ +export function invalid_event_modifier(node, list) { + e(node, "invalid_event_modifier", `Valid event modifiers are ${list}`); +} + +/** + * Event modifiers other than 'once' can only be used on DOM elements + * @param {null | number | NodeLike} node + * @returns {never} + */ +export function invalid_component_event_modifier(node) { + e(node, "invalid_component_event_modifier", "Event modifiers other than 'once' can only be used on DOM elements"); +} + +/** + * The '%modifier1%' and '%modifier2%' modifiers cannot be used together + * @param {null | number | NodeLike} node + * @param {string} modifier1 + * @param {string} modifier2 + * @returns {never} + */ +export function invalid_event_modifier_combination(node, modifier1, modifier2) { + e(node, "invalid_event_modifier_combination", `The '${modifier1}' and '${modifier2}' modifiers cannot be used together`); +} + /** * Cyclical dependency detected: %cycle% * @param {null | number | NodeLike} node @@ -1382,6 +1361,27 @@ export function conflicting_slot_usage(node) { e(node, "conflicting_slot_usage", "Cannot use `<slot>` syntax and `{@render ...}` tags in the same component. Migrate towards `{@render ...}` tags completely."); } +/** + * Cannot use multiple `%type%:` directives on a single element + * @param {null | number | NodeLike} node + * @param {string} type + * @returns {never} + */ +export function transition_duplicate(node, type) { + e(node, "transition_duplicate", `Cannot use multiple \`${type}:\` directives on a single element`); +} + +/** + * Cannot use `%type%:` alongside existing `%existing%:` directive + * @param {null | number | NodeLike} node + * @param {string} type + * @param {string} existing + * @returns {never} + */ +export function transition_conflict(node, type, existing) { + e(node, "transition_conflict", `Cannot use \`${type}:\` alongside existing \`${existing}:\` directive`); +} + /** * `%name%` is an illegal variable name. To reference a global variable called `%name%`, use `globalThis.%name%` * @param {null | number | NodeLike} node diff --git a/packages/svelte/src/compiler/phases/2-analyze/validation.js b/packages/svelte/src/compiler/phases/2-analyze/validation.js index eaa486cd21..3875fa7098 100644 --- a/packages/svelte/src/compiler/phases/2-analyze/validation.js +++ b/packages/svelte/src/compiler/phases/2-analyze/validation.js @@ -51,7 +51,7 @@ function validate_component(node, context) { attribute.type === 'OnDirective' && (attribute.modifiers.length > 1 || attribute.modifiers.some((m) => m !== 'once')) ) { - e.invalid_component_event_modifier(attribute); + e.event_handler_invalid_component_modifier(attribute); } if (attribute.type === 'Attribute') { @@ -196,7 +196,7 @@ function validate_element(node, context) { for (const modifier of attribute.modifiers) { if (!EventModifiers.includes(modifier)) { const list = `${EventModifiers.slice(0, -1).join(', ')} or ${EventModifiers.at(-1)}`; - e.invalid_event_modifier(attribute, list); + e.event_handler_invalid_modifier(attribute, list); } if (modifier === 'passive') { has_passive_modifier = true; @@ -204,7 +204,11 @@ function validate_element(node, context) { conflicting_passive_modifier = modifier; } if (has_passive_modifier && conflicting_passive_modifier) { - e.invalid_event_modifier_combination(attribute, 'passive', conflicting_passive_modifier); + e.event_handler_invalid_modifier_combination( + attribute, + 'passive', + conflicting_passive_modifier + ); } } } diff --git a/packages/svelte/tests/validator/samples/component-event-modifiers-invalid/errors.json b/packages/svelte/tests/validator/samples/component-event-modifiers-invalid/errors.json index 14288a1385..ebd64adaab 100644 --- a/packages/svelte/tests/validator/samples/component-event-modifiers-invalid/errors.json +++ b/packages/svelte/tests/validator/samples/component-event-modifiers-invalid/errors.json @@ -1,7 +1,7 @@ [ { "message": "Event modifiers other than 'once' can only be used on DOM elements", - "code": "invalid_component_event_modifier", + "code": "event_handler_invalid_component_modifier", "start": { "line": 6, "column": 8 diff --git a/packages/svelte/tests/validator/samples/event-modifiers-invalid-nonpassive/errors.json b/packages/svelte/tests/validator/samples/event-modifiers-invalid-nonpassive/errors.json index c53951cb67..2739534fd1 100644 --- a/packages/svelte/tests/validator/samples/event-modifiers-invalid-nonpassive/errors.json +++ b/packages/svelte/tests/validator/samples/event-modifiers-invalid-nonpassive/errors.json @@ -1,7 +1,7 @@ [ { "message": "The 'passive' and 'nonpassive' modifiers cannot be used together", - "code": "invalid_event_modifier_combination", + "code": "event_handler_invalid_modifier_combination", "start": { "line": 1, "column": 5 diff --git a/packages/svelte/tests/validator/samples/event-modifiers-invalid-passive/errors.json b/packages/svelte/tests/validator/samples/event-modifiers-invalid-passive/errors.json index d1def4dcb3..98ea5d3a37 100644 --- a/packages/svelte/tests/validator/samples/event-modifiers-invalid-passive/errors.json +++ b/packages/svelte/tests/validator/samples/event-modifiers-invalid-passive/errors.json @@ -1,7 +1,7 @@ [ { "message": "The 'passive' and 'preventDefault' modifiers cannot be used together", - "code": "invalid_event_modifier_combination", + "code": "event_handler_invalid_modifier_combination", "start": { "line": 1, "column": 5 diff --git a/packages/svelte/tests/validator/samples/event-modifiers-invalid/errors.json b/packages/svelte/tests/validator/samples/event-modifiers-invalid/errors.json index 178a5b5543..8ea4809648 100644 --- a/packages/svelte/tests/validator/samples/event-modifiers-invalid/errors.json +++ b/packages/svelte/tests/validator/samples/event-modifiers-invalid/errors.json @@ -1,7 +1,7 @@ [ { "message": "Valid event modifiers are preventDefault, stopPropagation, stopImmediatePropagation, capture, once, passive, nonpassive, self or trusted", - "code": "invalid_event_modifier", + "code": "event_handler_invalid_modifier", "start": { "line": 1, "column": 8