diff --git a/.changeset/spotty-turkeys-sparkle.md b/.changeset/spotty-turkeys-sparkle.md new file mode 100644 index 0000000000..6464bd1e29 --- /dev/null +++ b/.changeset/spotty-turkeys-sparkle.md @@ -0,0 +1,5 @@ +--- +"svelte": patch +--- + +fix: allow boolean `contenteditable` attribute diff --git a/packages/svelte/src/compiler/errors.js b/packages/svelte/src/compiler/errors.js index f6f70ec3e3..f2207c9336 100644 --- a/packages/svelte/src/compiler/errors.js +++ b/packages/svelte/src/compiler/errors.js @@ -371,10 +371,6 @@ const errors = { // message: // "'contenteditable' attribute is required for textContent, innerHTML and innerText two-way bindings" // }, - // dynamic_contenteditable_attribute: { - // code: 'dynamic-contenteditable-attribute', - // message: "'contenteditable' attribute cannot be dynamic if element uses two-way binding" - // }, // textarea_duplicate_value: { // code: 'textarea-duplicate-value', // message: diff --git a/packages/svelte/src/compiler/phases/2-analyze/validation.js b/packages/svelte/src/compiler/phases/2-analyze/validation.js index fbf6392fba..27f61bf634 100644 --- a/packages/svelte/src/compiler/phases/2-analyze/validation.js +++ b/packages/svelte/src/compiler/phases/2-analyze/validation.js @@ -475,7 +475,7 @@ const validation = { ); if (!contenteditable) { error(node, 'missing-contenteditable-attribute'); - } else if (!is_text_attribute(contenteditable)) { + } else if (!is_text_attribute(contenteditable) && contenteditable.value !== true) { error(contenteditable, 'dynamic-contenteditable-attribute'); } } diff --git a/packages/svelte/tests/validator/samples/contenteditable-dynamic/errors.json b/packages/svelte/tests/validator/samples/contenteditable-dynamic/errors.json index 6272bc6d21..27cc3e98c7 100644 --- a/packages/svelte/tests/validator/samples/contenteditable-dynamic/errors.json +++ b/packages/svelte/tests/validator/samples/contenteditable-dynamic/errors.json @@ -3,11 +3,11 @@ "code": "dynamic-contenteditable-attribute", "message": "'contenteditable' attribute cannot be dynamic if element uses two-way binding", "start": { - "line": 6, + "line": 11, "column": 8 }, "end": { - "line": 6, + "line": 11, "column": 32 } } diff --git a/packages/svelte/tests/validator/samples/contenteditable-dynamic/input.svelte b/packages/svelte/tests/validator/samples/contenteditable-dynamic/input.svelte index 8dfa91a354..48b4eadbcc 100644 --- a/packages/svelte/tests/validator/samples/contenteditable-dynamic/input.svelte +++ b/packages/svelte/tests/validator/samples/contenteditable-dynamic/input.svelte @@ -3,4 +3,9 @@ let toggle = false; + + + + +