From e3ca80adf2962efa6ee0e8ba8a02a15e5d2fc8c8 Mon Sep 17 00:00:00 2001 From: Ariel Barreiro Date: Fri, 26 Jul 2024 12:43:03 -0300 Subject: [PATCH 1/4] fix: support attribute names according to html5 specs https://html.spec.whatwg.org/multipage/syntax.html#attributes-2 --- src/melody/melody-parser/CharStream.js | 2 +- src/melody/melody-parser/Lexer.js | 47 +++++++++++++++++++++++++- 2 files changed, 47 insertions(+), 2 deletions(-) diff --git a/src/melody/melody-parser/CharStream.js b/src/melody/melody-parser/CharStream.js index 4986c36b..01b44730 100644 --- a/src/melody/melody-parser/CharStream.js +++ b/src/melody/melody-parser/CharStream.js @@ -51,7 +51,7 @@ export class CharStream { lac(offset) { const index = this.index + offset; - return index < this.length ? this.input.charCodeAt(index) : EOF; + return index < this.length ? this.input.codePointAt(index) : EOF; } next() { diff --git a/src/melody/melody-parser/Lexer.js b/src/melody/melody-parser/Lexer.js index 789361f6..d66f108e 100644 --- a/src/melody/melody-parser/Lexer.js +++ b/src/melody/melody-parser/Lexer.js @@ -497,7 +497,7 @@ export default class Lexer { (c === 95 || isAlpha(c) || isDigit(c) || - (inElement && (c === 45 || c === 58))) + (inElement && isValidAttributeName(c))) ) { input.next(); } @@ -663,3 +663,48 @@ function isAlpha(c) { function isDigit(c) { return c >= 48 && c <= 57; } + +// https://html.spec.whatwg.org/multipage/syntax.html#attributes-2 +function isValidAttributeName(c) { + const is_c0_control = c >= 0 && c <= 31; + const is_control = is_c0_control || (c >= 127 && c <= 159); + const is_invalid = + c === 32 || c === 34 || c === 39 || c === 62 || c === 47 || c === 61; + const is_noncharacter = + (c >= 64976 && c <= 65007) || + c === 65534 || + c === 65535 || + c === 131070 || + c === 131071 || + c === 196606 || + c === 196607 || + c === 262142 || + c === 262143 || + c === 327678 || + c === 327679 || + c === 393214 || + c === 393215 || + c === 458750 || + c === 458751 || + c === 524286 || + c === 524287 || + c === 589822 || + c === 589823 || + c === 655358 || + c === 655359 || + c === 720894 || + c === 720895 || + c === 786430 || + c === 786431 || + c === 851966 || + c === 851967 || + c === 917502 || + c === 917503 || + c === 983038 || + c === 983039 || + c === 1048574 || + c === 1048575 || + c === 1114106 || + c === 1114107; + return !is_control && !is_invalid && !is_noncharacter; +} From d62f26b2e6d4dde9bd4b2c2ff2911faf1621c064 Mon Sep 17 00:00:00 2001 From: Ariel Barreiro Date: Fri, 26 Jul 2024 14:32:51 -0300 Subject: [PATCH 2/4] fix: better support twig expressions in attribute values --- src/melody/melody-parser/Lexer.js | 8 +++----- 1 file changed, 3 insertions(+), 5 deletions(-) diff --git a/src/melody/melody-parser/Lexer.js b/src/melody/melody-parser/Lexer.js index d66f108e..7138b089 100644 --- a/src/melody/melody-parser/Lexer.js +++ b/src/melody/melody-parser/Lexer.js @@ -561,17 +561,15 @@ export default class Lexer { matchAttributeValue(pos) { const input = this.input; const start = this.state === State.STRING_SINGLE ? "'" : '"'; - let c; - if (input.la(0) === "{") { + let c = input.la(0); + const c2 = input.la(1); + if (c === "{" && (c2 === "{" || c2 === "#" || c2 === "%")) { return this.matchExpressionToken(pos); } while ((c = input.la(0)) !== start && c !== EOF) { if (c === "\\" && input.la(1) === start) { input.next(); input.next(); - } else if (c === "{") { - // interpolation start - break; } else if (c === start) { break; } else { From a051466ab6cd4408c0095815aa3a85bd285136dc Mon Sep 17 00:00:00 2001 From: Ariel Barreiro Date: Fri, 26 Jul 2024 14:33:17 -0300 Subject: [PATCH 3/4] test: add a test containing common alpinejs odd attributes --- .../Element/__snapshots__/jsfmt.spec.js.snap | 123 ++++++++++++++++++ tests/Element/alpinejs.twig | 60 +++++++++ 2 files changed, 183 insertions(+) create mode 100644 tests/Element/alpinejs.twig diff --git a/tests/Element/__snapshots__/jsfmt.spec.js.snap b/tests/Element/__snapshots__/jsfmt.spec.js.snap index 3a690e79..4990cf0b 100644 --- a/tests/Element/__snapshots__/jsfmt.spec.js.snap +++ b/tests/Element/__snapshots__/jsfmt.spec.js.snap @@ -1,5 +1,128 @@ // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html +exports[`alpinejs.twig - twig-verify > alpinejs.twig 1`] = ` +
+ ... +
+ +
+ ... +
+ + + +
+ Copyright © + + +
+ +
+ ... +
+ +
+ + + Searching for: +
+ +
+ ... +
+ +
+ ... +
+ + + + + +
+ +
+ + + + +
+ ... +
+ +
+ ... +
+~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ +
+ ... +
+ +
+ ... +
+ + + +
+ Copyright © + + +
+ +
+ ... +
+ +
+ Searching for: +
+ +
+ ... +
+ +
+ ... +
+ + + + + +
+ +
+ + + + +
+ ... +
+ +
+ ... +
+ +`; + exports[`attributes.twig - twig-verify > attributes.twig 1`] = ` Link diff --git a/tests/Element/alpinejs.twig b/tests/Element/alpinejs.twig new file mode 100644 index 00000000..ef24abd3 --- /dev/null +++ b/tests/Element/alpinejs.twig @@ -0,0 +1,60 @@ +
+ ... +
+ +
+ ... +
+ + + +
+ Copyright © + + +
+ +
+ ... +
+ +
+ + + Searching for: +
+ +
+ ... +
+ +
+ ... +
+ + + + + +
+ +
+ + + + +
+ ... +
+ +
+ ... +
From 009a0e0ad09ad6192a55c978bedc42c2a5439308 Mon Sep 17 00:00:00 2001 From: zackad Date: Thu, 1 Aug 2024 09:51:02 +0700 Subject: [PATCH 4/4] docs: update changelog --- CHANGELOG.md | 3 +++ 1 file changed, 3 insertions(+) diff --git a/CHANGELOG.md b/CHANGELOG.md index 0ce6e422..653af289 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -8,6 +8,9 @@ - Package has been renamed `@zackad/prettier-plugin-twig-melody` -> `@zackad/prettier-plugin-twig` - The parser has been renamed from `melody` into `twig` +### Features +- Add support attribute names according to html5 specs + ### Internals - Remove npm script to publish - Integrate devenv into nix flakes